/* Header profissional 100 Anotar — sem Whaticket.
   Aplicado somente no front. O JS bloqueia /admin.
*/
html,body{max-width:100%;overflow-x:hidden}
body.header100-ready{padding-top:0!important}
body.header100-ready .header100-shell,
body.header100-ready .header100-shell *{box-sizing:border-box}

.header100-shell{
  position:sticky;
  top:0;
  z-index:99990;
  width:100%;
  background:#070b16;
  border-bottom:1px solid rgba(255,255,255,.10);
  box-shadow:0 16px 34px rgba(0,0,0,.26);
}

.header100-inner{
  max-width:1180px;
  min-height:72px;
  margin:0 auto;
  padding:10px 18px;
  display:grid;
  grid-template-columns:auto auto auto 1fr auto;
  align-items:center;
  gap:16px;
}

.header100-logo{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:48px;
  height:48px;
  border-radius:16px;
  overflow:hidden;
  text-decoration:none;
  background:#101827;
  border:1px solid rgba(255,255,255,.08);
}

.header100-logo img{
  width:100%;
  height:100%;
  object-fit:contain;
  display:block;
}

.header100-logo-mark{
  width:100%;
  height:100%;
  display:grid;
  place-items:center;
  background:#e11d48;
  color:#fff;
  font-weight:1000;
  font-size:16px;
}

.header100-nav{
  display:inline-flex;
  align-items:center;
  gap:9px;
}

.header100-nav a,
.header100-menu-btn,
.header100-lang-btn,
.header100-dropdown a,
.header100-lang-menu a{
  min-height:40px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.12);
  background:#111827;
  color:#f8fafc;
  text-decoration:none;
  font-family:Arial,Helvetica,sans-serif;
  font-size:14px;
  font-weight:900;
  line-height:1;
  padding:0 17px;
  cursor:pointer;
  white-space:nowrap;
}

.header100-nav a:hover,
.header100-menu-btn:hover,
.header100-lang-btn:hover,
.header100-dropdown a:hover,
.header100-lang-menu a:hover{
  background:#182236;
}

.header100-lang,
.header100-menu{
  position:relative;
  display:inline-flex;
  align-items:center;
}

.header100-lang-btn{
  gap:8px;
  min-width:112px;
}

.header100-menu-btn{
  width:44px;
  min-width:44px;
  padding:0;
}

.header100-grid-icon{
  width:18px;
  height:18px;
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:3px;
}

.header100-grid-icon i{
  display:block;
  width:4px;
  height:4px;
  border-radius:2px;
  background:#f8fafc;
}

.header100-dropdown,
.header100-lang-menu{
  display:none;
  position:absolute;
  top:calc(100% + 10px);
  right:0;
  width:246px;
  padding:10px;
  border-radius:22px;
  background:#0b1220;
  border:1px solid rgba(255,255,255,.12);
  box-shadow:0 24px 70px rgba(0,0,0,.38);
  z-index:100000;
}

.header100-lang-menu{
  left:0;
  right:auto;
  width:190px;
}

.header100-menu.open .header100-dropdown,
.header100-lang.open .header100-lang-menu{
  display:grid;
  gap:8px;
}

.header100-dropdown a,
.header100-lang-menu a{
  width:100%;
  justify-content:flex-start;
  border-radius:14px;
  padding:0 13px;
}

.header100-dropdown a.header100-register{
  background:#22c55e;
  color:#03110a;
  border-color:#22c55e;
}

.header100-dropdown a.header100-login{
  background:#172033;
}

.header100-dropdown a.header100-back{
  background:#0f172a;
  color:#e2e8f0;
}

/* Remove parte Whaticket em qualquer sobra antiga */
a[href*="whaticket-web"],
button[href*="whaticket-web"],
.whaticket100{
  display:none!important;
}

@media(max-width:820px){
  .header100-inner{
    min-height:60px;
    grid-template-columns:auto auto auto 1fr auto;
    gap:7px;
    padding:8px 10px;
  }

  .header100-logo{
    width:42px;
    height:42px;
    border-radius:14px;
  }

  .header100-nav{
    gap:7px;
  }

  .header100-nav a,
  .header100-menu-btn,
  .header100-lang-btn{
    min-height:34px;
    height:34px;
    font-size:12.5px;
    padding:0 11px;
  }

  .header100-lang-btn{
    width:40px;
    min-width:40px;
    padding:0;
  }

  .header100-lang-text{
    display:none;
  }

  .header100-menu-btn{
    width:38px;
    min-width:38px;
  }

  .header100-dropdown{
    right:0;
    width:min(260px, calc(100vw - 20px));
  }

  .header100-lang-menu{
    left:50%;
    transform:translateX(-50%);
    width:180px;
  }
}

@media(max-width:380px){
  .header100-inner{
    gap:5px;
    padding-left:8px;
    padding-right:8px;
  }

  .header100-logo{
    width:38px;
    height:38px;
  }

  .header100-nav a{
    min-height:32px;
    height:32px;
    font-size:11.8px;
    padding:0 9px;
  }

  .header100-lang-btn,
  .header100-menu-btn{
    width:34px;
    min-width:34px;
    height:32px;
    min-height:32px;
  }
}