/*
 * TEM TOP NAV MODEL 3 V1 20260816
 * Modelo aprovado: glassmorphism + icones lineares.
 */

.tem-top-nav{
  display:flex !important;
  align-items:center !important;
  gap:5px !important;
  min-width:0 !important;
}

.tem-top-nav .tem-nav-model3-button{
  position:relative !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:8px !important;
  min-height:40px !important;
  padding:0 12px !important;
  border:1px solid transparent !important;
  border-radius:10px !important;
  color:#a9c1de !important;
  background:transparent !important;
  box-shadow:none !important;
  text-shadow:none !important;
  font-weight:700 !important;
  letter-spacing:-.1px !important;
  overflow:hidden !important;
  isolation:isolate !important;
  transition:
    color .18s ease,
    background .18s ease,
    border-color .18s ease,
    box-shadow .18s ease,
    transform .18s ease !important;
}

.tem-top-nav .tem-nav-model3-button .nav-text{
  position:relative !important;
  z-index:2 !important;
  color:inherit !important;
  white-space:nowrap !important;
}

.tem-top-nav .tem-nav-model3-button > .nav-icon:not(.tem-nav-model3-icon){
  display:none !important;
}

.tem-nav-model3-icon{
  position:relative !important;
  z-index:2 !important;
  width:18px !important;
  height:18px !important;
  min-width:18px !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  color:#94b4d9 !important;
  opacity:.95 !important;
  transition:
    color .18s ease,
    filter .18s ease,
    transform .18s ease !important;
}

.tem-nav-model3-icon svg{
  width:18px !important;
  height:18px !important;
  display:block !important;
  fill:none !important;
  stroke:currentColor !important;
  stroke-width:1.8 !important;
  stroke-linecap:round !important;
  stroke-linejoin:round !important;
}

.tem-top-nav .tem-nav-model3-button:hover:not(.active){
  color:#e9f4ff !important;
  background:
    linear-gradient(
      180deg,
      rgba(255,255,255,.055),
      rgba(61,145,237,.035)
    ) !important;
  border-color:rgba(117,174,231,.16) !important;
}

.tem-top-nav .tem-nav-model3-button:hover:not(.active) .tem-nav-model3-icon{
  color:#70b9ff !important;
  transform:translateY(-1px) !important;
}

.tem-top-nav .tem-nav-model3-button.active,
.tem-top-nav .tem-nav-model3-button[aria-current="page"]{
  color:#ffffff !important;
  border-color:rgba(114,176,235,.72) !important;
  background:
    linear-gradient(
      180deg,
      rgba(77,111,153,.46) 0%,
      rgba(35,75,121,.50) 47%,
      rgba(20,61,107,.60) 100%
    ) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.16),
    inset 0 -2px 0 rgba(39,166,255,.92),
    0 7px 15px rgba(0,25,55,.16),
    0 3px 9px rgba(25,137,237,.10) !important;
  text-shadow:0 1px 1px rgba(0,15,35,.18) !important;
}

.tem-top-nav .tem-nav-model3-button.active::before,
.tem-top-nav .tem-nav-model3-button[aria-current="page"]::before{
  content:"" !important;
  position:absolute !important;
  z-index:1 !important;
  top:-16px !important;
  left:52% !important;
  width:46px !important;
  height:76px !important;
  transform:rotate(34deg) !important;
  background:
    linear-gradient(
      90deg,
      rgba(255,255,255,0),
      rgba(255,255,255,.10),
      rgba(255,255,255,0)
    ) !important;
  pointer-events:none !important;
}

.tem-top-nav .tem-nav-model3-button.active::after,
.tem-top-nav .tem-nav-model3-button[aria-current="page"]::after{
  content:"" !important;
  position:absolute !important;
  z-index:0 !important;
  left:10% !important;
  right:10% !important;
  bottom:-3px !important;
  height:5px !important;
  border-radius:999px !important;
  background:rgba(31,156,255,.72) !important;
  filter:blur(5px) !important;
  pointer-events:none !important;
}

.tem-top-nav .tem-nav-model3-button.active .tem-nav-model3-icon,
.tem-top-nav .tem-nav-model3-button[aria-current="page"] .tem-nav-model3-icon{
  color:#4bb5ff !important;
  filter:drop-shadow(0 0 4px rgba(30,157,255,.32)) !important;
}

.tem-top-global{
  background:
    linear-gradient(
      100deg,
      #071a30 0%,
      #0a2748 58%,
      #0b2d55 100%
    ) !important;
}

@media(max-width:1500px){
  .tem-top-nav{
    gap:2px !important;
  }

  .tem-top-nav .tem-nav-model3-button{
    gap:6px !important;
    padding-left:9px !important;
    padding-right:9px !important;
  }

  .tem-nav-model3-icon,
  .tem-nav-model3-icon svg{
    width:16px !important;
    height:16px !important;
    min-width:16px !important;
  }
}

@media(max-width:1180px){
  .tem-top-nav .tem-nav-model3-button{
    min-height:36px !important;
    gap:5px !important;
    padding-left:7px !important;
    padding-right:7px !important;
  }

  .tem-top-nav .tem-nav-model3-button .nav-text{
    font-size:12px !important;
  }

  .tem-nav-model3-icon,
  .tem-nav-model3-icon svg{
    width:15px !important;
    height:15px !important;
    min-width:15px !important;
  }
}

/*
 * TEM TOP NAV MODEL3 POLISH V1 20260816
 *
 * Acabamento visual fiel a previa aprovada:
 * - vidro azul mais perceptivel
 * - reflexo superior mais visivel
 * - borda azul clara
 * - glow inferior reforcado
 * - sem alterar altura do shell nem logica do menu
 */

.tem-top-nav .tem-nav-model3-button{
  border-radius:11px !important;
}

/* Estado ativo refinado */
.tem-top-nav .tem-nav-model3-button.active,
.tem-top-nav .tem-nav-model3-button[aria-current="page"]{
  color:#ffffff !important;

  border:
    1px solid rgba(112,182,242,.58) !important;

  background:
    linear-gradient(
      180deg,
      rgba(72,111,157,.56) 0%,
      rgba(39,82,132,.58) 44%,
      rgba(22,63,111,.68) 100%
    ) !important;

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.20),
    inset 0 -2px 0 rgba(42,170,255,.96),
    inset 0 0 18px rgba(72,148,226,.08),
    0 0 0 1px rgba(60,143,222,.08),
    0 7px 16px rgba(1,19,42,.22),
    0 4px 12px rgba(24,137,237,.16) !important;

  text-shadow:
    0 1px 1px rgba(0,10,28,.25),
    0 0 8px rgba(255,255,255,.05) !important;
}

/* Reflexo diagonal de vidro mais evidente */
.tem-top-nav .tem-nav-model3-button.active::before,
.tem-top-nav .tem-nav-model3-button[aria-current="page"]::before{
  content:"" !important;
  position:absolute !important;
  z-index:1 !important;

  top:-22px !important;
  left:56% !important;

  width:52px !important;
  height:92px !important;

  transform:rotate(34deg) !important;

  background:
    linear-gradient(
      90deg,
      rgba(255,255,255,0) 0%,
      rgba(255,255,255,.035) 30%,
      rgba(255,255,255,.15) 52%,
      rgba(255,255,255,.025) 72%,
      rgba(255,255,255,0) 100%
    ) !important;

  opacity:.9 !important;
  pointer-events:none !important;
}

/* Linha luminosa inferior definida + halo */
.tem-top-nav .tem-nav-model3-button.active::after,
.tem-top-nav .tem-nav-model3-button[aria-current="page"]::after{
  content:"" !important;
  position:absolute !important;
  z-index:3 !important;

  left:9% !important;
  right:9% !important;
  bottom:-1px !important;

  height:2px !important;

  border-radius:999px !important;

  background:
    linear-gradient(
      90deg,
      rgba(29,142,245,0),
      rgba(38,172,255,.98) 18%,
      rgba(53,185,255,1) 50%,
      rgba(38,172,255,.98) 82%,
      rgba(29,142,245,0)
    ) !important;

  box-shadow:
    0 0 5px rgba(38,172,255,.72),
    0 0 10px rgba(28,145,255,.42) !important;

  filter:none !important;
  pointer-events:none !important;
}

/* Icone ativo com destaque semelhante a previa */
.tem-top-nav
.tem-nav-model3-button.active
.tem-nav-model3-icon,
.tem-top-nav
.tem-nav-model3-button[aria-current="page"]
.tem-nav-model3-icon{
  color:#52baff !important;

  filter:
    drop-shadow(
      0 0 4px rgba(34,160,255,.42)
    ) !important;
}

/* Mantem inativos discretos e elegantes */
.tem-top-nav
.tem-nav-model3-button:not(.active):not([aria-current="page"]){
  color:#b2c8e2 !important;
}

/* Hover sem competir com a aba ativa */
.tem-top-nav
.tem-nav-model3-button:hover:not(.active):not([aria-current="page"]){
  color:#f4f9ff !important;

  background:
    linear-gradient(
      180deg,
      rgba(255,255,255,.06),
      rgba(45,126,210,.045)
    ) !important;

  border-color:
    rgba(100,166,229,.18) !important;
}

/*
 * TEM TOP NAV MODEL3 REFINED V2 20260816
 *
 * Estado visual aprovado na previa:
 * - cabecalho continua compacto
 * - vidro azul nitido no grupo ativo
 * - borda azul fina
 * - reflexo diagonal interno
 * - brilho azul inferior definido
 * - icone ativo com leve glow
 */

.tem-top-nav .tem-nav-model3-button{
  min-height:38px !important;
  gap:7px !important;
  padding:0 12px !important;
  border-radius:10px !important;
  border:1px solid transparent !important;
  color:#c1d4e9 !important;
  background:transparent !important;
}

.tem-top-nav .tem-nav-model3-button.active,
.tem-top-nav .tem-nav-model3-button[aria-current="page"]{
  color:#ffffff !important;
  border-color:rgba(100,178,240,.58) !important;
  background:
    linear-gradient(
      180deg,
      rgba(69,109,158,.58) 0%,
      rgba(37,82,134,.64) 48%,
      rgba(19,59,105,.76) 100%
    ) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.18),
    inset 0 -2px 0 rgba(38,170,255,.98),
    0 5px 12px rgba(0,21,48,.22),
    0 2px 8px rgba(28,139,240,.14) !important;
  text-shadow:0 1px 1px rgba(0,12,30,.22) !important;
}

.tem-top-nav .tem-nav-model3-button.active::before,
.tem-top-nav .tem-nav-model3-button[aria-current="page"]::before{
  content:"" !important;
  position:absolute !important;
  z-index:1 !important;
  top:-24px !important;
  left:56% !important;
  width:54px !important;
  height:92px !important;
  transform:rotate(33deg) !important;
  background:
    linear-gradient(
      90deg,
      rgba(255,255,255,0),
      rgba(255,255,255,.03) 25%,
      rgba(255,255,255,.16) 52%,
      rgba(255,255,255,.03) 75%,
      rgba(255,255,255,0)
    ) !important;
  opacity:1 !important;
  pointer-events:none !important;
}

.tem-top-nav .tem-nav-model3-button.active::after,
.tem-top-nav .tem-nav-model3-button[aria-current="page"]::after{
  content:"" !important;
  position:absolute !important;
  z-index:3 !important;
  left:9% !important;
  right:9% !important;
  bottom:-1px !important;
  height:2px !important;
  border-radius:999px !important;
  background:
    linear-gradient(
      90deg,
      rgba(29,142,245,0),
      rgba(38,172,255,.98) 18%,
      rgba(53,185,255,1) 50%,
      rgba(38,172,255,.98) 82%,
      rgba(29,142,245,0)
    ) !important;
  box-shadow:
    0 0 5px rgba(38,172,255,.72),
    0 0 10px rgba(28,145,255,.42) !important;
  filter:none !important;
  pointer-events:none !important;
}

.tem-top-nav .tem-nav-model3-button .tem-nav-model3-icon,
.tem-top-nav .tem-nav-model3-button .tem-nav-model3-icon svg{
  width:17px !important;
  height:17px !important;
  min-width:17px !important;
}

.tem-top-nav
.tem-nav-model3-button.active
.tem-nav-model3-icon,
.tem-top-nav
.tem-nav-model3-button[aria-current="page"]
.tem-nav-model3-icon{
  color:#54bcff !important;
  filter:
    drop-shadow(
      0 0 4px rgba(34,160,255,.42)
    ) !important;
}

.tem-top-nav
.tem-nav-model3-button:not(.active):not([aria-current="page"]){
  color:#c1d4e9 !important;
  background:transparent !important;
  border-color:transparent !important;
  box-shadow:none !important;
}

.tem-top-nav
.tem-nav-model3-button:hover:not(.active):not([aria-current="page"]){
  color:#ffffff !important;
  background:rgba(255,255,255,.035) !important;
  border-color:rgba(100,166,229,.12) !important;
}

/*
 * TEM TOP NAV MODEL3 REAL TRIGGER BRIDGE V1 20260816
 *
 * O Top Shell marca como ativo o link interno do submenu:
 *   .tem-top-submenu-link.active
 *
 * O botao visivel superior e:
 *   .tem-top-nav-trigger
 *
 * Esta ponte aplica o visual refinado aprovado diretamente
 * ao trigger real do grupo que contem o link ativo.
 */

.tem-top-nav
.tem-top-nav-item:has(.tem-top-submenu-link.active)
> .tem-top-nav-trigger{
  position:relative !important;
  overflow:hidden !important;
  isolation:isolate !important;

  min-height:38px !important;
  gap:7px !important;
  padding:0 12px !important;
  border-radius:10px !important;

  color:#ffffff !important;

  border:
    1px solid rgba(100,178,240,.58) !important;

  background:
    linear-gradient(
      180deg,
      rgba(69,109,158,.58) 0%,
      rgba(37,82,134,.64) 48%,
      rgba(19,59,105,.76) 100%
    ) !important;

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.18),
    inset 0 -2px 0 rgba(38,170,255,.98),
    0 5px 12px rgba(0,21,48,.22),
    0 2px 8px rgba(28,139,240,.14) !important;

  text-shadow:
    0 1px 1px rgba(0,12,30,.22) !important;
}

/*
 * O Top Shell possui regra especifica para grupo aberto.
 * Repetimos a mesma aparencia para impedir que o clique no
 * menu troque o vidro refinado pelo fundo antigo.
 */
.tem-top-nav
.tem-top-nav-item.open:has(.tem-top-submenu-link.active)
> .tem-top-nav-trigger{
  color:#ffffff !important;

  border:
    1px solid rgba(100,178,240,.58) !important;

  background:
    linear-gradient(
      180deg,
      rgba(69,109,158,.58) 0%,
      rgba(37,82,134,.64) 48%,
      rgba(19,59,105,.76) 100%
    ) !important;

  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.18),
    inset 0 -2px 0 rgba(38,170,255,.98),
    0 5px 12px rgba(0,21,48,.22),
    0 2px 8px rgba(28,139,240,.14) !important;
}

/* Reflexo diagonal de vidro */
.tem-top-nav
.tem-top-nav-item:has(.tem-top-submenu-link.active)
> .tem-top-nav-trigger::before{
  content:"" !important;
  position:absolute !important;
  z-index:1 !important;

  top:-24px !important;
  left:56% !important;

  width:54px !important;
  height:92px !important;

  transform:rotate(33deg) !important;

  background:
    linear-gradient(
      90deg,
      rgba(255,255,255,0),
      rgba(255,255,255,.03) 25%,
      rgba(255,255,255,.16) 52%,
      rgba(255,255,255,.03) 75%,
      rgba(255,255,255,0)
    ) !important;

  opacity:1 !important;
  pointer-events:none !important;
}

/* Linha luminosa azul inferior */
.tem-top-nav
.tem-top-nav-item:has(.tem-top-submenu-link.active)
> .tem-top-nav-trigger::after{
  content:"" !important;
  position:absolute !important;
  z-index:3 !important;

  left:9% !important;
  right:9% !important;
  bottom:-1px !important;

  height:2px !important;

  border-radius:999px !important;

  background:
    linear-gradient(
      90deg,
      rgba(29,142,245,0),
      rgba(38,172,255,.98) 18%,
      rgba(53,185,255,1) 50%,
      rgba(38,172,255,.98) 82%,
      rgba(29,142,245,0)
    ) !important;

  box-shadow:
    0 0 5px rgba(38,172,255,.72),
    0 0 10px rgba(28,145,255,.42) !important;

  filter:none !important;
  pointer-events:none !important;
}

/* Icone do grupo ativo */
.tem-top-nav
.tem-top-nav-item:has(.tem-top-submenu-link.active)
> .tem-top-nav-trigger
.tem-nav-model3-icon{
  position:relative !important;
  z-index:2 !important;

  color:#54bcff !important;

  filter:
    drop-shadow(
      0 0 4px rgba(34,160,255,.42)
    ) !important;
}

/* Texto e SVG ficam acima do reflexo */
.tem-top-nav
.tem-top-nav-item:has(.tem-top-submenu-link.active)
> .tem-top-nav-trigger
.tem-nav-model3-icon,
.tem-top-nav
.tem-top-nav-item:has(.tem-top-submenu-link.active)
> .tem-top-nav-trigger
.nav-text{
  position:relative !important;
  z-index:2 !important;
}