/*
 * @package: balaionci
 * Menu
*/
/* IDs */
.main-navigation a {
  font-size:1em;line-height:1.1em;
  font-family:var(--balaionci-type);text-transform:uppercase;
  color:var(--balaionci-junco);text-decoration:none;
  padding:0;transition:all 0.5s ease-out;
}
.main-navigation .sub-menu a {text-transform:unset;}
.main-navigation a:visited,
.main-navigation a li a,
#site-navigation .current-menu-item a .submenu a
  {color:var(--balaionci-junco);}
.main-navigation a:hover,
.main-navigation li:hover > a,
#site-navigation .current-menu-item a,
.main-navigation li.current-menu-ancestor > a,
.main-navigation li.current-menu-parent > a,
.main-navigation li.current-menu-item > a,
.main-navigation .sub-menu a:hover,
.main-navigation .sub-menu a:focus
  {color:var(--balaionci-blood) !important;}
.main-navigation .sub-menu .submenu a {color:var(--balaionci-clay);}
/* Styles Unsets */
.main-navigation ul {display:unset;list-style:none;margin:unset;padding-left:1px;}
.main-navigation ul ul{box-shadow:none;float:none;z-index:unset;position:unset;top:unset;left:unset;}
.main-navigation ul ul a {width:unset;}

/* NavBar */
.navbaro {
  position:fixed;z-index:3000;
  width:100vw;height:auto;display:flex;flex-direction:row;justify-content:flex-end;
  top:0;right:0;pointer-events:none;/*cliques quando fechado*/
}
.navbaro.active{background:#FFF;}
/* Hamburger */
.menu-toggle {
  position:relative;z-index:3001;
  margin:2em 3em 2em auto;
  width:30px;height:24px;
  display:flex;flex-direction:column;justify-content:space-between;
  background:transparent;border:none;cursor:pointer;
  padding:0;appearance:none;
  outline:none;pointer-events:auto; /*garante cliques*/
}
#page.inrolado .menu-toggle {margin:1em 1em 1em auto;}
.hamburger-line {
  width:100%;height:3px;background:var(--balaionci-junco);
  transition:all 0.3s ease;
}
.menu-toggle.active .hamburger-line:nth-child(1) {
  transform:rotate(45deg) translate(8px, 8px);
}
.menu-toggle.active .hamburger-line:nth-child(2) {opacity:0;}
.menu-toggle.active .hamburger-line:nth-child(3) {
  transform:rotate(-45deg) translate(6px, -8px);
}
.idioma-switch {position:fixed;z-index:3030;
  max-height:48px;pointer-events:auto;transition:all 0.3s ease;
}
.idioma-switch ul {
  gap:0.3em;display:flex;flex-direction:row;justify-content:flex-end;width:60%;
  min-width:auto;margin:auto;list-style:none;
}
.idioma-switch li {
  text-transform:uppercase;font-size:0.9em;line-height:1.2em;
  color:var(--balaionci-clay);
}
.idioma-switch li:first-child::after {
  content:"|";margin-left:3px;font-weight:normal;
}
.idioma-switch li:hover,.idioma-switch li.current-lang {
  background:none;color:var(--balaionci-junco);font-weight:bold;
}
/* NAV */
.main-navigation {
  position:fixed;z-index:3000;
  top:0;right:0;width:100vw;
  background:#fff;overflow-y:auto;
  -webkit-overflow-scrolling:touch;
  padding:8px 5% 8px;
  box-sizing:border-box;
  transform:translateX(100%);
  transition: transform 0.4s cubic-bezier(0.6, 0.04, 0.98, 0.33);
  pointer-events:none; /* desativado fechado */
  opacity:0;
}
ul#primary-menu {
  list-style:none;padding:1em 0;margin:0;
  display:flex;justify-content:space-between;
  flex-direction:column;gap:12px;
  background-image:url(../assets/graphs/id-palhas.png);
  background-size:auto 1.2em;
  background-position:top right;
  background-repeat:repeat-x;
  transition: transform 0.3s ease-in;
}
li.menu-item {position:relative;width:100%;}
li.menu-item > a {
  display:block;padding:14px 0;
  font-size:1.2rem;
  border-bottom:1px solid rgba(0,0,0,0.05);
}
.main-navigation li ul.sub-menu {
  z-index:1100;list-style:none;
  display:flex;flex-direction:column;gap:12px;
  padding-bottom:2em;
  top:0;left:100%;width:100%;
  margin:0;padding:8px 5% 8px;
  opacity:0;box-shadow:none;
  background:#fbfbfb;
  transition:transform 0.4s cubic-bezier(0.6, 0.04, 0.98, 0.33), opacity 0.2s ease;
  pointer-events:none;overflow-y:auto;
}
@media (max-width: 768px) {
  .navbaro {height:100vh;}
  .idioma-switch {top:2em;right:8em;}
  .home .idioma-switch {top:2em;left:4em;right:unset;}
  #page.inrolado .idioma-switch {top:1.5em;right:6em;}
  .main-navigation {height:100vh;
    display:flex;flex-direction:column;
    justify-content:flex-start;
    padding-bottom:3em;
  }
  .main-navigation.active {
    transform:translateX(0);pointer-events:auto;opacity:1;
  }
  /* Submenus */
  .main-navigation li ul.sub-menu {
    position:fixed;top:0;right:0;
    width:98vw;height:100vh;
    padding:8px 2% 8px 7%;
    box-sizing:border-box;
    transform:translateX(100%);
    opacity:0;visibility:hidden;
    pointer-events:none;
    transition: transform 0.4s cubic-bezier(0.6, 0.04, 0.98, 0.33);
    overflow-y:auto;-webkit-overflow-scrolling:touch;
    z-index:2999; /* abaixo do toggle, acima do principal */
    box-shadow:-2px 0px 3px rgba(108,70,20,0.5);
  }
  .main-navigation .menu-item-has-children.submenu-open > .sub-menu {
   left:3%;transform:translateX(3%);
   opacity:1;visibility:visible;
   pointer-events:auto;
 }
  .btn-back {
    position:relative;z-index:3;
    background:none;border:none;
    font-family:var(--balaionci-type);font-size:1.2rem;
    color:var(--balaionci-blood);cursor:pointer;
    padding:6px 9px;width:auto;margin:0 auto 0 0;
  }
  /* Impedir scroll do fundo */
  body.menu-open {overflow:hidden;}
}
/*==  DESKTOP (> 768px)=====*/
@media (min-width: 769px) {
  /* NavBar */
  .navbaro {pointer-events:unset;
    top:58px;display:flex;justify-content:flex-end;
    overflow-y:visible;transform:translateX(0%);
  }
  .home .navbaro {top:16vh;}
  #page.inrolado .navbaro {background:#FFF !important;top:0;box-shadow:0 2px 3px rgba(14,19,9,0.3)}
  .menu-toggle {display:none !important;}
  .idioma-switch {width:8%;right:62%;top:14px;}
  #page.inrolado .idioma-switch {top:16px;}
  /* NAV */
  .main-navigation {position:relative;
    width:62%;height:unset;
    background-color:transparent;overflow-y:visible;
    padding:0;
    transform:translateX(0);opacity:1;
    transition:background 0.2s ease;
    pointer-events:unset;
  }
  .main-navigation:hover {background-color:#FFF;box-shadow:3px 2px 3px rgba(14,19,9,0.2);padding-bottom:14px;}
  .main-navigation ul#primary-menu {margin-top:14px !important;}
  ul#primary-menu {flex-direction:row;gap:0;padding:1em 4% 0.5em 0;}
  ul#primary-menu:hover {}
  #page.inrolado .navbaro0:hover {border-bottom:1px solid #d0d0d0;}
  #page.inrolado ul#primary-menu:hover {border-bottom:none;}
  .main-navigation li.menu-item {
    width:unset;margin-top:0.74em;white-space:nowrap;
    text-align:center;position:relative;
  }
  .main-navigation ul#primary-menu > li.menu-item {width:25%;position: relative;z-index:3000;}
  .main-navigation ul#primary-menu > li.menu-item:nth-child(2) {z-index:4000;}
  li.menu-item > a {
    font-size:unset;display:block;padding:unset;border-bottom:0;
  }
  /* Submenus */
  .main-navigation li ul.sub-menu {
    top:100%;left:0;
    margin:1em 0 0 0;margin-top:0;gap:0;
    right:0;height:1px;
    padding:3px 1px;padding-top:3px !important;
    opacity:0;visibility:hidden;
    background:transparent;
    transition: opacity .22s ease, visibility .22s, height 2s;
    overflow:hidden;
  }
  .main-navigation li:hover > ul.sub-menu,
  .main-navigation li:active > ul.sub-menu {
    opacity:1;visibility:visible;pointer-events:auto;
    min-height:1.5em;height:auto;
  }
  .main-navigation .sub-menu > li {margin:2px auto;padding:2px 1px;}
  .menu-item-has-children {}
  .main-navigation li.horizontal-submenu {position:relative;}
  .main-navigation li.horizontal-submenu > ul.sub-menu {
    flex-direction:row;flex-wrap:nowrap;justify-content:space-around;
    overflow:visible;width:400%;margin-left:-100%;
  }
  .horizontal-submenu > .sub-menu > .menu-item {
    flex:1;min-width:fit-content;padding:1px;
  }
  .horizontal-submenu > .sub-menu > .menu-item-has-children > .sub-menu {
    opacity:1 !important;visibility:visible !important;
    display:flex;flex-direction:column;
    height:auto;padding:0;margin:0;
    border:none;background-color:transparent;
    box-shadow:none;
  }
}