/* AWA Bugfix Terminal 2026-06-12 — @layer awa-fixes vence awa-reset (busca 36px) */

@layer awa-fixes {
    /* PDP: ocultar placeholder SSR após Fotorama carregar (._block-content-loading removida pelo gallery.js no f:load) */
    html body#html-body.catalog-product-view .page-main .product.media .gallery-placeholder:not(._block-content-loading) {
        display: block !important;
        min-height: 0 !important;
        height: auto !important;
        grid-template-rows: none !important;
    }

    html body#html-body.catalog-product-view .page-main .product.media
        .gallery-placeholder:not(._block-content-loading) > :is(img.gallery-placeholder__image, .gallery-placeholder__image) {
        display: none !important;
        height: 0 !important;
        min-height: 0 !important;
        max-height: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
        visibility: hidden !important;
        overflow: hidden !important;
        pointer-events: none !important;
    }

    /* Mobile busca 44px */
    @media (max-width: 991px) {
        html body#html-body .page-wrapper .awa-site-header:not(.awa-header-condensed)
            .header-wrapper-sticky .header.awa-main-header {
            height: 88px !important;
            min-height: 88px !important;
            max-height: 88px !important;
        }

        html body#html-body .page-wrapper .awa-site-header .awa-header-search-col,
        html body#html-body .page-wrapper .awa-site-header .awa-header-search-col :is(.block-search, .block-content),
        html body#html-body .page-wrapper .awa-site-header .awa-header-search-col :is(form#search_mini_form, form.minisearch, form.search-content),
        html body#html-body .page-wrapper .awa-site-header .awa-header-search-col :is(.field.search, .field.search .control, input#search, input.input-text),
        html body#html-body .page-wrapper .awa-site-header .awa-header-search-col form#search_mini_form .actions,
        html body#html-body .page-wrapper .awa-site-header .awa-header-search-col button.action.search {
            height: 44px !important;
            min-height: 44px !important;
            max-height: 44px !important;
            box-sizing: border-box !important;
        }

        html body#html-body .page-wrapper .awa-site-header .awa-header-search-col input#search {
            line-height: 44px !important;
            padding-block: 0 !important;
        }
    }

    /* Home: CTAs guest ghost */
    html body#html-body:is(.cms-index-index, .cms-home, .cms-homepage_ayo_home5) .page-wrapper
        :is(.awa-shelf, .awa-carousel-section, .content-top-home) .item-product
        .product-info-cart .b2b-login-to-buy-btn:not(.b2b--listing) {
        background: rgba(183, 51, 55, 0.08) !important;
        color: #b73337 !important;
        border: 1px solid rgba(183, 51, 55, 0.28) !important;
        box-shadow: none !important;
        font-size: 13px !important;
        font-weight: 600 !important;
        text-transform: none !important;
    }

    /* §VIS-01 — Promo bar: ocultar variante curta no desktop, longa no mobile
       Causa raiz: _awa-polish-refine-2026-06-10.less não importado em _extend.less,
       então lead-short e cta-short ficam visíveis junto com lead-long/cta-long no desktop.
       Especificidade (1,6,0) — supera regras herdadas do tema Ayo (0,2,0). */
    @media (min-width: 768px) {
        html body#html-body .page-wrapper
            .awa-site-header
            .top-header.awa-utility-bar.awa-b2b-promo-bar
            .awa-b2b-promo-bar__text
            :is(span.awa-b2b-promo-bar__lead-short, strong.awa-b2b-promo-bar__cta-short) {
            display: none !important;
        }
    }

    @media (max-width: 767px) {
        html body#html-body .page-wrapper
            .awa-site-header
            .top-header.awa-utility-bar.awa-b2b-promo-bar
            .awa-b2b-promo-bar__text
            :is(span.awa-b2b-promo-bar__lead-long, strong.awa-b2b-promo-bar__cta-long) {
            display: none !important;
        }
    }

    /* §VIS-02 — Paginação categoria: ocultar label "Página" visualmente (sr-only)
       O <strong class="label pages-label">Página</strong> é para screen readers.
       Causa raiz: falta de regra CSS para .pages-label no compilado styles-l.css. */
    html body#html-body .page-wrapper .pages .pages-label,
    html body#html-body .page-wrapper .pages .page .label {
        clip: rect(0, 0, 0, 0) !important;
        clip-path: inset(50%) !important;
        height: 1px !important;
        overflow: hidden !important;
        position: absolute !important;
        white-space: nowrap !important;
        width: 1px !important;
    }

    /* §VIS-03 — Mobile home: recolher container above-fold ao height do slider
       Causa raiz: .top-home-content--above-fold tem min-height:160px mas o slider
       rokanthemes ocupa apenas 96px (aspect-ratio 1920/470 a 390px de largura),
       deixando 64px de espaço em branco abaixo do slider.
       A regra usa min-height:0 para que o container collapse to fit. */
    @media (max-width: 767px) {
        html body#html-body:is(.cms-index-index, .cms-home, .cms-homepage_ayo_home5)
            .page-wrapper
            .content-top-home > .top-home-content--above-fold {
            height: auto !important;
            min-height: 0 !important;
        }
    }

    /* §VIS-04 — Footer: reduzir padding-top e margin-top excessivos em todas as páginas.
       Causa raiz: awa-layout-bundle.css (seção "25. Footer Polish") define
       padding: 64px 0 32px !important e margin-top: 64px !important em html body .page-footer,
       criando ~128px de espaço vazio antes do conteúdo do footer em páginas de categoria/PDP.
       Nossa regra usa spec (1,1,3) + !important para vencer a original (0,0,3) + !important. */
    html body#html-body .page-wrapper footer.page-footer {
        padding-top: 16px !important;
        margin-top: 8px !important;
    }

    /* §VIS-05 — Home page: reduzir margin-bottom excessivo em content-top-home e ayo-home5-wrapper.
       Causa raiz: .content-top-home tem marginBottom=24px e .ayo-home5-wrapper tem marginBottom=24px,
       criando ~48px de espaço vazio entre a última seção de produtos e o footer na home page.
       Somado ao padding-top da page-main (24px) e marginTop do footer, resulta em ~100px de gap. */
    html body#html-body:is(.cms-index-index, .cms-home, .cms-homepage_ayo_home5)
        .page-wrapper .content-top-home {
        margin-bottom: 0 !important;
    }

    html body#html-body:is(.cms-index-index, .cms-home, .cms-homepage_ayo_home5)
        .page-wrapper .ayo-home5-wrapper {
        margin-bottom: 0 !important;
    }

    /* §VIS-05b — Home page: remover padding-bottom excessivo de column.main
       Causa raiz: awa-layout-bundle.css define padding-bottom: 64px !important para
       html body.cms-index-index .column.main, adicionando espaço extra desnecessário. */
    html body#html-body:is(.cms-index-index, .cms-home, .cms-homepage_ayo_home5)
        .page-wrapper .page-main .column.main {
        padding-bottom: 0 !important;
    }

    /* §VIS-08 — Mobile categoria/busca: ocultar coluna sidebar quando filtro está hidden.
       Causa raiz: awa-layout-bundle.css aplica margin-bottom: 24px !important na coluna
       .col-xs-12.col-sm-3 de body.page-products, mas o .block.filter dentro dela fica
       display:none em mobile (o filtro é acessado por outro mecanismo de UI).
       Resultado: ~52px de espaço vazio (12px col + 24px margin + 16px gap flexbox)
       entre o breadcrumb e o hero da categoria no mobile.
       A coluna sidebar não tem conteúdo visível em mobile, logo ocultar é seguro. */
    @media (max-width: 767px) {
        html body.catalog-category-view .page-wrapper .page-main .columns > .col-xs-12.col-sm-3,
        html body.catalogsearch-result-index .page-wrapper .page-main .columns > .col-xs-12.col-sm-3 {
            display: none !important;
        }
    }

    /* BUG-HEADER-GRID-001: Fix logo placement at desktop.
       Problem: awa-align-grid-inline-lock-20260626-phase3d22b (un-layered inline style)
       sets display:grid + grid-area:primary on .awa-header-primary-row at desktop,
       causing the logo to auto-place outside the outer grid areas ("brand search actions").
       Fix: !important inside @layer awa-fixes has higher cascade priority than
       un-layered !important (CSS Cascade 5 spec: layer !important > unlayered !important),
       so display:contents here overrides the inline lock despite matching specificity. */
    @media (min-width: 768px) {
        .awa-site-header[data-awa-header-mode="default"] .header-wrapper-sticky .awa-header-primary-row {
            display: contents !important;
        }
    }
}