/*
 * Quality Theme 1.0.21 — Header Native
 * Conta, carrinho e wishlist usam uma única fonte visual.
 */

.quality-native-ui .site-header .header-icon,
.quality-native-ui .site-header .header-icon > a,
.quality-native-ui .site-header .quality-header-wishlist,
.quality-native-ui .site-header .quality-header-wishlist > a {
    color: #333e48;
}

.quality-native-ui .site-header .header-icons {
    display: flex;
    align-items: center;
    gap: 20px;
}

.quality-native-ui .site-header .header-icon,
.quality-native-ui .site-header .quality-header-wishlist {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 34px;
    min-height: 34px;
    overflow: visible;
}

.quality-native-ui .site-header .header-icon > a,
.quality-native-ui .site-header .quality-header-wishlist > a {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 34px;
    min-height: 34px;
    text-decoration: none;
    overflow: visible;
}

.quality-native-ui .quality-header-icon {
    display: block;
    width: 24px;
    height: 24px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
    opacity: 1;
    visibility: visible;
}

.quality-native-ui .quality-header-account-icon {
    width: 23px;
    height: 23px;
}

.quality-native-ui .quality-header-cart-icon {
    width: 24px;
    height: 24px;
}

/* Wishlist keeps its own SVG but follows the same weight and size. */
.quality-native-ui .site-header .quality-header-heart {
    display: block;
    width: 24px !important;
    height: 24px !important;
    fill: none !important;
    stroke: currentColor !important;
    stroke-width: 1.8 !important;
    opacity: 1 !important;
    visibility: visible !important;
}

/* Same badge geometry for wishlist and cart. */
.quality-native-ui .site-header .header-icon-counter,
.quality-native-ui .site-header .cart-items-count,
.quality-native-ui .site-header .quality-wishlist-count {
    position: absolute !important;
    right: -6px !important;
    bottom: -5px !important;
    top: auto !important;
    left: auto !important;

    width: 18px !important;
    min-width: 18px !important;
    height: 18px !important;
    min-height: 18px !important;

    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 50% !important;

    background: #078cf0 !important;
    color: #fff !important;
    font-size: 9px !important;
    line-height: 18px !important;
    font-weight: 700 !important;
    text-align: center !important;
    box-sizing: border-box !important;
    z-index: 4;
}

.quality-native-ui .site-header .quality-header-wishlist .quality-wishlist-count {
    right: -5px !important;
    bottom: -5px !important;
}

/* Cart total remains visible next to the bag. */
.quality-native-ui .site-header .header-icon__cart > a {
    gap: 7px;
}

.quality-native-ui .site-header .cart-items-total-price,
.quality-native-ui .site-header .total-price {
    color: #333e48 !important;
    font-weight: 700;
    white-space: nowrap;
}

/* Never let old icon-font rules hide the new SVGs. */
.quality-native-ui .site-header .header-icon__user-account .quality-header-icon,
.quality-native-ui .site-header .header-icon__cart .quality-header-icon {
    display: block !important;
    opacity: 1 !important;
    visibility: visible !important;
}

/* If a header variant uses a dark background, only color changes. */
.quality-native-ui .site-header.quality-header-dark .header-icon,
.quality-native-ui .site-header.quality-header-dark .header-icon > a,
.quality-native-ui .site-header.quality-header-dark .quality-header-wishlist,
.quality-native-ui .site-header.quality-header-dark .quality-header-wishlist > a,
.quality-native-ui .site-header.quality-header-dark .cart-items-total-price,
.quality-native-ui .site-header.quality-header-dark .total-price {
    color: #fff !important;
}

@media (max-width: 767px) {
    .quality-native-ui .site-header .header-icons {
        gap: 14px;
    }

    .quality-native-ui .quality-header-icon,
    .quality-native-ui .site-header .quality-header-heart {
        width: 22px !important;
        height: 22px !important;
    }
}


/* Quality Theme 1.0.27 — Mobile header compact/native */
@media (max-width: 767px) {
    .quality-native-ui .site-header .header-icons {
        display: flex !important;
        gap: 10px !important;
        align-items: center !important;
    }

    .quality-native-ui .site-header .quality-header-wishlist,
    .quality-native-ui .site-header .header-icon__user-account,
    .quality-native-ui .site-header .header-icon__cart {
        display: inline-flex !important;
    }

    .quality-native-ui .site-header .header-icon-counter,
    .quality-native-ui .site-header .cart-items-count,
    .quality-native-ui .site-header .quality-wishlist-count {
        width: 16px !important;
        min-width: 16px !important;
        height: 16px !important;
        min-height: 16px !important;
        line-height: 16px !important;
        font-size: 8px !important;
        right: -4px !important;
        bottom: -4px !important;
    }
}


/* =====================================================================
   QUALITY THEME 1.0.30 — MOBILE: WISHLIST + PESQUISA COMPLETA
   ===================================================================== */

.quality-mobile-search-bar {
    display: none;
}

@media (max-width: 767px) {
    /* O cabeçalho mobile fica em duas linhas:
       1) menu + logo + coração + conta + carrinho
       2) pesquisa completa */
    .quality-native-ui .handheld-header-wrap,
    .quality-native-ui .mobile-header-v2 .container {
        padding-left: 14px !important;
        padding-right: 14px !important;
    }

    .quality-native-ui .handheld-header-v2,
    .quality-native-ui .mobile-header-v1,
    .quality-native-ui .mobile-header-v2-inner {
        min-height: 86px !important;
        flex-wrap: nowrap !important;
    }

    .quality-native-ui .handheld-header-v2 .header-logo,
    .quality-native-ui .mobile-header-v1 .header-logo,
    .quality-native-ui .mobile-header-v2-inner .header-logo {
        flex: 1 1 auto !important;
        min-width: 0 !important;
        margin: 0 8px !important;
        text-align: center !important;
    }

    .quality-native-ui .handheld-header-v2 .header-logo img,
    .quality-native-ui .mobile-header-v1 .header-logo img,
    .quality-native-ui .mobile-header-v2-inner .header-logo img,
    .quality-native-ui .handheld-header-v2 .header-logo svg,
    .quality-native-ui .mobile-header-v1 .header-logo svg,
    .quality-native-ui .mobile-header-v2-inner .header-logo svg {
        max-width: 185px !important;
        max-height: 82px !important;
        width: auto !important;
        height: auto !important;
    }

    .quality-native-ui .handheld-header-links {
        flex: 0 0 auto !important;
    }

    .quality-native-ui .handheld-header-links ul {
        display: flex !important;
        align-items: center !important;
        gap: 12px !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    .quality-native-ui .handheld-header-links ul > li {
        float: none !important;
        width: auto !important;
        min-width: 32px !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    .quality-native-ui .handheld-header-links .wishlist {
        display: block !important;
        visibility: visible !important;
        opacity: 1 !important;
    }

    .quality-native-ui .quality-mobile-wishlist-link {
        position: relative !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: 34px !important;
        height: 34px !important;
        color: #fff !important;
        text-decoration: none !important;
    }

    .quality-native-ui .quality-mobile-heart {
        display: block !important;
        width: 25px !important;
        height: 25px !important;
        fill: none !important;
        stroke: currentColor !important;
        stroke-width: 1.8 !important;
        stroke-linecap: round !important;
        stroke-linejoin: round !important;
    }

    .quality-native-ui .quality-mobile-wishlist-count {
        position: absolute !important;
        right: -3px !important;
        bottom: -2px !important;
        display: inline-block !important;
        width: 15px !important;
        min-width: 15px !important;
        height: 15px !important;
        min-height: 15px !important;
        border-radius: 50% !important;
        background: #fff !important;
        color: #078cf0 !important;
        font-size: 8px !important;
        line-height: 15px !important;
        font-weight: 700 !important;
        text-align: center !important;
    }

    /* Pesquisa inteira abaixo dos ícones, dentro do fundo azul. */
    .quality-mobile-search-bar {
        display: block !important;
        width: 100% !important;
        padding: 0 16px 12px !important;
        margin: 0 !important;
        background: #3b8fe3 !important;
        box-sizing: border-box !important;
    }

    .quality-mobile-search-form {
        position: relative !important;
        display: flex !important;
        align-items: center !important;
        width: 100% !important;
        height: 39px !important;
        margin: 0 !important;
        padding: 0 43px 0 0 !important;
        overflow: hidden !important;
        border: 2px solid #fff !important;
        border-radius: 999px !important;
        background: #fff !important;
        box-sizing: border-box !important;
    }

    .quality-mobile-search-form input[type="search"] {
        display: block !important;
        width: 100% !important;
        height: 100% !important;
        margin: 0 !important;
        padding: 0 15px !important;
        border: 0 !important;
        outline: 0 !important;
        border-radius: 999px !important;
        background: #fff !important;
        color: #59636f !important;
        font-size: 14px !important;
        box-shadow: none !important;
        -webkit-appearance: none !important;
        appearance: none !important;
    }

    .quality-mobile-search-form button {
        position: absolute !important;
        top: 0 !important;
        right: 0 !important;
        bottom: 0 !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: 42px !important;
        margin: 0 !important;
        padding: 0 !important;
        border: 0 !important;
        outline: 0 !important;
        background: transparent !important;
        color: #078cf0 !important;
        box-shadow: none !important;
    }

    .quality-mobile-search-form button svg {
        width: 18px !important;
        height: 18px !important;
        fill: none !important;
        stroke: currentColor !important;
        stroke-width: 2 !important;
        stroke-linecap: round !important;
        stroke-linejoin: round !important;
    }
}


@media (max-width: 767px) {
    .quality-native-ui .handheld-header-links li.wishlist,
    .quality-native-ui .handheld-header-links li.wishlist > a,
    .quality-native-ui .handheld-header-links .quality-mobile-wishlist-link {
        display: inline-flex !important;
        visibility: visible !important;
        opacity: 1 !important;
    }
}




/* =====================================================================
   QUALITY THEME 1.0.33 — CABEÇALHO MOBILE NATIVO E ESTÁVEL
   Usa o próprio handheld-header-links do tema: coração, conta e carrinho.
   ===================================================================== */
@media (max-width: 767px) {
    .quality-native-ui .handheld-header-v2,
    .quality-native-ui .mobile-header-v1,
    .quality-native-ui .mobile-header-v2-inner {
        position: relative !important;
        min-height: 86px !important;
        padding-right: 128px !important;
    }

    .quality-native-ui .handheld-header-links {
        position: absolute !important;
        top: 50% !important;
        right: 12px !important;
        transform: translateY(-50%) !important;
        display: block !important;
        width: auto !important;
        min-width: 112px !important;
        margin: 0 !important;
        padding: 0 !important;
        z-index: 20 !important;
        visibility: visible !important;
        opacity: 1 !important;
    }

    .quality-native-ui .handheld-header-links > ul {
        display: flex !important;
        align-items: center !important;
        justify-content: flex-end !important;
        gap: 8px !important;
        width: auto !important;
        margin: 0 !important;
        padding: 0 !important;
        list-style: none !important;
    }

    .quality-native-ui .handheld-header-links > ul > li {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        float: none !important;
        width: 32px !important;
        min-width: 32px !important;
        height: 34px !important;
        margin: 0 !important;
        padding: 0 !important;
        visibility: visible !important;
        opacity: 1 !important;
    }

    .quality-native-ui .handheld-header-links > ul > li > a,
    .quality-native-ui .handheld-header-links .quality-mobile-wishlist-link {
        position: relative !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: 32px !important;
        min-width: 32px !important;
        height: 34px !important;
        padding: 0 !important;
        margin: 0 !important;
        color: #fff !important;
        text-decoration: none !important;
        visibility: visible !important;
        opacity: 1 !important;
    }

    .quality-native-ui .handheld-header-links .quality-mobile-heart {
        width: 23px !important;
        height: 23px !important;
        fill: none !important;
        stroke: currentColor !important;
        stroke-width: 1.8 !important;
    }

    .quality-native-ui .handheld-header-links .quality-mobile-wishlist-count,
    .quality-native-ui .handheld-header-links .cart-items-count,
    .quality-native-ui .handheld-header-links .count {
        position: absolute !important;
        right: -3px !important;
        bottom: -3px !important;
        top: auto !important;
        width: 15px !important;
        min-width: 15px !important;
        height: 15px !important;
        min-height: 15px !important;
        padding: 0 !important;
        border-radius: 50% !important;
        background: #fff !important;
        color: #078cf0 !important;
        font-size: 8px !important;
        line-height: 15px !important;
        font-weight: 700 !important;
        text-align: center !important;
    }

    /* O logo não invade a área dos três atalhos. */
    .quality-native-ui .handheld-header-v2 .header-logo,
    .quality-native-ui .mobile-header-v1 .header-logo,
    .quality-native-ui .mobile-header-v2-inner .header-logo {
        max-width: calc(100% - 150px) !important;
        margin-left: 8px !important;
        margin-right: auto !important;
    }
}


/* =====================================================================
   QUALITY THEME 1.0.46 — CONSISTÊNCIA FINAL DE INTERFACE
   Camada deliberadamente pequena: preserva geometria já aprovada.
   ===================================================================== */

/* Ícones clicáveis: mesma interação visual e teclado em todas as páginas. */
.quality-native-ui .site-header .quality-header-wishlist > a,
.quality-native-ui .site-header .header-icon__user-account > a,
.quality-native-ui .site-header .header-icon__cart > a,
.quality-native-ui .quality-mobile-wishlist-link,
.quality-native-ui .quality-mobile-search-form button {
    -webkit-tap-highlight-color: transparent;
}

.quality-native-ui .site-header .quality-header-wishlist > a:focus-visible,
.quality-native-ui .site-header .header-icon__user-account > a:focus-visible,
.quality-native-ui .site-header .header-icon__cart > a:focus-visible,
.quality-native-ui .quality-mobile-wishlist-link:focus-visible,
.quality-native-ui .quality-mobile-search-form input[type="search"]:focus-visible,
.quality-native-ui .quality-mobile-search-form button:focus-visible {
    outline: 2px solid currentColor !important;
    outline-offset: 3px !important;
}

/* Mantém wishlist/conta/carrinho com o mesmo comportamento de hover do padrão Quality. */
@media (hover:hover) and (pointer:fine) {
    .quality-native-ui .site-header .quality-header-wishlist > a:hover,
    .quality-native-ui .site-header .header-icon__user-account > a:hover,
    .quality-native-ui .site-header .header-icon__cart > a:hover {
        color: #28a745 !important;
    }
}

/* Evita quebra/achatamento de badges com contagens maiores. */
.quality-native-ui .site-header .header-icon-counter,
.quality-native-ui .site-header .cart-items-count,
.quality-native-ui .site-header .quality-wishlist-count,
.quality-native-ui .quality-mobile-wishlist-count {
    font-variant-numeric: tabular-nums;
    white-space: nowrap !important;
}

/* Área de toque mínima sem alterar o tamanho visual dos SVGs. */
@media (max-width:767px) {
    .quality-native-ui .quality-mobile-wishlist-link,
    .quality-native-ui .handheld-header-links a {
        touch-action: manipulation;
    }
}