/* ==========================================================================
   AutoStyle — Header do site a PRETO com o logo (pedido do cliente).
   Carregado em TODO o site (o header é o mesmo em todas as páginas).

   DECISÃO DE SCOPE (pós-revisão adversarial):
   - Pretamos TODAS as linhas do header (.site-header-row) — desktop E mobile
     (header-topbar/header-main/header-bottom/header-sub) — para não haver
     linhas meio-pretas meio-claras nem o logo invertido a cair sobre fundo
     claro num breakpoint. Consistente em todos os ecrãs.
   - Texto BRANCO só nos elementos QUE ESTÃO na barra (nav de topo, links/
     ícones de ação, botão de categorias). Os painéis flyout (mini-carrinho,
     conta, pesquisa, sub-menus, categorias, drawer mobile) recebem reset
     EXPLÍCITO para texto ESCURO sobre fundo claro — senão ficavam
     branco-sobre-branco e ilegíveis (bug apanhado na revisão).
   - Classes reais do tema Ignavo (verificadas nos templates em disco).
   - O logo (mainlogo.png) é monocromático escuro → invertido para branco.
   - A barra de pesquisa vermelha do cliente (.tp-ai-search-bar) NÃO é tocada
     aqui (o CSS próprio do cliente pinta-a de vermelho).
   ========================================================================== */

/* ─── Fundo preto de todas as linhas do header ───────────────────────── */
.site-header,
.site-header .site-header-row,
.site-header .header-topbar,
.site-header .header-main,
.site-header .header-bottom,
.site-header .header-sub {
    background-color: #111114 !important;
    border-color: #26262b !important;
}

/* ─── Elementos NA barra → texto/ícones brancos ──────────────────────── */
/* Navegação (níveis de topo, todas as linhas) */
.site-header .site-navigation > ul > li > a,
.site-header .menu > li > a,
.site-header nav > ul > li > a,
/* Ações: conta, carrinho, pesquisa, categorias */
.site-header .site-action-link,
.site-header .site-action-label,
.site-header .site-action-sublabel,
.site-header .site-action-detail,
.site-header .site-header-custom-button,
.site-header .header-topbar span {
    color: #f3f3f5 !important;
}
.site-header .site-action-icon svg,
.site-header .site-action-link > svg,
.site-header .site-header-custom-button svg,
.site-header .header-topbar .menu-item > a {
    color: #f3f3f5 !important;
    stroke: currentColor;
}
/* Hover a vermelho nos elementos da barra */
.site-header .site-navigation > ul > li > a:hover,
.site-header .menu > li > a:hover,
.site-header .site-action-link:hover,
.site-header .site-header-custom-button:hover,
.site-header .header-topbar .menu-item > a:hover {
    color: #e10600 !important;
}

/* Logo da configuração TP (colorido — traço vermelho + texto claro, feito
   para fundo escuro). NÃO inverter (a inversão tirava-lhe a cor). */
.site-header .custom-logo,
.site-header .custom-logo-link img,
.site-header .site-branding img,
.site-header .site-logo img {
    filter: none !important;
}

/* Menu do header SEMPRE em MAIÚSCULAS (todas as línguas — pedido do cliente).
   A versão PT já vinha em maiúsculas; as outras línguas não. */
.site-header .site-navigation > ul > li > a,
.site-header .menu > li > a,
.site-header nav > ul > li > a,
.site-header .header-main .menu-item > a {
    text-transform: uppercase !important;
    letter-spacing: .02em;
}

/* ─── DROPDOWNS / FLYOUTS / DRAWERS — fundo claro, texto ESCURO ───────
   (regras DEPOIS das de cima para vencerem na cascata; cobrem os painéis
   reais do Ignavo). Impede branco-sobre-branco em todo o site.           */
.site-header .sub-menu,
.site-header .site-action-dropdown,
.site-header .site-dropdown,
.site-header .site-dropdown-inner,
.site-header .site-custom-dropdown,
.site-header .custom-dropdown-inner,
.site-header .custom-dropdown-footer,
.site-header .login-dropdown,
.site-header .dropdown-login,
.site-header .site-mini-cart,
.site-header .fl-mini-cart-content,
.site-header .site-navigation.navigation-dropdown,
.site-header .drawer-primary-menu,
.site-header .canvas-menu {
    background-color: #ffffff !important;
    color: #1a1a1e !important;
    border-color: #e6e8ec !important;
}
.site-header .sub-menu a,
.site-header .site-action-dropdown a,
.site-header .site-dropdown a,
.site-header .site-dropdown-inner a,
.site-header .site-custom-dropdown a,
.site-header .login-dropdown a,
.site-header .site-mini-cart a,
.site-header .fl-mini-cart-content a,
.site-header .site-navigation.navigation-dropdown a,
.site-header .drawer-primary-menu a,
.site-header .canvas-menu a {
    color: #1a1a1e !important;
}
.site-header .sub-menu a:hover,
.site-header .site-action-dropdown a:hover,
.site-header .site-dropdown-inner a:hover,
.site-header .site-mini-cart a:hover,
.site-header .site-navigation.navigation-dropdown a:hover,
.site-header .drawer-primary-menu a:hover {
    color: #e10600 !important;
}
/* Ícones dentro dos dropdowns (ex.: remover item do carrinho) → escuros */
.site-header .site-action-dropdown svg,
.site-header .site-mini-cart svg,
.site-header .fl-mini-cart-content svg,
.site-header .site-navigation.navigation-dropdown svg {
    color: #1a1a1e !important;
}

/* Botão "Todas as Categorias" com contorno visível no preto */
.site-header .site-header-custom-button {
    border-color: #3a3a41 !important;
}

/* ─── Seletor de idioma (bandeiras) no header — padrão dos sites geridos ── */
.site-header .as-lang { position: relative; display: inline-flex; align-items: center; margin: 0 12px 0 2px; }
.site-header .as-lang__btn {
    display: inline-flex; align-items: center; gap: 7px;
    background: transparent; border: 0; cursor: pointer;
    color: #f3f3f5 !important; font-weight: 700; font-size: 13px;
    padding: 6px 8px; line-height: 1;
}
.site-header .as-lang__btn:hover { color: #e10600 !important; }
.site-header .as-lang__flag { border-radius: 3px; box-shadow: 0 0 0 1px rgba(255,255,255,.2); display: block; flex: 0 0 auto; }
.site-header .as-lang__code { letter-spacing: .04em; }
.site-header .as-lang__chev { transition: transform .15s ease; }
.site-header .as-lang.is-open .as-lang__chev { transform: rotate(180deg); }
.site-header .as-lang__menu {
    position: absolute; top: calc(100% + 8px); right: 0; z-index: 9999;
    min-width: 190px; margin: 0; padding: 6px; list-style: none;
    background: #fff; border: 1px solid #e6e8ec; border-radius: 10px;
    box-shadow: 0 14px 34px rgba(0,0,0,.22);
    opacity: 0; visibility: hidden; transform: translateY(-6px);
    transition: opacity .15s ease, transform .15s ease, visibility .15s;
}
.site-header .as-lang.is-open .as-lang__menu { opacity: 1; visibility: visible; transform: translateY(0); }
.site-header .as-lang__menu a { text-decoration: none; }
.site-header .as-lang__opt {
    display: flex; align-items: center; gap: 10px;
    padding: 9px 10px; border-radius: 7px;
    color: #1a1a1e !important; font-size: 14px; font-weight: 600;
}
.site-header .as-lang__opt:hover { background: #f5f6f8; color: #e10600 !important; }
.site-header .as-lang__opt.is-active { background: #fdecec; color: #e10600 !important; }
.site-header .as-lang__name { flex: 1; }
.site-header .as-lang__mini { font-size: 11px; color: #9a9aa2; font-weight: 700; }
.site-header .as-lang__opt:hover .as-lang__mini,
.site-header .as-lang__opt.is-active .as-lang__mini { color: #e10600; }

/* ─── Botão WhatsApp: subir no MOBILE para não bater na barra de navegação
   inferior do Ignavo (mesmo espírito do fix dos sites geridos). ─────────── */
@media (max-width: 1023px) {
    .wa__btn_popup { bottom: 92px !important; }
    .wa__popup_chat_box { bottom: 162px !important; }
}