/* ========================================================================== CB Responsive — correcao de overflow horizontal no mobile (2026-08-15) -------------------------------------------------------------------------- CAUSA-RAIZ (diagnosticada com Playwright em 360/390/414): No header, o grid `.dt-main__inner` usa `grid-template-columns: auto 1fr auto`. O track central `1fr` (= minmax(auto,1fr)) nao encolhe abaixo do min-content da logo (`.dt-logo__img`, max-width 220-300px), entao a coluna de icones `.dt-main__col--right` (conta + wishlist + carrinho) e o badge do carrinho (`.dt-cart-badge`, position:absolute right:-10px) eram empurrados PRA FORA da viewport. Resultado: o documento ficava com 408px de largura numa tela de 360px (scrollWidth 408 vs clientWidth 360), permitindo arrastar o dedo pro lado. Como o header vive no layout, isso acontecia em TODAS as paginas. Os elementos fixos (cb-wa, .ttd-compare-tray, #cbt-cc) NAO eram culpados: position:fixed se ancora na largura do bloco de contencao inicial (408px), entao eles "herdavam" a largura inflada. Corrigido o header, eles voltam sozinhos pro lugar (right:14/16px dentro de 360px). FIX (raiz, nao band-aid): o track central vira `minmax(0,1fr)` (pode encolher a 0), as colunas ganham `min-width:0` e a logo `max-width:100%`, entao a coluna de icones sempre cabe. Nada de `overflow-x:hidden` no body. Carregado por ULTIMO no (depois do wp-port inline) pra vencer a cascata sem recompilar o style-wp-port.scss.tpl (~8-11 min no servidor). Fonte canonica das regras originais: style-wp-port.scss.tpl (linhas ~346 e ~1074) — ficam sobrescritas por este arquivo. ========================================================================== */ /* ---- Header: permite o grid encolher em vez de estourar (<= 880px) ---- */ @media (max-width: 880px){ .dt-main__inner{ /* track central passa a poder encolher abaixo do min-content da logo */ grid-template-columns: auto minmax(0, 1fr) auto !important; } .dt-main__col{ min-width: 0 !important; } .dt-main__col--center{ min-width: 0 !important; } .dt-main__col--right{ flex-shrink: 0 !important; } /* a logo acompanha o track (sem forcar largura fixa que estoura a coluna) */ .dt-main__col--center .dt-logo__img, .dt-logo__img{ max-width: min(240px, 100%) !important; height: auto !important; } /* badge do carrinho fica dentro da viewport (a sombra de 2px nao vaza) */ .dt-cart-badge{ right: -4px !important; } } /* ---- Rede de seguranca: media/imagens/tabelas nunca ultrapassam o container. NAO e band-aid de overflow no body — sao regras corretas de conteudo fluido. A causa (header) ja esta tratada acima. ---- */ img, svg, video, iframe, canvas, embed, object{ max-width: 100%; } table{ max-width: 100%; }