/* ---- bundle part: awa-padronizacao-20261021.min.css ---- */ @layer awa-padronizacao{:root{--awa-gap-base:12px!important;--awa-card-radius:12px!important;--awa-h-control-compact:36px!important;--awa-radius-ctl-compact:6px!important;--awa-accent-premium:#b73337!important;--awa-accent-premium:oklch(0.44 0.13 27.5)!important;--awa-text-secondary:#4b5563!important;}:root{--awa-radius-md:12px!important;}html body#html-body .page-wrapper .awa-site-header form#search_mini_form.minisearch{border-radius:var(--awa-radius-ctl,8px)!important;}html body#html-body .page-wrapper .navigation.verticalmenu.side-verticalmenu>ul.togge-menu.list-category-dropdown{border-radius:0 0 var(--awa-radius-m,12px) var(--awa-radius-m,12px)!important;}body.b2b-auth-shell .page-main{padding-inline:16px!important;}@media(min-width:768px){body.b2b-auth-shell .page-main{padding-inline:24px!important;}}body.b2b-auth-shell .b2b-login-card{padding-inline:16px!important;padding-block:16px!important;}body.catalog-category-view .page-wrapper .toolbar.toolbar-products,body.catalogsearch-result-index .page-wrapper .toolbar.toolbar-products{gap:12px!important;}body.catalog-category-view .page-wrapper .toolbar-products .toolbar-sorter.sorter,body.catalogsearch-result-index .page-wrapper .toolbar-products .toolbar-sorter.sorter{gap:12px!important;}@media(max-width:767px){body.contact-index-index .page-wrapper form.form.contact .row{margin-inline:0!important;}body.contact-index-index .page-wrapper form.form.contact .row>[class*="col-"]{padding-inline:0!important;}}body.catalog-category-view .page-wrapper .product-grid>*,body.catalogsearch-result-index .page-wrapper .product-grid>*{border-radius:var(--awa-card-radius,12px)!important;}body:is(.cms-index-index,.cms-home,.cms-homepage_ayo_home5) .page-wrapper:is(.awa-product-card,.content-item-product),body.catalog-product-view .page-wrapper .awa-carousel__slide:is(.awa-product-card,.content-item-product,.item-product.awa-carousel-card-slot),body.b2b-auth-shell .b2b-login-card{border-radius:var(--awa-card-radius,12px)!important;}}@layer awa-padronizacao{html body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body:is(.checkout-index-index,.rokanthemes-onepagecheckout) #awa-cookie-banner{right:auto!important;left:clamp(12px,3vw,24px)!important;margin-inline:0!important;}}@layer awa-padronizacao{html body#html-body.awa-dark-mode{--awa-text-secondary:#cbd5e1!important;}html body#html-body .awa-category-hero:not(.awa-category-hero--has-image){--awa-text-secondary:rgba(255,255,255,0.92)!important;}html body#html-body .awa-category-hero:not(.awa-category-hero--has-image) .awa-category-hero__title{color:rgba(255,255,255,0.92)!important;}html body#html-body:is(.checkout-index-index,.rokanthemes-onepagecheckout,.onepagecheckout-index-index) .page-wrapper:is(.awa-checkout-header-support,.hotline_header,.top-header,.wp-header){display:none!important;}html body#html-body:is(.checkout-index-index,.rokanthemes-onepagecheckout,.onepagecheckout-index-index) .page-wrapper>:is(#awa-b2b-promo-bar,.awa-b2b-promo-bar,.top-header,.wp-header),html body#html-body:is(.checkout-index-index,.rokanthemes-onepagecheckout,.onepagecheckout-index-index) .page-wrapper .awa-site-header>:not(#header){display:none!important;}@media(min-width:1024px){html body#html-body:is(.checkout-index-index,.rokanthemes-onepagecheckout,.onepagecheckout-index-index) .page-wrapper .awa-site-header #header.header-container{min-height:102px!important;}}body>.loading-mask[data-role="loader"]{position:fixed!important;inset:0!important;z-index:9999!important;margin:0!important;width:auto!important;height:auto!important;}html body#html-body:is(.checkout-index-index,.rokanthemes-onepagecheckout,.onepagecheckout-index-index) .page-wrapper:is(.opc-wrapper,.opc-sidebar,#checkoutSteps) .loading-mask{position:absolute!important;inset:0!important;}} /* ---- bundle part: awa-header-refine-20261019.min.css ---- */ /* Pedido do dono 2026-10-23 (corrigido): "aproveitá máximo espaço dos botões" — botão Adicionar ao Carrinho ocupa 100% da largura útil do card. Seletor com espaço antes de .page-wrapper (o anterior era inválido) e 20 ids para vencer as regras sem @layer do core-bundle. */ html body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body .page-wrapper :is(.product-item,.item-product,.awa-product-card) .product-info-cart{width:100%!important;max-width:none!important;margin-inline:0!important;padding-inline:0!important;box-sizing:border-box!important} html body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body .page-wrapper :is(.product-item,.item-product,.awa-product-card) :is(.actions-primary,.actions-primary.addcart-link,.product-item-actions){width:100%!important;max-width:none!important;margin-inline:0!important;padding-inline:0!important;box-sizing:border-box!important;display:block!important} html body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body .page-wrapper :is(.product-item,.item-product,.awa-product-card) form{width:100%!important;max-width:none!important;margin:0!important;box-sizing:border-box!important} html body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body .page-wrapper :is(.product-item,.item-product,.awa-product-card) :is(.action.tocart,button.tocart,.btn-add-to-cart){width:100%!important;max-width:none!important;min-width:0!important;margin-inline:0!important;justify-content:center!important;box-sizing:border-box!important} html body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body .page-wrapper :is(.product-item,.item-product,.awa-product-card) :is(.content-item-product,.product-info-main-cart){padding-inline:12px!important;box-sizing:border-box!important} @layer awa-header-refine; @layer awa-header-refine { /* ═══ 1. PROMO BAR ══════════════════════════════════════════════════════ */ @media (min-width: 768px) { /* Legado renderiza a variante "long" E a "short" ao mesmo tempo no desktop: "… CNPJ. Vendas B2B · CNPJ". A short é só do mobile. */ .awa-b2b-promo-bar__lead-short { display: none !important; } .awa-b2b-promo-bar__lead-long { display: inline !important; max-width: none !important; white-space: nowrap !important; overflow: hidden !important; text-overflow: ellipsis !important; } .awa-b2b-promo-bar__text { gap: 16px !important; min-width: 0 !important; } } @media (max-width: 767px) { .awa-b2b-promo-bar__lead-short { display: block !important; max-width: 100% !important; white-space: nowrap !important; overflow: hidden !important; text-overflow: ellipsis !important; } .awa-b2b-promo-bar { margin-inline: -16px !important; width: calc(100% + 32px) !important; } /* PDP: neutralize the legacy bottom:34px that moves the menu under the promo bar. */ body.catalog-product-view .awa-site-header .awa-header-mobile-toggle { bottom: auto !important; } /* The open drawer owns the foreground; keep the primary row in its lower stacking context. */ body.catalog-product-view.nav-open .awa-site-header .awa-main-header__inner.wp-header { z-index: 1 !important; } } /* ═══ 2. BARRA PRINCIPAL (logo · busca · conta · carrinho) ═════════════ */ @media (min-width: 768px) { .awa-header-right-col { gap: 12px !important; } /* conta de visitante: o texto pode encolher sem empurrar conta/carrinho (prompt media 230px em um slot de 272px e vazava 12px para a esquerda) */ @media (min-width:992px){.awa-header-account-prompt { min-width: 0 !important; flex: 0 1 auto !important; max-width: calc(100% - 56px) !important; justify-content: flex-end !important; }} .awa-header-account-prompt__text { min-width: 0 !important; } .awa-header-account-prompt__line1, .awa-header-account-prompt__line2 { max-width: 100% !important; overflow: hidden !important; text-overflow: ellipsis !important; white-space: nowrap !important; } /* separador sutil entre conta e carrinho */ .awa-header-minicart { position: relative !important; } .awa-header-minicart::before { content: "" !important; position: absolute !important; inset-inline-start: -7px !important; inset-block: 11px !important; width: 1px !important; background: var(--awa-border, #e9eaec) !important; pointer-events: none !important; } .awa-header-minicart .showcart { border-radius: 10px !important; transition: background-color .16s ease !important; } .awa-header-minicart .showcart:hover { background: #f6f6f7 !important; } /* busca: peso de texto mais leve + hover/focus consistentes */ #search { font-weight: 500 !important; letter-spacing: .005em !important; } #search::placeholder { font-weight: 400 !important; font-style: normal !important; opacity: 1 !important; } /* label "Buscar" é acessível (for=search) mas não deve aparecer dentro do campo. Em produção o legado já a oculta; no HML ela vazava visível (parity). */ .block-search .label, .block-search label.label[for="search"] { position: absolute !important; width: 1px !important; height: 1px !important; min-width: 0 !important; min-height: 0 !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0 0 0 0) !important; clip-path: inset(50%) !important; white-space: nowrap !important; border: 0 !important; } } @media (min-width: 1600px) { .awa-main-header__inner .awa-header-search-col { width: 100% !important; max-width: 640px !important; justify-self: center !important; } } /* ═══ 3. TRIGGER DA CONTA B2B ══════════════════════════════════════════ */ .b2b-status-trigger { gap: 10px !important; padding: 0 8px 0 6px !important; border-radius: 10px !important; transition: background-color .16s ease, box-shadow .16s ease !important; } .b2b-status-trigger:hover { background: #f6f6f7 !important; } .b2b-status-trigger:focus-visible { background: #f6f6f7 !important; outline: 2px solid var(--awa-primary, #b73337) !important; outline-offset: 2px !important; } .b2b-status-panel .b2b-status-trigger__icon .awa-b2b-panel-icon--user { width: 30px !important; height: 30px !important; max-width: 30px !important; max-height: 30px !important; } .b2b-status-trigger__line1 { font-size: 12px !important; font-weight: 400 !important; line-height: 1.15 !important; letter-spacing: .01em !important; color: var(--awa-text-muted, #6b7280) !important; } .b2b-status-trigger__line2 { font-size: 13px !important; font-weight: 700 !important; line-height: 1.2 !important; letter-spacing: .01em !important; color: var(--awa-text, #111827) !important; } .b2b-status-trigger__chevron { color: #9aa0a6 !important; } .b2b-status-trigger[aria-expanded="true"] .b2b-status-trigger__chevron { color: var(--awa-primary, #b73337) !important; transform: rotate(180deg) !important; } /* ═══ 4. DROPDOWN DO PAINEL B2B ════════════════════════════════════════ */ .b2b-status-dropdown { border-radius: 14px !important; border-color: #e9eaee !important; box-shadow: 0 18px 48px rgb(15 23 42 / 18%), 0 2px 8px rgb(15 23 42 / 6%) !important; } .b2b-status-dropdown .user-section { padding: 16px !important; gap: 12px !important; align-items: center !important; background: #fff !important; } .b2b-status-dropdown .user-avatar { width: 42px !important; height: 42px !important; border-radius: 10px !important; font-size: 16px !important; font-weight: 700 !important; } .b2b-status-dropdown .user-name { font-size: 15px !important; font-weight: 650 !important; line-height: 1.2 !important; color: #111827 !important; } .b2b-status-dropdown .user-company { font-size: 12px !important; line-height: 1.3 !important; color: #6b7280 !important; gap: 6px !important; } .b2b-status-dropdown .user-tier { width: fit-content !important; margin-top: 4px !important; padding: 2px 8px !important; border-radius: 999px !important; font-size: 10.5px !important; font-weight: 700 !important; letter-spacing: .05em !important; text-transform: uppercase !important; background: #feeef0 !important; color: #8e2629 !important; gap: 4px !important; } .b2b-status-dropdown .actions-section { padding: 14px 16px 16px !important; } .b2b-status-dropdown .section-title { margin-bottom: 10px !important; font-size: 10.5px !important; font-weight: 700 !important; letter-spacing: .08em !important; color: #8a8f98 !important; } .b2b-status-dropdown .quick-actions { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 8px !important; } .b2b-status-dropdown .quick-action-link { min-height: 44px !important; padding: 10px 12px !important; border: 1px solid #e8eaee !important; border-radius: 10px !important; background: #fff !important; gap: 10px !important; transition: background-color .16s ease, border-color .16s ease !important; } .b2b-status-dropdown .quick-action-link:hover, .b2b-status-dropdown .quick-action-link:focus-visible { background: #fbf7f7 !important; border-color: color-mix(in srgb, var(--awa-primary, #b73337) 30%, #e8eaee) !important; } /* 3º atalho (ímpar) ocupa a linha inteira — sem célula vazia no grid */ .b2b-status-dropdown .quick-actions > .quick-action-link:last-child:nth-child(odd) { grid-column: 1 / -1 !important; } .b2b-status-dropdown .dropdown-footer { padding: 10px 16px !important; gap: 8px !important; background: #fcfcfd !important; } .b2b-status-dropdown .footer-link { min-height: 44px !important; padding: 0 8px !important; border-radius: 8px !important; font-size: 13px !important; font-weight: 600 !important; transition: background-color .16s ease, color .16s ease !important; } .b2b-status-dropdown .footer-link:hover, .b2b-status-dropdown .footer-link:focus-visible { background: #f6f6f7 !important; color: var(--awa-primary, #b73337) !important; } /* ═══ 5. NAVEGAÇÃO ═════════════════════════════════════════════════════ */ @media (min-width: 992px) { .awa-nav-quick-links__link, .awa-nav-categories .title-category-dropdown { position: relative !important; } .awa-nav-quick-links__link::after { content: "" !important; position: absolute !important; inset-inline: 10px !important; inset-block-end: 8px !important; height: 2px !important; border-radius: 2px !important; background: currentColor !important; transform: scaleX(0) !important; transform-origin: center !important; transition: transform .16s ease !important; pointer-events: none !important; } .awa-nav-quick-links__link:hover::after, .awa-nav-quick-links__link:focus-visible::after { transform: scaleX(1) !important; } .awa-nav-quick-links__link:focus-visible, .awa-nav-categories .title-category-dropdown:focus-visible { outline: 2px solid currentColor !important; outline-offset: 2px !important; border-radius: 4px !important; } } /* ═══ 6. CORREÇÕES DE PARIDADE (rotas que NÃO são a home) ══════════════ Nas rotas internas (PLP/CMS/carrinho) o legado aplica estilos que a home nunca aplica (o lock inline da home mascarava). Achados reproduzidos em 19/10/2026 e corrigidos aqui, na camada 1 (vence awa-action-green e awa-visual-priority): 6.1 CTA da promo bar ficava VERDE (--awa-action #0f7a3d) nas rotas internas; 6.2 `form#search_mini_form` e `#search` tinham BORDA cada um (pill dupla); 6.3 conta visitante compacta (data-awa-is-home="0") ganhava quadrado vermelho #8e2629 com ícone branco — pedido: só o ícone, alinhado; 6.4 painel B2B podia coexistir com o prompt/ícone antigo (ícone duplicado). */ /* 6.1 — CTA "Cadastre agora": sem fundo verde/pílula; link branco sublinhado, como na home. Vale em normal/hover/focus/active, com JS ou sem JS. */ html body#html-body .page-wrapper :is(#awa-b2b-promo-bar, .awa-b2b-promo-bar) :is(a.awa-b2b-promo-bar__cta, .awa-b2b-promo-bar__cta) { display: inline-flex !important; align-items: center !important; height: 44px !important; min-height: 44px !important; padding: 0 12px !important; margin: 0 0 0 auto !important; background: transparent !important; background-color: transparent !important; background-image: none !important; border: 0 !important; border-radius: 0 !important; box-shadow: none !important; color: #fff !important; font-size: 13px !important; font-weight: 700 !important; text-decoration: underline !important; text-decoration-thickness: 2px !important; text-underline-offset: 3px !important; white-space: nowrap !important; } html body#html-body .page-wrapper :is(#awa-b2b-promo-bar, .awa-b2b-promo-bar) :is(a.awa-b2b-promo-bar__cta, .awa-b2b-promo-bar__cta):is(:hover, :focus-visible, :active) { background: transparent !important; background-color: transparent !important; border: 0 !important; color: #fff !important; text-decoration: underline !important; } @media (min-width:768px) and (max-width:991px) { /* Tablet uses a dropdown: its trigger ancestors must not inherit the closed phone drawer state. */ html body#html-body .page-wrapper .awa-site-header .awa-nav-categories :is(.sections.category-dropdown,.category-dropdown-items,.category-dropdown-item-content) {visibility:visible !important; opacity:1 !important; pointer-events:auto !important;} html body#html-body .page-wrapper .awa-site-header .awa-main-header__inner {grid-template-columns:148px minmax(0,1fr) 218px !important; gap:12px !important;} html body#html-body .page-wrapper .awa-site-header .awa-header-right-col {width:100% !important; min-width:0 !important; max-width:none !important;} html body#html-body .page-wrapper .awa-site-header .awa-header-search-col .block-search {position:static !important; margin:0 !important; transform:none !important; padding:0 !important;} } /* The footer assistant is a secondary entry point, with a visible focus target. */ html body#html-body footer.page-footer > .awa-inline-ava-footer {display:flex !important; justify-content:center !important; padding:16px !important; box-sizing:border-box !important;} html body#html-body footer.page-footer .awa-inline-ava-footer > button {display:inline-flex !important; align-items:center !important; justify-content:center !important; min-height:44px !important; max-width:100% !important; padding:10px 18px !important; border:1px solid #b73337 !important; border-radius:8px !important; background:#fff !important; color:#922a2e !important; font:inherit !important; font-weight:600 !important; line-height:1.4 !important; white-space:normal !important; cursor:pointer !important;} html body#html-body footer.page-footer .awa-inline-ava-footer > button:hover {background:#fff3f3 !important;} html body#html-body footer.page-footer .awa-inline-ava-footer > button:focus-visible {outline:3px solid #b73337 !important; outline-offset:3px !important;} @media (max-width:767px) { /* Empty Magento tab label is redundant inside the named category drawer. */ html body#html-body.awa-menu-drawer-open #awa-category-navigation .section-item-title.category-dropdown-item-title {display:none !important;} } /* Mobile uses the existing two-row header and one search border. */ @media (max-width: 767px) { html body#html-body .page-wrapper .awa-site-header .awa-header-search-col :is(.block-search,.block-content,.field.search,.control) { width:100% !important; min-width:0 !important; max-width:none !important; border:0 !important; border-radius:0 !important; box-shadow:none !important; background:transparent !important; } html body#html-body .page-wrapper .awa-site-header .awa-header-search-col form#search_mini_form { display:grid !important; grid-template-columns:minmax(0,1fr) 44px !important; width:100% !important; max-width:none !important; min-width:0 !important; box-sizing:border-box !important; height:44px !important; min-height:44px !important; max-height:44px !important; margin:0 !important; padding:0 !important; border:1px solid var(--awa-border,#e7e7ea) !important; border-radius:8px !important; background:var(--awa-bg,#fff) !important; box-shadow:none !important; } html body#html-body .page-wrapper .awa-site-header .awa-header-search-col input#search { position:static !important; width:100% !important; min-width:0 !important; max-width:none !important; height:42px !important; min-height:0 !important; margin:0 !important; padding:0 12px !important; border:0 !important; border-radius:0 !important; box-shadow:none !important; background:transparent !important; box-sizing:border-box !important; } html body#html-body .page-wrapper .awa-site-header .awa-header-search-col form#search_mini_form .actions {position:static !important; width:44px !important; margin:0 !important;} html body#html-body .page-wrapper .awa-site-header .awa-header-search-col button.action.search {position:static !important; width:42px !important; height:42px !important; margin:0 !important; border:0 !important; background:transparent !important;} html body#html-body .page-wrapper .awa-site-header .logo.awa-logo-lockup {height:42px !important; min-height:0 !important; max-height:42px !important;} html body#html-body .page-wrapper .awa-site-header .logo.awa-logo-lockup > a {gap:2px !important; height:auto !important;} html body#html-body .page-wrapper .awa-site-header .awa-logo-lockup__tagline {font-size:10px !important; line-height:1 !important; margin:0 !important; letter-spacing:.04em !important;} html body#html-body .page-wrapper #awa-b2b-promo-bar .awa-b2b-promo-bar__inner {width:100% !important; max-width:none !important; box-sizing:border-box !important; padding-inline:12px 44px !important;} html body#html-body .page-wrapper #awa-b2b-promo-bar .awa-b2b-promo-bar__text {display:flex !important; align-items:center !important; gap:8px !important; width:100% !important; min-width:0 !important; max-width:none !important; margin:0 !important;} html body#html-body .page-wrapper #awa-b2b-promo-bar :is(.awa-b2b-promo-bar__lead,.awa-b2b-promo-bar__lead-short) {max-width:none !important; min-width:0 !important; width:auto !important; overflow:visible !important; text-overflow:clip !important;} html body#html-body .page-wrapper #awa-b2b-promo-bar .awa-b2b-promo-bar__lead {flex:1 1 auto !important;} html body#html-body .page-wrapper #awa-b2b-promo-bar .awa-b2b-promo-bar__lead-short {white-space:normal !important; font-size:12px !important; line-height:1.2 !important;} html body#html-body .page-wrapper #awa-b2b-promo-bar .awa-b2b-promo-bar__cta {flex:0 0 auto !important; margin:0 !important; padding-inline:4px !important;} html body#html-body.catalog-product-view .page-wrapper .breadcrumbs li.item.product, html body#html-body.catalog-product-view .page-wrapper .breadcrumbs li.item.product > span {white-space:normal !important; overflow:visible !important; text-overflow:clip !important; overflow-wrap:anywhere !important; max-height:none !important; height:auto !important;} html body#html-body [data-awa-mobile-nav] {width:100% !important; max-width:none !important; left:0 !important; right:0 !important; padding:0 !important; box-sizing:border-box !important;} html body#html-body [data-awa-mobile-nav] :is(.link-on-bottom,.mobile-bottom-link) {height:64px !important; min-height:64px !important; margin:0 !important; padding:0 !important;} html body#html-body [data-awa-mobile-nav] .awa-inline-ava-mobile {flex:1 1 0 !important; min-width:0 !important;} html body#html-body [data-awa-mobile-nav] .awa-inline-ava-mobile > button {display:flex !important; flex-direction:column !important; align-items:center !important; justify-content:center !important; gap:4px !important; width:100% !important; min-height:44px !important; padding:4px 0 !important; margin:0 !important; border:0 !important; background:transparent !important; color:inherit !important; font:inherit !important; font-size:11px !important; line-height:1.2 !important;} html body#html-body [data-awa-mobile-nav] .awa-inline-ava-mobile svg {display:block !important; width:22px !important; height:22px !important; flex:0 0 22px !important;} } /* Shared wide shell: the same header markup serves home and inner pages. */ @media (min-width: 768px) { html body#html-body .page-wrapper .awa-site-header .header-control.awa-nav-bar { background: var(--awa-primary, #b73337) !important; background-color: var(--awa-primary, #b73337) !important; color: var(--awa-text-inverse, #fff) !important; } /* Inner legacy surfaces must reveal the shared nav background. */ html body#html-body .page-wrapper .awa-site-header .header-control.awa-nav-bar > .container, html body#html-body .page-wrapper .awa-site-header .header-control.awa-nav-bar .awa-nav-bar__inner { background: transparent !important; background-image: none !important; } html body#html-body .page-wrapper .awa-site-header .awa-nav-quick-links { flex: 1 1 auto !important; width: auto !important; min-width: 0 !important; } html body#html-body .page-wrapper .awa-site-header .awa-nav-quick-links__list { display: flex !important; justify-content: space-around !important; width: 100% !important; } html body#html-body .page-wrapper .awa-site-header .awa-nav-quick-links__link { color: var(--awa-text-inverse, #fff) !important; -webkit-text-fill-color: currentColor !important; } html body#html-body .page-wrapper .awa-site-header .awa-nav-quick-links__link:focus-visible { outline: 2px solid currentColor !important; outline-offset: -3px !important; } html body#html-body .page-wrapper .awa-site-header .awa-header-primary-nav[data-awa-topnav-empty="1"] { display: none !important; } html body#html-body .page-wrapper .awa-site-header .awa-logo-lockup__mark { width: auto !important; min-width: 0 !important; max-width: 160px !important; height: 36px !important; min-height: 0 !important; max-height: 36px !important; object-fit: contain !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,form#search_mini_form,.field.search,.control) { width: 100% !important; min-width: 0 !important; max-width: none !important; } html body#html-body .page-wrapper .awa-site-header .awa-header-account-prompt__icon { display: inline-flex !important; width: 28px !important; min-width: 28px !important; height: 28px !important; align-items: center !important; justify-content: center !important; visibility: visible !important; } html body#html-body .page-wrapper .awa-site-header .awa-header-account-prompt__icon svg { display: block !important; position: static !important; width: 28px !important; height: 28px !important; clip: auto !important; clip-path: none !important; visibility: visible !important; opacity: 1 !important; } } /* 6.2 — busca: uma única borda (no form, como na home); input sem borda. */ @media (min-width: 768px) { html body#html-body .page-wrapper .awa-site-header .awa-header-search-col .block-search, html body#html-body .page-wrapper .awa-site-header .awa-header-search-col .block-content { width: 100% !important; max-width: none !important; background: transparent !important; border: 0 !important; border-radius: 0 !important; box-shadow: none !important; } html body#html-body .page-wrapper .awa-site-header .awa-header-search-col form#search_mini_form, html body#html-body .page-wrapper .awa-site-header .awa-header-search-col form.minisearch { display: flex !important; align-items: center !important; width: 100% !important; height: 44px !important; min-height: 44px !important; padding: 8px 12px !important; background: #fff !important; background-color: #fff !important; border: 1px solid var(--awa-border, #e7e7ea) !important; border-radius: 8px !important; box-shadow: none !important; } html body#html-body .page-wrapper .awa-site-header .awa-header-search-col form#search_mini_form:focus-within { border-color: var(--awa-primary, #b73337) !important; } html body#html-body .page-wrapper .awa-site-header .awa-header-search-col input#search { height: 100% !important; min-height: 0 !important; padding: 0 48px 0 14px !important; background: transparent !important; background-color: transparent !important; border: 0 !important; border-radius: 0 !important; box-shadow: none !important; } } /* 6.3 — conta visitante compacta (todas as rotas ≤991px): só o ícone, sem quadrado vermelho, com contraste e alinhado ao carrinho. O SVG legado chega clipado (`clip: rect(0 0 0 0)`) e não pinta; por isso o glifo é desenhado por uma máscara CSS (mesmo ícone, cor do texto). */ @media (max-width: 991px) { html body#html-body .page-wrapper .awa-site-header .awa-header-account-prompt[data-awa-auth-state="guest"][data-awa-is-home="0"] { width: 44px !important; min-width: 44px !important; max-width: 44px !important; height: 44px !important; padding: 0 !important; background: transparent !important; background-color: transparent !important; background-image: none !important; border: 0 !important; border-radius: 10px !important; box-shadow: none !important; justify-content: center !important; align-items: center !important; } } @media (max-width: 991px) { html body#html-body .page-wrapper .awa-site-header .awa-header-account-prompt .awa-header-account-prompt__mobile-link { position: relative !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; color: var(--awa-text, #111827) !important; } html body#html-body .page-wrapper .awa-site-header .awa-header-account-prompt .awa-header-account-prompt__mobile-link::before { content: "" !important; display: block !important; width: 22px !important; height: 22px !important; background-color: currentColor !important; -webkit-mask: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 21v-2a4 4 0 0 0-4-4H8a4 4 0 0 0-4 4v2'/%3E%3Ccircle cx='12' cy='7' r='4'/%3E%3C/svg%3E") center / contain no-repeat !important; mask: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 21v-2a4 4 0 0 0-4-4H8a4 4 0 0 0-4 4v2'/%3E%3Ccircle cx='12' cy='7' r='4'/%3E%3C/svg%3E") center / contain no-repeat !important; } html body#html-body .page-wrapper .awa-site-header .awa-header-account-prompt .awa-header-account-prompt__mobile-link > svg { display: none !important; } } /* 6.4 — uma única UI de conta: com painel B2B no DOM, esconde o prompt legado; e dentro do trigger, mantém só o ícone (sem duplicata). */ html body#html-body .page-wrapper .awa-site-header .awa-header-right-col:has(.b2b-status-panel) > .awa-header-account-prompt { display: none !important; visibility: hidden !important; pointer-events: none !important; } /* variantes responsivas do prompt: tablet/mobile usam o link compacto; desktop usa o link de ícone + textos. Evita os dois SVGs no DOM pintados. */ @media (max-width: 991px) { html body#html-body .page-wrapper .awa-site-header .awa-header-account-prompt .awa-header-account-prompt__icon { display: none !important; } } @media (min-width: 992px) { html body#html-body .page-wrapper .awa-site-header .awa-header-account-prompt .awa-header-account-prompt__mobile-link { display: none !important; } } /* Ícone da conta sempre com contraste no header branco (home e rotas internas): o legado pintava o SVG de branco, herdado do antigo quadrado vermelho. */ html body#html-body .page-wrapper .awa-site-header .awa-header-account-prompt :is(.awa-header-account-prompt__mobile-link, .awa-header-account-prompt__icon) svg { color: var(--awa-text, #111827) !important; stroke: currentColor !important; fill: none !important; } html body#html-body .page-wrapper .awa-site-header .b2b-status-trigger__icon { display: inline-flex !important; align-items: center !important; justify-content: center !important; flex: 0 0 auto !important; line-height: 0 !important; } html body#html-body .page-wrapper .awa-site-header .b2b-status-trigger__icon > svg ~ svg, html body#html-body .page-wrapper .awa-site-header .b2b-status-trigger .status-badge { display: none !important; } }/* Missao estabilizacao 2026-10-22: estado neutro pre-hidratacao (sessao privada). */ html.awa-private-session .awa-header-account-prompt .awa-header-account-prompt__guest{display:none!important} html.awa-private-session .awa-header-account-prompt .awa-header-account-prompt__loading{display:flex!important;flex-direction:column!important;align-items:flex-start!important;justify-content:center!important;gap:2px!important;visibility:visible!important} html.awa-private-session .minicart-wrapper .counter.qty.empty{display:none!important} /* Missão estabilização 2026-10-22: stepper de quantidade compartilhado (mesmo padrão do carrinho em PDP, Compra Rápida e Pedido Rápido). */ .awa-qty-stepper--shared{display:inline-flex;align-items:stretch;flex-wrap:nowrap;border:1px solid var(--awa-border,#e5e7eb);border-radius:12px;overflow:hidden;background:var(--awa-bg,#fff);box-sizing:border-box} .awa-qty-stepper--shared .awa-qty-btn{min-width:36px;min-height:36px;padding:0;border:0;border-radius:0;background:var(--awa-bg-subtle,#f9fafb);color:var(--awa-text,#111827);font-size:18px;font-weight:600;line-height:1;cursor:pointer;box-sizing:border-box} .awa-qty-stepper--shared .awa-qty-btn:hover{background:var(--awa-bg-soft,#f3f4f6)} .awa-qty-stepper--shared .awa-qty-btn:focus-visible{outline:2px solid var(--awa-primary,#b73337);outline-offset:-2px;z-index:1} .awa-qty-stepper--shared .awa-qty-btn:disabled,.awa-qty-stepper--shared .awa-qty-btn[aria-disabled=true]{opacity:.42;cursor:not-allowed;pointer-events:none} .awa-qty-stepper--shared input[type=number]{width:3.25rem;min-height:36px;padding:0 4px;text-align:center;font-weight:600;font-variant-numeric:tabular-nums;border:0;border-inline:1px solid var(--awa-border,#e5e7eb);border-radius:0;background:var(--awa-bg,#fff);box-shadow:none;-moz-appearance:textfield;appearance:textfield;box-sizing:border-box} .awa-qty-stepper--shared input[type=number]::-webkit-inner-spin-button,.awa-qty-stepper--shared input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0} .awa-qty-stepper--shared:focus-within{border-color:var(--awa-primary,#b73337);box-shadow:0 0 0 3px rgb(183 51 55/16%)} @media (max-width:767px){.awa-qty-stepper--shared .awa-qty-btn{min-width:44px;min-height:44px}.awa-qty-stepper--shared input[type=number]{min-height:44px}} @media (prefers-reduced-motion:reduce){.awa-qty-stepper--shared .awa-qty-btn{transition:none}} /* PDP: a coluna de quantidade precisa acomodar o stepper (152px) sem sobrepor o ATC. (7x spec) */ html body#html-body#html-body#html-body#html-body#html-body#html-body.catalog-product-view .page-wrapper .product-info-main .product-add-form .box-tocart .fieldset{grid-template-columns:minmax(148px,168px) minmax(0,1fr)!important} html body#html-body#html-body#html-body#html-body#html-body#html-body.catalog-product-view .page-wrapper .product-info-main .product-add-form .box-tocart .field.qty{width:152px!important;max-width:152px!important} /* Auditoria 2026-10-23 A02: faixa B2B de cadastro é conteúdo de visitante — em sessão privada (classe aplicada no head, antes do paint) ela não deve aparecer nem deslocar o layout ao sumir. */ html.awa-private-session #awa-b2b-promo-bar{display:none!important} html body#html-body#html-body#html-body.awa-private-session #awa-b2b-promo-bar{display:none!important} /* Auditoria 2026-10-23 A02: faixa B2B = conteudo de visitante. Escondida por padrao; o runtime (awa-header-customer-runtime) exibe apenas apos resolver o estado guest. */ #awa-b2b-promo-bar.awa-b2b-promo-bar{display:none!important} html.awa-auth-resolved-guest #awa-b2b-promo-bar.awa-b2b-promo-bar{display:flex!important} html.awa-private-session #awa-b2b-promo-bar.awa-b2b-promo-bar{display:none!important} html.awa-private-session .awa-header-account-prompt .awa-header-account-prompt__guest{display:none!important} html.awa-private-session .awa-header-account-prompt .awa-header-account-prompt__loading{display:flex!important;flex-direction:column!important;align-items:flex-start!important;justify-content:center!important;gap:2px!important;visibility:visible!important} /* Auditoria 2026-10-23 A07: coluna de informacoes preenchia 413px e deixava faixa vazia (a coluna tem ~616px em 1363px). Preenche a coluna; min-width:0 evita overflow. */ @media(min-width:992px){ html body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body.catalog-product-view .page-wrapper .product-info-main{width:auto!important;min-width:0!important;max-width:none!important;flex:1 1 auto!important;box-sizing:border-box!important} html body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body.catalog-product-view .page-wrapper .product-info-main .product-info-price{max-width:100%!important} } /* Auditoria 2026-10-23 A11: dois "Confirmar pedido" visiveis (passo de pagamento + toolbar da sidebar). Mantem o botao canonico do passo; esconde o duplicado da sidebar em todos os breakpoints (o passo sempre tem o botao). */ /* Auditoria 2026-10-23 A03: estilos-base do painel de busca (mst) carregam cedo para o painel nunca pintar com bordas pretas padrao antes do CSS do modulo. */ .mst-searchautocomplete__autocomplete{background:#fff!important;border:1px solid #e5e7eb!important;border-radius:12px!important;box-shadow:0 12px 32px rgb(15 23 42/14%)!important;overflow:hidden auto!important;z-index:100122!important} .mst-searchautocomplete__index-title{border-bottom:1px solid #e7e7ea!important} /* Auditoria 2026-10-23 A08: categoria — elimina a trilha de rolagem duplicada da sidebar (coluna + .block.filter), compacta o hero e afasta a lupa do texto da busca local. (18 ids — padrao de escalada do site) */ html body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body.catalog-category-view .page-wrapper .column.main [class*="col-md-3"][class*="col-sm-3"]{overflow-y:visible!important} html body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body.catalog-category-view .page-wrapper .awa-category-hero--has-image{min-height:0!important;max-height:140px!important;height:140px!important;overflow:hidden!important} html body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body.catalog-category-view .page-wrapper .awa-category-hero--has-image img{width:100%!important;height:100%!important;max-height:140px!important;object-fit:cover!important;object-position:center!important} html body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body.catalog-category-view .page-wrapper form[class*="search"] input[placeholder*="nesta categoria"]{padding-left:52px!important} html body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body.catalog-category-view .page-wrapper [class*="col-md-3"][class*="col-sm-3"]{overflow-y:visible!important} html body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body.catalog-category-view .page-wrapper input[placeholder*="nesta categoria"]{padding-left:52px!important} /* Auditoria 2026-10-23 A10: hierarquia das saidas do minicart — Continuar comprando vira link de texto (sem caixa), abaixo de Finalizar (primario) e Ver Carrinho. */ html body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body .page-wrapper .block-minicart .awa-minicart-continue{background:transparent!important;border:0!important;box-shadow:none!important;color:var(--awa-cc-text-2,#475569)!important;text-decoration:underline!important;text-underline-offset:2px!important;min-height:32px!important} /* Auditoria 2026-10-23 A05/produto: reduz o destaque de Imprimir/Compartilhar (acoes secundarias — links discretos, sem caixa). */ html body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body.catalog-product-view .page-wrapper .product-social-links{min-height:0!important} html body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body.catalog-product-view .page-wrapper .product-social-links .action{font-size:12px!important;color:var(--awa-cc-text-2,#64748b)!important;text-decoration:underline!important;text-underline-offset:2px!important;background:transparent!important;border:0!important;box-shadow:none!important;padding:4px 0!important} html body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body.catalog-product-view .page-wrapper .product-social-links .action:hover{color:var(--awa-brand-dark)!important} /* Pedido do dono 2026-10-23: "aproveita máximo espaço dos botões" — o botão Adicionar ao Carrinho ocupa 100% da largura útil do card (antes: 172px de 240 por 3 camadas de recuo: product-info-cart 8+12, actions 8). */ html body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body.page-wrapper :is(.product-item,.item-product,.awa-product-card) .product-info-cart{width:100%!important;max-width:none!important;margin-inline:0!important;padding-inline:0!important;box-sizing:border-box!important} html body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body.page-wrapper :is(.product-item,.item-product,.awa-product-card) .actions-primary,html body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body.page-wrapper :is(.product-item,.item-product,.awa-product-card) .actions-primary.addcart-link{width:100%!important;max-width:none!important;margin-inline:0!important;padding-inline:0!important;box-sizing:border-box!important;display:block!important} html body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body.page-wrapper :is(.product-item,.item-product,.awa-product-card) form{width:100%!important;max-width:none!important;margin:0!important;box-sizing:border-box!important} html body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body.page-wrapper :is(.product-item,.item-product,.awa-product-card) :is(.action.tocart,button.tocart,.btn-add-to-cart){width:100%!important;max-width:none!important;min-width:0!important;margin-inline:0!important;justify-content:center!important;box-sizing:border-box!important} html body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body#html-body.page-wrapper :is(.product-item,.item-product,.awa-product-card) :is(.content-item-product,.product-info-main-cart){padding-inline:12px!important;box-sizing:border-box!important} /* ---- bundle part: awa-cartcheckout-fix-20261019.min.css ---- */ @layer awa-cartcheckout-fix{html body#html-body .b2b-login-modal-overlay,html body#html-body .b2b-login-modal-overlay.active{--awa-z-modal:10200!important;z-index:10200!important}html body#html-body #b2b-login-modal.active .b2b-login-modal{max-height:calc(100dvh - 24px)!important;overflow-y:auto!important;overscroll-behavior:contain!important}@media (max-width:767px){html body#html-body #b2b-login-modal.active .b2b-login-modal-header{display:grid!important;grid-template-columns:minmax(0,1fr) 44px!important;grid-template-rows:auto auto!important;column-gap:12px!important;row-gap:8px!important;position:relative!important}html body#html-body #b2b-login-modal.active .b2b-login-modal-close{grid-column:2!important;grid-row:1/span 2!important;justify-self:end!important;align-self:start!important;position:relative!important;top:0!important;right:0!important;left:auto!important;bottom:auto!important;width:44px!important;height:44px!important;min-width:44px!important;min-height:44px!important}}html body#html-body#html-body#html-body#html-body .page-wrapper .minicart-wrapper:is(.active,.show,.is-open) .block-minicart :is(.product-item-photo,.product-image-container,.product-image-wrapper),html body#html-body#html-body#html-body#html-body .page-wrapper .awa-header-minicart--expanded .block-minicart :is(.product-item-photo,.product-image-container,.product-image-wrapper){flex:0 0 72px!important;width:72px!important;min-width:72px!important;max-width:72px!important;height:72px!important;min-height:72px!important;max-height:72px!important}html body#html-body#html-body#html-body#html-body .page-wrapper .minicart-wrapper:is(.active,.show,.is-open) .block-minicart :is(img.product-image-photo,.product-image-wrapper img),html body#html-body#html-body#html-body#html-body .page-wrapper .awa-header-minicart--expanded .block-minicart :is(img.product-image-photo,.product-image-wrapper img){width:72px!important;height:72px!important;max-width:72px!important;max-height:72px!important}} /* ---- bundle part: awa-layer-order.min.css ---- */ /* Camadas (ordem efetiva): awa-padronizacao(1a) > awa-header-refine > awa-cartcheckout-fix > lista abaixo > shell-lock/storefront-consistency. Refatoracao 2026-10-21. */ @font-face{font-family:'FontAwesome';src:url('../fonts/fontawesome-webfont.woff2?v=4.5.0-20260617') format('woff2');font-weight:normal;font-style:normal;font-display:swap} @layer awa-r2-visual-fix,awa-action-green,awa-spacing-normalize,awa-cta-green,awa-fixes,awa-visual-priority,awa-header-first-paint-lock,awa-hero-ui-lock,awa-pixel-qa; @layer awa-r2-visual-fix { /* F1 — grade do header mobile: as áreas nomeadas passam a cobrir "actions" (o .awa-header-right-col tem grid-area:actions e caía em trilha implícita fora dos 96px do header, ocultando conta+minicart e sobrepondo o hero). */ @media (max-width: 767px) { html body#html-body .page-wrapper .awa-site-header .header-wrapper-sticky .awa-main-header__inner.wp-header { grid-template-areas: "toggle brand actions" "search search search" !important; grid-template-columns: 44px minmax(0, 1fr) auto !important; grid-template-rows: 44px 44px !important; height: 96px !important; min-height: 96px !important; max-height: 96px !important; padding: 4px 0 0 !important; row-gap: 4px !important; column-gap: 8px !important; overflow: visible !important; } html body#html-body .page-wrapper .awa-site-header .awa-main-header__inner.wp-header > .awa-header-right-col { grid-area: actions !important; display: flex !important; align-items: center !important; justify-content: flex-end !important; gap: 4px !important; width: auto !important; min-width: 88px !important; max-width: none !important; height: 44px !important; min-height: 44px !important; max-height: 44px !important; } /* F1b — botão compacto de conta: padding 4x8 + filho de 44px em caixa de 44 cortava o ícone (parent-clip 17px). Padding 0 + centralização corrigem. */ html body#html-body .page-wrapper .awa-site-header .awa-header-account-prompt { width: 44px !important; min-width: 44px !important; max-width: 44px !important; height: 44px !important; min-height: 44px !important; max-height: 44px !important; padding: 0 !important; gap: 0 !important; margin: 0 !important; overflow: visible !important; border-radius: 10px !important; display: flex !important; align-items: center !important; justify-content: center !important; } html body#html-body .page-wrapper .awa-site-header .awa-header-account-prompt__mobile-link { width: 44px !important; min-width: 44px !important; height: 44px !important; margin: 0 !important; padding: 0 !important; display: flex !important; align-items: center !important; justify-content: center !important; color: #ffffff !important; -webkit-text-fill-color: #ffffff !important; } html body#html-body .page-wrapper .awa-site-header .awa-header-account-prompt__mobile-link svg { width: 22px !important; height: 22px !important; } html body#html-body .page-wrapper .awa-site-header .awa-header-account-prompt__live { display: none !important; } /* F1c — SOMENTE o gatilho do carrinho recebe 44×44. A regra anterior usava `.awa-header-cart *` e forçava o painel do minicart (ui-dialog) a 44×44, quebrando o dropdown — regressão detectada no smoke funcional da rodada 4. */ html body#html-body .page-wrapper .awa-site-header .awa-header-cart, html body#html-body .page-wrapper .awa-site-header .awa-header-cart > .mini-carts, html body#html-body .page-wrapper .awa-site-header .awa-header-cart .showcart { width: 44px !important; min-width: 44px !important; height: 44px !important; } html body#html-body .page-wrapper .awa-site-header .awa-header-cart .showcart { display: flex !important; align-items: center !important; justify-content: center !important; padding: 0 !important; } html body#html-body .page-wrapper .awa-site-header .awa-header-cart .showcart :is(svg, .awa-minicart-icon, .awa-header-cart-fallback__icon) { width: 22px !important; height: 22px !important; } /* F2 — CTA da promo bar: o token --awa-primary do header (v27, marrom #8e2629) vazava para o texto do CTA verde; fill branco restaura contraste AA 5.42:1. */ html body#html-body .page-wrapper .awa-site-header :is(#awa-b2b-promo-bar,.awa-b2b-promo-bar) :is(.awa-b2b-promo-bar__cta,.awa-b2b-promo-bar__cta *,.awa-b2b-promo-bar__cta strong) { color: #ffffff !important; -webkit-text-fill-color: #ffffff !important; } /* F3 — hero: trilho/slide/media excediam o viewport travado (163px) e a imagem mobile (390x95) ficava com 68px de branco abaixo. Estica o encadeamento a/picture/img para a imagem cobrir a altura do slide. */ html body#html-body .page-wrapper .wrapper_slider.visible-xs .awa-hero__track { height: 100% !important; } html body#html-body .page-wrapper .wrapper_slider.visible-xs .awa-hero__slide { height: 100% !important; min-height: 0 !important; max-height: none !important; } html body#html-body .page-wrapper .wrapper_slider.visible-xs .banner_item_bg, html body#html-body .page-wrapper .wrapper_slider.visible-xs .banner_item_bg > a, html body#html-body .page-wrapper .wrapper_slider.visible-xs .banner_item_bg picture { display: block !important; height: 100% !important; width: 100% !important; } html body#html-body .page-wrapper .wrapper_slider.visible-xs .banner_item_bg img { display: block !important; width: 100% !important; height: 100% !important; object-fit: cover !important; object-position: left center !important; } html body#html-body .page-wrapper .wrapper_slider.visible-xs .awa-hero__slide .text-banner { max-height: 100% !important; overflow: visible !important; } /* F6 — barra promocional B2B: #header.header-container estava travado em 32px (PDP) e a barra media 45-49px (PDP/carrinho) => texto/CTA cortados no topo da página. Altura fixa de 44px + linha única (lead curto) + CTA alinhado à direita. */ html body#html-body #header.header-container { min-height: 44px !important; max-height: none !important; height: auto !important; } html body#html-body .page-wrapper #awa-b2b-promo-bar { height: 44px !important; min-height: 44px !important; max-height: none !important; align-items: center !important; } html body#html-body .page-wrapper .awa-b2b-promo-bar__inner { height: 44px !important; min-height: 44px !important; align-items: center !important; flex-wrap: nowrap !important; } html body#html-body .page-wrapper .awa-b2b-promo-bar__text { display: flex !important; align-items: center !important; gap: 8px !important; flex: 1 1 auto !important; flex-wrap: nowrap !important; height: 44px !important; min-width: 0 !important; width: auto !important; max-width: 100% !important; overflow: hidden !important; margin: 0 !important; } html body#html-body .page-wrapper .awa-b2b-promo-bar__lead { display: inline-flex !important; align-items: center !important; min-width: 0 !important; } html body#html-body .page-wrapper .awa-b2b-promo-bar__lead-long { display: none !important; } html body#html-body .page-wrapper .awa-b2b-promo-bar__lead-short { display: inline !important; white-space: nowrap !important; font-size: 12px !important; line-height: 1.2 !important; } html body#html-body .page-wrapper .awa-b2b-promo-bar__cta { display: inline-flex !important; align-items: center !important; flex: 0 0 auto !important; margin: 0 0 0 auto !important; position: relative !important; inset: auto !important; align-self: center !important; height: 44px !important; min-height: 44px !important; padding-inline: 8px !important; } } /* F4 — tagline do lockup: 12px + letter-spacing .16em = ~156px de texto numa caixa de 112px (overflow de 44-52px para a direita em todas as larguras). Tipografia responsiva + caixa 142px (cabe na célula do logo 142-172px). */ html body#html-body .page-wrapper .awa-site-header .logo.awa-logo-lockup, html body#html-body .page-wrapper .awa-site-header .logo.awa-logo-lockup > a { width: 142px !important; max-width: 142px !important; } html body#html-body .page-wrapper .awa-site-header .logo.awa-logo-lockup > a { align-items: center !important; } html body#html-body .page-wrapper .awa-site-header .logo.awa-logo-lockup .awa-logo-lockup__tagline { font-size: 11px !important; letter-spacing: .06em !important; line-height: 1 !important; width: 100% !important; max-width: 100% !important; text-align: center !important; white-space: nowrap !important; } /* F5 — nomes de produto: o clamp atual fica no

com filho block (display:flow-root), o que corta o texto sem reticências. O clamp vai para o link (2 linhas + ellipsis) e o

passa a ser caixa neutra. */ html body#html-body .page-wrapper :is(.products-grid, .products-list, .block-products-list, .product-items, .awa-carousel__viewport, .awa-shelf, .awa-carousel-section) :is(.product-name, .product-item-name) { display: block !important; min-height: 0 !important; max-height: none !important; height: auto !important; overflow: visible !important; } html body#html-body .page-wrapper :is(.products-grid, .products-list, .block-products-list, .product-items, .awa-carousel__viewport, .awa-shelf, .awa-carousel-section) :is(.product-name, .product-item-name) :is(a.product-item-link, .product-item-link, a) { display: -webkit-box !important; -webkit-box-orient: vertical !important; -webkit-line-clamp: 2 !important; line-clamp: 2 !important; overflow: hidden !important; text-overflow: ellipsis !important; min-height: calc(2 * 1.35em) !important; max-height: calc(2 * 1.35em) !important; height: auto !important; line-height: 1.35 !important; } /* ========================================================================== RODADA 2 — defeitos encontrados na auditoria de tablet/desktop ========================================================================== */ /* F12 — header mobile: a célula da marca carrega o padding 15px do grid bootstrap com box-sizing:content-box, estourando a coluna do grid (172px numa trilha de 142px). Em carrinho/PDP isso empurrava o bloco de ações e a conta passava por cima do logo. Também: o link-ícone duplicado (__icon + __mobile-link) ficava visível em cart/PDP e colidia com o minicart; e o lead curto da barra B2B encolhia/cortava ao lado do CTA. */ @media (max-width: 767px) { html body#html-body .page-wrapper .awa-site-header .awa-header-brand, html body#html-body .page-wrapper .awa-site-header .awa-header-brand-cell { box-sizing: border-box !important; padding-inline: 0 !important; min-width: 0 !important; max-width: 100% !important; } html body#html-body .page-wrapper .awa-site-header .awa-header-account-prompt__icon { display: none !important; } html body#html-body .page-wrapper .awa-b2b-promo-bar__lead { flex: 0 0 auto !important; } html body#html-body .page-wrapper .awa-b2b-promo-bar__lead-short { flex: 0 0 auto !important; } } /* F7 — PDP em tablet (768–991): colunas do .main-detail com `flex:0 0 100%` dentro de um .row `flex-direction:column` colapsavam para 1px (altura 100% circular) e a regra global `.product-info{display:-webkit-box;line-clamp:2}` (core-bundle) travava a coluna de informação em min-height 2.8em (39px). Resultado: galeria e título/preço/CTA invisíveis no tablet. */ @media (min-width: 768px) and (max-width: 991px) { html body#html-body.catalog-product-view .page-wrapper .main-detail > .row { display: flex !important; flex-direction: column !important; flex-wrap: nowrap !important; align-items: stretch !important; row-gap: 12px !important; height: auto !important; min-height: 0 !important; max-height: none !important; overflow: visible !important; } html body#html-body.catalog-product-view .page-wrapper .main-detail > .row > [class*="col-"] { flex: 0 0 auto !important; width: 100% !important; height: auto !important; min-height: 0 !important; max-height: none !important; overflow: visible !important; align-self: stretch !important; } html body#html-body.catalog-product-view .page-wrapper :is(.detail-info, .product-info-main) { display: block !important; overflow: visible !important; height: auto !important; min-height: 0 !important; float: none !important; -webkit-line-clamp: unset !important; -webkit-box-orient: unset !important; } html body#html-body.catalog-product-view .page-wrapper .product.media { height: auto !important; min-height: 0 !important; max-height: none !important; overflow: visible !important; } } /* F8 — toolbar de PLP/busca em >=768: o "modes-label" deveria ser somente leitor de tela (sr-only do Magento), mas o catálogo o reexpande para 44x44 em position:absolute, sobrepondo o botão de modo ativo (colisão 44x44). */ @media (min-width: 768px) { html body#html-body .page-wrapper .toolbar-products .modes :is(#modes-label-top, .modes-label) { position: absolute !important; width: 1px !important; height: 1px !important; min-width: 0 !important; min-height: 0 !important; margin: -1px !important; padding: 0 !important; border: 0 !important; overflow: hidden !important; clip-path: inset(50%) !important; white-space: nowrap !important; } } /* F9 — footer atendimento (home desktop): os de telefone/e-mail ficavam com display:inline e padding vertical 10px; as caixas de linha de 20,3px sobrepunham 20px (telefone x e-mail colidindo). inline-flex zera a colisão. */ html body#html-body .page-wrapper :is(.page_footer, .page-footer) .awa-footer-atendimento :is(.awa-footer-atendimento__phone, .awa-footer-atendimento__email) a { display: inline-flex !important; align-items: center !important; height: auto !important; margin: 0 !important; padding-block: 4px !important; line-height: 1.35 !important; } /* F10 — home em <=991: as seções .awa-grid-section e .awa-home-niche-shelves somavam 24px de padding lateral ao padding do wrapper, desalinhando títulos e cards em 24px (x=48 contra x=24 no 768; x=64 contra x=40 no 390). */ @media (max-width: 991px) { html body#html-body .page-wrapper .content-top-home :is(.awa-grid-section, .awa-home-niche-shelves) { padding-inline: 0 !important; } } /* F11 — cadastro B2B: nav de progresso é sticky (top:6px); âncoras/seções ficavam sob ela. scroll-margin garante que o alvo do salto/validação apareça. */ html body#html-body .b2b-register-form :is(.form-section, [id^="register-step-"]) { scroll-margin-top: 76px !important; } /* F13 — cards de produto: a regra global `.product-info{display:-webkit-box; -webkit-line-clamp:2;overflow:hidden;min-height:2.8em}` do core-bundle também atinge o CONTÊINER do card e cortava o bloco de preço/SKU abaixo do nome em >=768 (cut de 49-69px). Neutraliza o clamp só dentro dos cards. */ html body#html-body .page-wrapper :is(ul.items, ol.items, .products-grid, .products-list, .product-items, .awa-shelf, .awa-carousel-section) li:is(.item-product, .product-item) > .product-info, html body#html-body .page-wrapper :is(ul.items, ol.items, .products-grid, .products-list, .product-items, .awa-shelf, .awa-carousel-section) li:is(.item-product, .product-item) .product-info { display: block !important; overflow: visible !important; -webkit-line-clamp: unset !important; -webkit-box-orient: unset !important; min-height: 0 !important; max-height: none !important; height: auto !important; } /* F14 — barra promocional B2B (PDP/tablet): o wrapper `.header-content` também estava travado em 32px no PDP mobile e cortava 12px da barra. */ @media (max-width: 767px) { html body#html-body #header.header-container > .header-content { min-height: 44px !important; max-height: none !important; height: auto !important; overflow: visible !important; } } /* F15 — promo bar em >=768: CTA estava 27,6px abaixo do topo e era cortado pelo overflow da barra (clip de 27px). Mesma normalização do mobile. */ @media (min-width: 768px) { html body#html-body .page-wrapper :is(#awa-b2b-promo-bar, .awa-b2b-promo-bar) { height: 44px !important; min-height: 44px !important; max-height: none !important; align-items: center !important; } html body#html-body .page-wrapper :is(#awa-b2b-promo-bar, .awa-b2b-promo-bar) .awa-b2b-promo-bar__inner { height: 44px !important; min-height: 44px !important; align-items: center !important; } html body#html-body .page-wrapper :is(#awa-b2b-promo-bar, .awa-b2b-promo-bar) .awa-b2b-promo-bar__text { display: flex !important; align-items: center !important; gap: 8px !important; height: 44px !important; margin: 0 !important; overflow: hidden !important; min-width: 0 !important; flex-wrap: nowrap !important; } html body#html-body .page-wrapper :is(#awa-b2b-promo-bar, .awa-b2b-promo-bar) .awa-b2b-promo-bar__lead { flex: 1 1 auto !important; min-width: 0 !important; overflow: hidden !important; } html body#html-body .page-wrapper :is(#awa-b2b-promo-bar, .awa-b2b-promo-bar) .awa-b2b-promo-bar__lead-long { display: inline !important; white-space: nowrap !important; overflow: hidden !important; text-overflow: ellipsis !important; } html body#html-body .page-wrapper :is(#awa-b2b-promo-bar, .awa-b2b-promo-bar) .awa-b2b-promo-bar__cta { display: inline-flex !important; align-items: center !important; flex: 0 0 auto !important; margin: 0 0 0 auto !important; position: relative !important; inset: auto !important; align-self: center !important; height: 44px !important; min-height: 44px !important; } } /* F16 — CTA "Pedido Rápido" (home) em <=767: o wrapper `.awa-quickorder-cta__inner` vira coluna, mas o `.awa-quickorder-cta__head` mantém `flex:1 1 320px` e `flex-direction:row` do desktop → 320px de altura vazia (faixa em branco de ~127px no topo) e título/subtítulo espremidos lado a lado. Reflow em coluna com escala 8–16px e CTA full-width. */ @media (max-width: 767px) { html body#html-body .page-wrapper .awa-quickorder-cta__inner { flex-direction: column !important; gap: 16px !important; height: auto !important; min-height: 0 !important; padding: 16px !important; } html body#html-body .page-wrapper .awa-quickorder-cta__head { display: flex !important; flex-direction: column !important; align-items: flex-start !important; gap: 8px !important; flex: 0 0 auto !important; width: 100% !important; height: auto !important; } html body#html-body .page-wrapper .awa-quickorder-cta__head :is(.awa-quickorder-cta__title, .awa-quickorder-cta__sub) { flex: 0 0 auto !important; width: 100% !important; max-width: 100% !important; margin: 0 !important; } html body#html-body .page-wrapper .awa-quickorder-cta__demo { flex: 0 0 auto !important; width: 100% !important; justify-content: flex-start !important; } html body#html-body .page-wrapper .awa-quickorder-cta__btn { width: 100% !important; justify-content: center !important; } } /* F19 — telas largas (>=1440px): uma regra legada com 16 repetições de `#html-body` em awa-align-grid-terminal-2026-06-11.min.css força `#maincontent/.page-main` para 1440px, enquanto header, nav, footer e o contrato do PDP usam 1280px. Resultado no 1920: o conteúdo principal fica 1440 (x=236/colunas x=260) e as abas/descrição/FAQ/relacionados 56px para fora do bloco do produto e do header (x=316) — degrau visível de alinhamento. Restaura o 1280px já declarado em awa-visual-fixes-2026-06-29 nas páginas de conteúdo; a home fica de fora porque usa seções full-bleed intencionais. */ @media (min-width: 1440px) { html body#html-body:not(.cms-index-index):not(.cms-home):not(.cms-homepage_ayo_home5) .page-wrapper #maincontent, html body#html-body:not(.cms-index-index):not(.cms-home):not(.cms-homepage_ayo_home5) .page-wrapper .page-main { max-width: min(100%, 1280px) !important; width: auto !important; margin-inline: auto !important; } } /* F20 — container do header no MESMO eixo do conteúdo (tokens 1280/16): causa raiz medida no CSSOM: `#html-body .page-wrapper .header-main` (awa-design-system) fixa `width/max-width:calc(100% - 32px)` + `margin:16px` em PDP/CMS (header 32px mais estreito e deslocado) e, em PLP ≥1440, o `.container` herda 1440 alinhado à esquerda (inner em x=0). Normaliza o wrapper e o container; o grid interno (F1/F18) não muda. */ html body#html-body#html-body .page-wrapper .awa-site-header :is(.header-main, .header_main) { width: 100% !important; max-width: 100% !important; margin-inline: 0 !important; } html body#html-body#html-body .page-wrapper .awa-site-header :is(.header-main, .header_main) > .container { width: 100% !important; max-width: min(100%, 1280px) !important; margin-inline: auto !important; padding-inline: 0 !important; } /* F21 — page-types CMS/catálogo no mobile: o atalho de conta fica `opacity:0; position:absolute` (estado irresolvido de auth — desktop mostra, mobile não) e, após o F20 alinhar o container, ele coincide com o carrinho (overlay invisível de 44×44 sobre o gatilho do minicart). Remove o elemento do fluxo apenas nesses page-types no mobile; não altera o desktop nem as páginas onde o atalho é visível. */ @media (max-width: 767px) { html body#html-body.contact-index-index .page-wrapper .awa-site-header .awa-header-account-prompt, html body#html-body.catalogo-index-index .page-wrapper .awa-site-header .awa-header-account-prompt, html body#html-body.blog-index-index .page-wrapper .awa-site-header .awa-header-account-prompt, html body#html-body.cms-page .page-wrapper .awa-site-header .awa-header-account-prompt, html body#html-body.cms-no-route .page-wrapper .awa-site-header .awa-header-account-prompt, html body#html-body.cms-noroute-index .page-wrapper .awa-site-header .awa-header-account-prompt, html body#html-body.catalogsearch-result-index .page-wrapper .awa-site-header .awa-header-account-prompt { display: none !important; } } /* F18 — estado condensado do header (sticky 56px), validado por injeção em 390/767: o F1 fixava o inner em 96px/2 linhas; no `is-sticky` a busca e os ícones transbordavam para baixo do header sobre o conteúdo. No estado condensado o inner passa a 56px/1 linha, ações (conta+carrinho) alinhadas e linha de busca recolhida; cart/minicart continuam funcionando. */ @media (max-width: 767px) { html body#html-body#html-body .page-wrapper .awa-site-header .header-wrapper-sticky.is-sticky .awa-main-header__inner.wp-header { grid-template-areas: "toggle brand actions" !important; grid-template-columns: 44px minmax(0, 1fr) auto !important; grid-template-rows: 56px !important; height: 56px !important; min-height: 56px !important; max-height: 56px !important; padding: 0 !important; row-gap: 0 !important; column-gap: 8px !important; align-items: center !important; overflow: hidden !important; } html body#html-body#html-body .page-wrapper .awa-site-header .header-wrapper-sticky.is-sticky .awa-main-header__inner.wp-header > .awa-header-right-col { grid-area: actions !important; height: 44px !important; min-height: 44px !important; max-height: 44px !important; align-items: center !important; } html body#html-body#html-body .page-wrapper .awa-site-header .header-wrapper-sticky.is-sticky :is(.awa-header-search-col, .awa-header-search, .block-search) { display: none !important; } html body#html-body#html-body .page-wrapper .awa-site-header .header-wrapper-sticky.is-sticky :is(.header_main, .header-main, .container) { height: 56px !important; min-height: 56px !important; max-height: 56px !important; overflow: hidden !important; } } /* F22 — controles: paginação/selects com raio 8 em todos os bps (mobile hoje 4px; desktop já 8). Validado por injeção em R4. */ html body#html-body#html-body .page-wrapper main :is(.pages .action, .action.next, .action.previous, .sorter-options, .limiter-options) { border-radius: 8px !important; } /* F23 — setas de carrossel com gap 8 (hoje 6px). Validado em R4. */ html body#html-body#html-body .page-wrapper main :is(.awa-owl-nav__btn, .awa-carousel__arrow) { gap: 8px !important; } /* F24 — CTA do card de categoria “VER PRODUTOS” com altura 44px (hoje 48px; reduz 4px sem afetar o resto do card). Validado em R4. */ html body#html-body#html-body .page-wrapper main :is(a.awa-card-view-product, .awa-card-view-product.action) { height: 44px !important; min-height: 44px !important; } /* F25 — busca do category-hero: padding-right em token (hoje 14px). R13. */ html body#html-body#html-body .page-wrapper main :is(#mst_categorySearch) { padding-right: 16px !important; } /* F26 — breadcrumb: gap 8 entre itens (hoje 0). Validado em R4/R12. Obs.: line-height 44px do breadcrumb é inline via JS (não CSS) — patch em _audit/padronizacao/prep/JS-breadcrumb-lh-patch.md. */ html body#html-body#html-body .page-wrapper .breadcrumbs li { margin-right: 8px !important; } /* F27 — preço 14px/1,55 (hoje 13px na PLP e lh 1,0 na PDP). Validado em R5. */ html body#html-body#html-body .page-wrapper main :is(.info-price, .price-box .price) { font-size: 14px !important; line-height: 1.55 !important; } /* F28 — H2 das seções do PDP em 18px/1,3 (após 992 ficava 24px). R5. */ html body#html-body#html-body .page-wrapper main :is(.product-info-main, .awa-pdp-faq) h2 { font-size: 18px !important; line-height: 1.3 !important; } /* F29 — abas do PDP: altura de toque em token (51/47/43 px → 44) e conteúdo centralizado; line-height numérico. Validado por injeção em 390/768/1366. */ html body#html-body#html-body .page-wrapper main :is(.data.item.title, [role="tab"], .product.data.items .nav.item) { height: 44px !important; min-height: 44px !important; display: flex !important; align-items: center !important; line-height: 1.4 !important; } /* F30 — busca do header no mobile: cada wrapper aninhado adicionava padding/min-height de 8px, empurrando o input para baixo do wrapper sticky (overflow:hidden) → input ficava com 25px cortados (só o topo visível). Zera os paddings e trava as caixas em 44px: o input passa a caber inteiro na linha de 44px do header. Validado por injeção em 390 (clipped 25px → 1px de arredondamento; fullyInside true). */ @media (max-width: 767px) { html body#html-body#html-body .page-wrapper .awa-site-header .header-wrapper-sticky :is(.awa-header-search-col, .block-search, #search_mini_form, form.minisearch) { padding-block: 0 !important; padding-top: 0 !important; padding-bottom: 0 !important; min-height: 44px !important; height: 44px !important; } html body#html-body#html-body .page-wrapper .awa-site-header .header-wrapper-sticky :is(#search_mini_form .control, .block-search .control, .field.search .control) { height: 44px !important; min-height: 44px !important; padding: 0 !important; } html body#html-body#html-body .page-wrapper .awa-site-header .header-wrapper-sticky input#search { height: 44px !important; min-height: 44px !important; padding-block: 0 !important; } } /* F31 — galeria principal do PDP: a imagem quadrada (800×800 natural) era renderizada em 615×615 dentro de um card de 615×410 com overflow:hidden → **205px cortados** (segunda peça do produto sumia). Trava a imagem no tamanho do card com object-fit:contain (produto inteiro visível, sem letterbox vertical e sem alterar a altura do card). Validado por injeção em 1366 (clip 205px → 0; main-detail 412 inalterado). */ html body#html-body#html-body .page-wrapper .main-detail :is(.product.media, .gallery-placeholder) { overflow: hidden !important; } html body#html-body#html-body .page-wrapper .main-detail :is(.gallery-placeholder__image, .fotorama__img, .fotorama__stage__frame img, .product.media img) { width: 100% !important; height: 100% !important; max-height: 100% !important; object-fit: contain !important; } /* ===== Decisões do owner (17/10/2026): E10=B; H1 desktop=22 ===== */ /* F32 — H1 page-title: token 22px em TODOS os bps (PLP mobile 17→22; PDP desktop 24→22, conforme decisão do owner). */ html body#html-body#html-body .page-wrapper main h1, html body#html-body#html-body .page-wrapper h1.page-title, html body#html-body#html-body .page-wrapper .page-title-wrapper h1 { font-size: 22px !important; line-height: 1.3 !important; font-weight: 700 !important; } /* F33 — H2 das seções da home: line-height 1,2 (hoje 1,15). */ html body#html-body#html-body .page-wrapper main :is(.awa-home-section, .awa-carousel-section) :is(h2, .awa-section-header__title) { line-height: 1.2 !important; } /* F35 — breadcrumb em token (12/1,4 + padding 4). No mobile o inline `!important` do JS vence; patch JS em prep/JS-breadcrumb-lh-patch.md. */ html body#html-body#html-body .page-wrapper .breadcrumbs :is(a, strong, span) { font-size: 12px !important; line-height: 1.4 !important; padding-block: 4px !important; } /* F36 — SKU/legendas 12px (hoje 11 no desktop). */ html body#html-body#html-body .page-wrapper main .awa-b2b-sku { font-size: 12px !important; line-height: 1.25 !important; } /* F37 — foco visível (WCAG 2.4.7 / T9): 2px currentColor + offset 2. */ html body#html-body#html-body .page-wrapper :is(a, button, input, select, textarea, [tabindex]):focus-visible { outline: 2px solid currentColor !important; outline-offset: 2px !important; } /* F30b — variante da home: o