/* Sueca × Magento/Athlete2: ajustes de integração do markup nativo ao visual do protótipo. */

/* Wrappers .sx que não geram caixa (header sticky e footer precisam do contexto da página) */
.sx-contents{display:contents}

/* Container de mensagens (div.page-main antes do main) só ocupa espaço quando há mensagem */
.sueca-theme .page-wrapper>div.page-main{padding:0;min-height:0}
.sueca-theme .page-wrapper>div.page-main .page.messages .messages{margin:0 auto;max-width:1460px;padding:0 32px}
.sueca-theme .page-wrapper>div.page-main .page.messages .message{margin:16px 0 0}

/* Athlete2 estiliza .logo (float/margem) globalmente */
.sx .head .logo,.sx .foot .logo{float:none;margin-left:0}

/* Páginas montadas com o markup do protótipo ocupam a largura toda (o .container interno limita o conteúdo) */
body.sueca-fullbleed main.page-main{padding:0!important;max-width:none!important;width:100%!important;margin-left:0!important;margin-right:0!important}
body.sueca-fullbleed .columns .column.main{width:100%!important;max-width:none;padding:0!important;float:none}
/* Listagem: a coluna lateral do Magento fica vazia (filtros movidos para a .side do protótipo) */
body.sueca-listing-page .columns .sidebar-main,body.sueca-listing-page .columns .sidebar-additional{display:none!important}
.sx .toolbar-actions{display:flex;align-items:center;gap:12px}
.sx .sx-filter-toggle{display:none}
@media (max-width:850px){
  .sx .sx-filter-toggle{display:inline-flex}
  .sx .side.is-open{display:block}
}

/* Paginação nativa (o protótipo não tem; segue os botões dele). O Athlete2 a esconde com o infinite scroll ligado. */
.sx .sx-pager{margin-top:34px;display:flex;justify-content:center}
.sx .sx-pager .pages{display:block!important}
/* pager nativo (promoções usa o Html\Pager com o texto "Itens 1 a 24 do total de N" dentro): só os números, numa linha */
.sx .sx-pager .pager{display:flex;justify-content:center;width:100%;margin:0}
.sx .sx-pager .pager .pages{width:100%}
.sx .sx-pager .toolbar-amount,.sx .sx-pager .limiter{display:none!important}
.sx .sx-promo-count{margin:18px 0 0;font-size:13px}
/* números de 3+ dígitos: largura automática com respiro (o tema fixava a largura e o número encostava/vazava) */
body .sx .sx-pager .pages-items .item{width:auto!important;height:auto!important;flex:none}
body .sx .sx-pager .pages-items .page{width:auto!important;min-width:42px;height:42px;padding:0 11px!important;box-sizing:border-box;line-height:1;white-space:nowrap;font-variant-numeric:tabular-nums}
@media (max-width:480px){
  body .sx .sx-pager .pages-items{gap:5px}
  body .sx .sx-pager .pages-items .page{min-width:36px;height:36px;padding:0 8px!important;font-size:13px}
  body .sx .sx-pager .pages-items .action{width:36px!important;min-width:36px;height:36px}
  /* tela estreita: some "1", "…" e a última — fica anterior, vizinhas da atual e próxima, numa linha */
  body .sx .sx-pager .pages-items .item:has(> .jump),body .sx .sx-pager .pages-items .item:has(> .page.first),body .sx .sx-pager .pages-items .item:has(> .page.last){display:none!important}
}
.sx .sx-pager .pages-label,.sx .sx-pager .pages .label{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.sx .sx-pager .pages-items{display:flex;flex-wrap:wrap;gap:8px;margin:0;padding:0;list-style:none;justify-content:center}
.sx .sx-pager .pages-items .item{margin:0}
.sx .sx-pager .pages-items .page,.sx .sx-pager .pages-items .action{display:grid;place-items:center;min-width:42px;height:42px;padding:0 12px;border:1px solid var(--line);border-radius:8px;background:#fff;color:var(--ink);font:700 14px var(--font-body);text-decoration:none}
/* anterior/próximo: o Athlete2 desenha a seta com 2 barrinhas de 2×8px giradas e absolutas — zera tudo e usa ‹ › centralizados */
body .sx .sx-pager .pages-items .action:before{display:none!important;content:none!important}
body .sx .sx-pager .pages-items .action:after{position:static!important;display:block!important;width:auto!important;height:auto!important;transform:none!important;background:none!important;border:0!important;margin:0 0 2px!important;padding:0!important;font:500 24px/1 var(--font-body)!important;color:inherit!important;opacity:1!important}
body .sx .sx-pager .pages-items .action.next:after{content:'›'!important}
body .sx .sx-pager .pages-items .action.previous:after{content:'‹'!important}
body .sx .sx-pager .pages-items .action>span{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
body .sx .sx-pager .pages-items .action{position:relative;padding:0!important;width:42px}
.sx .sx-pager .pages-items .current .page,.sx .sx-pager .pages-items a:hover{background:var(--red);border-color:var(--red);color:#fff}

/* Filtros (Olegnax LayeredNavigation) no estilo .filter-label / .filter-line do protótipo */
.sx .side .side-filters{padding:4px 18px 14px}
.sx .side .block.filter{margin:0}
.sx .side .block.filter .filter-title{display:none}
.sx .side .filter-options-item{border:0;margin:0;padding:0}
.sx .side .filter-options-title{display:flex;justify-content:space-between;align-items:center;margin:18px 0 9px;padding:0;cursor:pointer}
.sx .side .filter-options-title strong{font:700 12px var(--font-body);letter-spacing:normal;text-transform:uppercase;color:var(--ink)}
.sx .side .filter-options-content .item{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:5px 0;margin:0;font-size:12px}
.sx .side .filter-options-content .item label{display:flex;align-items:center;gap:8px;font:400 12px var(--font-body);color:var(--ink)}
.sx .side .filter-options-content .count{color:var(--muted);font-size:11px}
.sx .side .filter-options-content input[type=checkbox]{accent-color:var(--red)}
.sx .side .filter-current,.sx .side .filter-actions{font-size:12px}
.sx .side .filter-actions .action.clear{display:block;margin-top:15px;padding:9px;border:1px solid var(--red);border-radius:7px;color:var(--red);text-align:center;font:700 12px var(--font-body)}

/* Athlete2 esconde .breadcrumbs em páginas CMS; o breadcrumb do banner do protótipo é outro elemento */
.sx .heading-banner .breadcrumbs{display:block}
body .sx .heading-banner .breadcrumbs{display:block!important}

/* Fotos reais do catálogo têm proporção diferente das do protótipo: cabem inteiras na caixa do card */
.sx .product-photo,.sx .product-card-modern .product-visual .product-photo{overflow:hidden!important}
.sx .product-photo,.sx .product-card-modern .product-visual .product-photo{position:relative}
.sx .product-photo img,.sx .product-card-modern .product-photo img{position:absolute;inset:0;width:100%!important;height:100%!important;max-width:none!important;max-height:none!important;object-fit:contain}

/* PDP: só o markup do protótipo; o que o Athlete2 ainda injeta na coluna principal fica oculto */
body.sueca-pdp .column.main>:not(.sx-page):not(script):not(input){display:none!important}
body.sueca-pdp .sx #product_addtocart_form{margin:0}
/* links "adicionar à lista/comparar" do Athlete2 dentro do form de compra: fora do layout do protótipo */
body.sueca-pdp .sx #product_addtocart_form .product-addto-links{display:none}
body.sueca-pdp .sx .product-add-form{margin:0;padding:0}
body.sueca-pdp .sx .buyrow>div:not([class]){display:none}
/* Tabelas do protótipo: o Athlete2 zera as bordas de th/td */
.sx .table:not(.cart):not(.totals)>tbody>tr>th,.sx .table:not(.cart):not(.totals)>tbody>tr>td{border-bottom:1px solid #e8e8e8}

/* Modal de serviço: [hidden] precisa vencer o display:flex do protótipo */
.sx .service-note-modal-overlay[hidden]{display:none!important}

/* Carrinho: wrappers nativos (cart-container/form) neutros dentro do grid do protótipo */
body.sueca-cart-page .column.main>:not(.sx-page):not(script):not(input){display:none!important}
.sx .cart-layout .cart-container{float:none;width:auto;margin:0;padding:0}
.sx .cart-layout .cart-container:before,.sx .cart-layout .cart-container:after{content:none;display:none}
.sx .cart-layout:has(>.cart-empty),.sx .cart-layout:has(.empty){display:block}
.sx .cart-layout .cart-empty{margin:0;padding:0}
.sx .cart-row{transition:opacity .25s var(--sx-ease,ease),transform .25s var(--sx-ease,ease)}
.sx .cart-row.is-updating{opacity:.55;pointer-events:none}
.sx .cart-row.is-removing{opacity:0;transform:translateX(-16px)}
/* estado otimista: card saindo dos favoritos e troca do carrinho para o estado vazio */
.sx [data-sx-product].is-removing{opacity:0;transform:scale(.96);transition:opacity .25s ease,transform .25s ease;pointer-events:none}
.sx .cart-layout{transition:opacity .2s ease}
.sx .cart-layout.is-swapping{opacity:0}
.sx .cart-item-message{display:block;margin-top:6px;color:#B5181A}
.sx .clear-cart-modal-overlay[hidden]{display:none!important}
.sx .cart-layout .cart-container .page-title-wrapper{display:none}

/* Formulário de orçamento */
.sx .form-grid .field-hint{display:block;min-height:16px;margin-top:4px;font-size:12px;color:var(--muted)}
.sx .form-grid .field-hint.is-error{color:#B5181A}
.sx .form-grid .form-actions{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap}
.sx .form-grid label .field{display:block;width:100%}
/* Solicitação enviada */
.sx .quote-success{padding:40px 30px;text-align:center}
.sx .quote-success-icon{width:64px;height:64px;margin:0 auto 18px;display:grid;place-items:center;border-radius:50%;background:#e9f7ee;color:#1f8a46;font:700 30px/1 Arial,sans-serif;animation:sx-pop .5s var(--sx-spring,ease) both}
.sx .quote-success .table{margin:24px auto 0;max-width:640px;text-align:left}
.sx .quote-success-wa{margin-top:28px;font-size:15px}
.sx .quote-success-count{display:block;font-weight:700;font-size:22px;color:#B5181A}
.sx .quote-success-hint{color:#B5181A;font-size:14px}
.sx .quote-success-wa-btn{background:#25d366!important;border-color:#25d366!important}
.sx .quote-success-actions{margin-top:26px}

/* Modal de conta: [hidden] vence o display do protótipo */
.sx .account-modal-overlay[hidden]{display:none!important}

/* Páginas de conta/entrada: o Athlete2 pinta o fundo de cinza no login e cadastro */
body.sueca-fullbleed main.page-main{background:none!important}
.sx .account-page{display:flex;justify-content:center}
.sx .account-page .account-modal-card,.sx .account-page-card{position:relative;transform:none!important;opacity:1!important;width:min(100%,520px);margin:0 auto}
.sx .account-page-card .account-forgot{display:inline-block;margin-top:14px}

/* Forms nativos do Magento (cadastro B2B, esqueci a senha, conta) no visual .field/.btn do protótipo */
.sx .sx-magento-form{padding:30px}
.sx .sx-magento-form .fieldset{border:0;margin:0 0 22px;padding:0}
.sx .sx-magento-form .fieldset>.legend{display:block;width:100%;margin:0 0 14px;padding:0;font:800 20px var(--font-body);text-transform:uppercase;color:var(--ink)}
.sx .sx-magento-form .fieldset>.legend+br{display:none}
/* no protótipo .field é o input; no Magento é o wrapper do campo */
.sx .sx-magento-form div.field{border:0;padding:0;background:none;border-radius:0;max-width:none;margin:0 0 14px}
.sx .sx-magento-form .field>.label{display:block;margin:0 0 7px;font:700 12px var(--font-body);color:var(--ink)}
.sx .sx-magento-form .field.required>.label:after{content:' *';color:var(--red)}
.sx .sx-magento-form .control input:not([type=checkbox]):not([type=radio]),.sx .sx-magento-form .control select,.sx .sx-magento-form .control textarea{width:100%;height:auto;min-height:46px;background:#fff;border:1px solid #d9dadd;border-radius:8px;padding:12px;font:400 14px var(--font-body);color:var(--ink);box-shadow:none}
.sx .sx-magento-form .control input:focus,.sx .sx-magento-form .control select:focus,.sx .sx-magento-form .control textarea:focus{border-color:#ff4952;box-shadow:0 0 0 3px rgba(255,73,82,.15);outline:0}
.sx .sx-magento-form .mage-error,.sx .sx-magento-form div.mage-error{color:#B5181A;font-size:12px;margin-top:5px}
.sx .sx-magento-form .actions-toolbar{display:flex;gap:12px;align-items:center;justify-content:space-between;flex-wrap:wrap;margin:8px 0 0;padding:0}
.sx .sx-magento-form .actions-toolbar .primary,.sx .sx-magento-form .actions-toolbar .secondary{float:none;margin:0}
.sx .sx-magento-form .action.primary,.sx .sx-magento-form button.action.submit{display:inline-flex;align-items:center;justify-content:center;min-height:46px;padding:12px 26px;border:0;border-radius:8px;background:#B5181A;color:#fff;font:700 15px var(--font-body);text-transform:uppercase;box-shadow:none}
.sx .sx-magento-form .action.primary:hover{background:#FF0000}
.sx .sx-magento-form .action.back,.sx .sx-magento-form .action.remind{color:var(--muted);text-decoration:underline}
/* captcha nativo dentro dos cards de conta */
.sx .account-page-card .field.captcha{margin:0}
.sx .account-page-card .captcha-image{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin-top:8px;max-width:100%}
.sx .account-page-card .captcha-image img{border-radius:6px;border:1px solid var(--line);max-width:100%;height:auto}
.sx .account-page-card .captcha-reload{border:1px solid var(--line);border-radius:7px;background:#fff;color:var(--ink);padding:7px 10px;font:600 12px var(--font-body);min-height:0}

/* ===== Área do cliente (markup nativo com o visual do protótipo) ===== */
body.sueca-account .page-title-wrapper{display:none}
body.sueca-account .page-main{padding-top:38px;padding-bottom:70px}
body.sueca-account .page-main,body.sueca-account .page-main p,body.sueca-account .page-main a,body.sueca-account .page-main td,body.sueca-account .page-main th,body.sueca-account .page-main span,body.sueca-account .page-main label{font-family:var(--font-body)}
body.sueca-account .page-main h1,body.sueca-account .page-main h2,body.sueca-account .page-main h3,body.sueca-account .page-main .block-title strong,body.sueca-account .page-main .legend span{font-family:var(--font-body)!important;font-weight:800;letter-spacing:normal;color:var(--ink)}
/* menu lateral = .side do protótipo (o Athlete2 usa .account-nav) */
body.sueca-account .sidebar-main .account-nav{background:#fff;border:1px solid #e6e6e6;border-radius:9px;overflow:hidden;padding:0}
body.sueca-account .sidebar-main .account-nav:before{content:'☷　MINHA CONTA';display:block;background:#171717;color:#fff;padding:14px 18px;font:800 18px var(--font-body)}
body.sueca-account .account-nav .title{display:none}
body.sueca-account .account-nav .content{padding:0;background:#fff;border:0}
body.sueca-account .account-nav .nav.items{margin:0;padding:0}
body.sueca-account .account-nav .nav.item{margin:0}
body.sueca-account .account-nav .nav.item a,body.sueca-account .account-nav .nav.item>strong{display:flex;justify-content:space-between;align-items:center;margin:0;padding:11px 17px!important;border:0;border-bottom:1px solid #eee;font:700 13px var(--font-body)!important;color:var(--ink)!important;text-transform:uppercase;background:none!important;transition:background-color .2s,color .2s,padding-left .25s}
body.sueca-account .account-nav .nav.item a:after,body.sueca-account .account-nav .nav.item>strong:after{content:'›';font-weight:700}
body.sueca-account .account-nav .nav.item a:hover{color:var(--red)!important;background:#fff0f0!important;padding-left:22px!important}
body.sueca-account .account-nav .nav.item.current>strong,body.sueca-account .account-nav .nav.item.current a{color:var(--red)!important;background:#fff0f0!important;box-shadow:inset 3px 0 0 var(--red)}
body.sueca-account .account-nav .nav.item .delimiter,body.sueca-account .account-nav .delimiter{display:none}
/* blocos do conteúdo = .panel */
body.sueca-account .column.main .block:not(.block-collapsible-nav),body.sueca-account .column.main .table-wrapper,body.sueca-account .column.main form.form{background:#fff;border:1px solid #e9e9ec;border-radius:var(--radius);padding:26px;margin-bottom:24px;box-shadow:none}
body.sueca-account .column.main .block .block-title{border:0;margin:0 0 16px;padding:0}
body.sueca-account .column.main .block .block-title strong{font:800 20px var(--font-body)!important;text-transform:uppercase;letter-spacing:normal}
body.sueca-account .column.main .box-title span,body.sueca-account .column.main .box-title{font:800 13px var(--font-body)!important;text-transform:uppercase;letter-spacing:.5px;color:var(--ink)}
body.sueca-account .column.main .action,body.sueca-account .column.main a.action{font-family:var(--font-body)}
body.sueca-account .column.main .box-actions .action,body.sueca-account .column.main .block-title .action{color:var(--red);text-decoration:underline;background:none;border:0;padding:0;margin-right:12px;font:700 12px var(--font-body);text-transform:uppercase}
body.sueca-account .column.main button.action.primary,body.sueca-account .column.main .action.primary{background:#B5181A;border:0;border-radius:8px;color:#fff;padding:12px 24px;font:700 14px var(--font-body);text-transform:uppercase;box-shadow:none}
body.sueca-account .column.main .action.primary:hover{background:#FF0000}
body.sueca-account .column.main input.input-text,body.sueca-account .column.main select,body.sueca-account .column.main textarea{border:1px solid #d9dadd!important;border-radius:8px;background:#fff;padding:12px;height:auto;min-height:46px;font:400 14px var(--font-body)}
body.sueca-account .column.main .field>.label{font:700 12px var(--font-body);text-transform:none}
body.sueca-account .column.main .message.info,body.sueca-account .column.main .message.empty{background:#fff;border:1px dashed #d9dadd;border-radius:var(--radius);color:var(--muted);padding:26px;font:500 14px var(--font-body)}
body.sueca-account .column.main .message.info>*:first-child:before{display:none}
body.sueca-account .column.main table.data th{font:700 12px var(--font-body);color:#707070;text-transform:uppercase}
body.sueca-account .column.main table.data td,body.sueca-account .column.main table.data th{border-bottom:1px solid #e8e8e8;padding:12px}
/* favoritos usam o markup do protótipo: sem a moldura de bloco */
body.sueca-account .column.main .sueca-favorites{margin:0}
/* área do cliente sobre o fundo cinza do protótipo (cards brancos); pedidos vazios sem o "Voltar" nativo */
body.sueca-account main.page-main{background:var(--base)}
body.sueca-account .column.main .sueca-favorites{background:none}
body.sueca-account .column.main .sx+.actions-toolbar{display:none}
body.sueca-account .column.main form.form-wishlist-items{background:none;border:0;padding:0}
body.sueca-account .column.main form.form-wishlist-items .actions-toolbar{display:none}
body.sueca-account .column.main .actions-toolbar .action.back{background:none!important;border:0;color:var(--muted)!important;text-decoration:underline;font:600 13px var(--font-body);padding:0;box-shadow:none}
body.sueca-account .column.main .legend span{font:800 18px var(--font-body)!important;text-transform:uppercase}
/* mensagens info do Athlete2 na conta: sem o quadrado preto do ícone */
body.sueca-account .column.main .message.info:before,body.sueca-account .column.main .message.info:after,body.sueca-account .column.main .message.info>*:before{display:none!important}
body.sueca-account .column.main .message.info{padding:20px 24px!important;text-transform:none}

/* ===== Mensagens do Magento como o toast do protótipo ===== */
.sueca-theme .page.messages .messages{position:fixed!important;left:50%;bottom:22px;transform:translateX(-50%);z-index:2200;display:flex;flex-direction:column;align-items:center;gap:8px;width:max-content;max-width:calc(100vw - 28px);margin:0!important;padding:0!important}
.sueca-theme .page.messages .message{position:relative;margin:0!important;padding:14px 44px 14px 22px!important;border:0!important;border-radius:8px;background:#171717!important;color:#fff!important;box-shadow:0 9px 25px rgba(0,0,0,.2);font:600 13px/1.45 var(--font-body)!important;text-transform:none!important;letter-spacing:normal!important;text-align:center;cursor:pointer;animation:sx-toast-in .4s var(--sx-ease,ease) both}
.sueca-theme .page.messages .message.error,.sueca-theme .page.messages .message.message-error{background:#B5181A!important}
.sueca-theme .page.messages .message.success:after,.sueca-theme .page.messages .message:after{content:'×';position:absolute;right:16px;top:50%;transform:translateY(-50%);font:400 20px/1 Arial,sans-serif;opacity:.7;display:block!important;background:none!important;width:auto;height:auto;color:#fff}
.sueca-theme .page.messages .message:before,.sueca-theme .page.messages .message>*:first-child:before{display:none!important}
.sueca-theme .page.messages .message a{color:#fff;text-decoration:underline}
.sueca-theme .page.messages .message.is-leaving{animation:sx-toast-out .3s ease-in both}
@keyframes sx-toast-in{from{opacity:0;transform:translateY(14px) scale(.97)}to{opacity:1;transform:none}}
@keyframes sx-toast-out{to{opacity:0;transform:translateY(10px) scale(.97)}}
.sx .side .filter-options-title,.sx .side .filter-options-content,.sx .side .filter-options-item{background:none!important}

/* Botões nativos (forms do Magento e área do cliente): sem o retângulo de hover do Athlete2 */
.sx .action.primary:after,.sx .action.secondary:after,.sx .primary>.action:after,.sx .secondary>a.action:after,
body.sueca-account .action.primary:after,body.sueca-account .action.secondary:after,body.sueca-account .primary>.action:after,
body.sueca-account button:after{content:none!important;display:none!important}

/* Header entre 851 e 1299px: o menu do protótipo não cabe na linha (sobrepõe logo/busca e empurra o carrinho
   para fora da tela). Nessa faixa ele vira o mesmo dropdown do hambúrguer do mobile. */
@media (min-width:1300px){.sx .head .mobile-toggle{display:none}}
@media (max-width:1299px){
  .sx .head .container{position:relative}
  .sx .head .mobile-toggle{display:block}
  .sx .head .menu{display:none;position:absolute;top:100%;left:0;right:0;z-index:60;background:#101010;padding:20px clamp(18px,2vw,32px);flex-direction:column;align-items:stretch;gap:0;box-shadow:0 18px 30px rgba(0,0,0,.25)}
  .sx .head .menu a{padding:12px 0;border-bottom:1px solid #262626}
  .sx .head .menu a:after{display:none}
  .sx .head .menu.open{display:flex}
  .sx .head .logo{margin-right:auto}
}
@media (max-width:1299px) and (prefers-reduced-motion:no-preference){
  .sx-motion .sx .head .menu.open{animation:sx-drop .32s var(--sx-ease) both}
}
/* breadcrumb do banner: o Athlete2 põe fundo preto no hover de .breadcrumbs a */
body .sx .heading-banner .breadcrumbs a,body .sx .heading-banner .breadcrumbs a:hover{background:none!important;padding:0}
/* alinhado ao título e cinza como no protótipo (Athlete2 recua 20px na área do cliente e pinta o link de vermelho) */
body .sx .heading-banner .breadcrumbs{padding:0!important;margin-left:0!important;max-width:none;line-height:normal}
body .sx .heading-banner .breadcrumbs a{color:inherit!important}
body .sx .heading-banner .breadcrumbs a:hover{color:var(--red)!important}
/* toast: o ícone (check/alerta) do Athlete2 fica no ::before/::after da div interna, por cima do texto — o toast do
   protótipo não tem ícone; o "×" de fechar continua no ::after da própria .message */
.sueca-theme .page.messages .message>div:before,.sueca-theme .page.messages .message>div:after,
.sueca-theme .page.messages .message span:before,.sueca-theme .page.messages .message span:after{display:none!important;content:none!important}
.sueca-theme .page.messages .message>div{padding:0!important;margin:0!important}
/* celular: logado vê "CONTA" no lugar do "ENTRAR" do protótipo (o rótulo some e vira ::after) */
.sx .head .account-link.is-logged .account-label:after{content:'CONTA'}

/* =====================================================================
   MEGA MENU (desktop) e GAVETA do celular — js/sueca-mega + Magento_Theme::sueca/mega-menu.phtml
   ===================================================================== */
.sx .sx-mega-trigger.is-active{color:var(--red2)}
.sx .sx-mega{position:fixed;left:0;right:0;z-index:85;background:#fff;box-shadow:0 30px 60px -20px rgba(10,10,12,.35);border-top:3px solid var(--red);opacity:0;transform:translateY(-10px);transition:opacity .22s ease,transform .26s var(--sx-ease,ease);max-height:calc(100vh - 120px);overflow:auto}
.sx .sx-mega.is-open{opacity:1;transform:none}
.sx .sx-mega-inner{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:34px;padding-top:28px;padding-bottom:30px}
.sx .sx-mega-head{display:flex;align-items:baseline;gap:16px;margin-bottom:18px}
.sx .sx-mega-head strong{font:800 24px var(--font-body);text-transform:uppercase;letter-spacing:-.01em;color:var(--ink)}
.sx .sx-mega-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.sx .sx-mega-card{display:flex;align-items:center;gap:12px;padding:10px 14px 10px 10px;border:1px solid var(--line);border-radius:12px;background:#fff;color:var(--ink);font:700 14px var(--font-body);text-decoration:none;transition:border-color .2s,box-shadow .2s,transform .2s var(--sx-ease,ease);opacity:0;transform:translateY(6px)}
.sx .sx-mega.is-open .sx-mega-card{opacity:1;transform:none;transition-delay:calc(var(--i,0) * 18ms)}
.sx .sx-mega-card:hover,.sx .sx-mega-card:focus-visible{border-color:var(--red);box-shadow:0 10px 24px -12px rgba(181,24,26,.45);transform:translateY(-2px)}
.sx .sx-mega-name{flex:1;min-width:0}
.sx .sx-mega-arrow{color:var(--red);font-size:20px;transition:transform .2s var(--sx-ease,ease)}
.sx .sx-mega-card:hover .sx-mega-arrow{transform:translateX(3px)}
.sx .sx-mega-thumb{flex:none;width:52px;height:52px;border-radius:10px;background:var(--base);display:grid;place-items:center;overflow:hidden}
.sx .sx-mega-thumb img{width:100%;height:100%;object-fit:cover}
.sx .sx-mega-thumb svg{width:24px;height:24px;fill:none;stroke:var(--red);stroke-width:1.8;stroke-linecap:round}
.sx .sx-mega-side{display:flex;flex-direction:column;gap:12px}
.sx .sx-mega-feature{display:flex;flex-direction:column;gap:4px;padding:18px;border-radius:14px;background:#141414;color:#fff;text-decoration:none;transition:transform .2s var(--sx-ease,ease),box-shadow .2s}
.sx .sx-mega-feature.is-red{background:linear-gradient(135deg,var(--red),#7d0f11)}
.sx .sx-mega-feature:hover{transform:translateY(-2px);box-shadow:0 14px 30px -14px rgba(0,0,0,.6)}
.sx .sx-mega-feature .eyebrow{color:rgba(255,255,255,.75)}
.sx .sx-mega-feature strong{font:800 19px var(--font-body);text-transform:uppercase}
.sx .sx-mega-feature span:last-child{font-size:13px;color:rgba(255,255,255,.8)}
.sx .sx-mega-all{margin-top:auto;font:700 13px var(--font-body);color:var(--red);text-transform:uppercase;letter-spacing:.04em}
@media (max-width:1299px){.sx .sx-mega{display:none!important}}

/* gaveta */
html.sx-drawer-open,html.sx-drawer-open body{overflow:hidden!important;touch-action:none}
.sx .sx-drawer{position:fixed;inset:0;z-index:1300}
.sx .sx-drawer-backdrop{position:absolute;inset:0;background:rgba(8,8,10,.55);opacity:0;transition:opacity .28s ease;backdrop-filter:blur(2px)}
.sx .sx-drawer.is-open .sx-drawer-backdrop{opacity:1}
.sx .sx-drawer-panel{position:absolute;top:0;bottom:0;left:0;width:min(88vw,380px);display:flex;flex-direction:column;background:#111;color:#fff;transform:translateX(-102%);transition:transform .32s cubic-bezier(.2,.7,.2,1);box-shadow:20px 0 60px rgba(0,0,0,.4);touch-action:pan-y}
.sx .sx-drawer.is-open .sx-drawer-panel{transform:none}
.sx .sx-drawer-top{display:flex;align-items:center;justify-content:space-between;padding:16px 16px 10px 20px}
.sx .sx-drawer-logo{width:118px;height:auto}
.sx .sx-drawer-close{width:44px;height:44px;border:0;border-radius:50%;background:rgba(255,255,255,.08);color:#fff;font:300 28px/1 Arial,sans-serif;display:grid;place-items:center;cursor:pointer;transition:background-color .2s,transform .25s var(--sx-ease,ease)}
.sx .sx-drawer-close:active{transform:scale(.92);background:rgba(255,255,255,.16)}
.sx .sx-drawer-search{position:relative;margin:6px 16px 14px}
.sx .sx-drawer-search input{width:100%;height:48px;border:1px solid #2f2f2f;border-radius:12px;background:#1b1b1b;color:#fff;padding:0 52px 0 16px;font:500 15px var(--font-body);-webkit-appearance:none}
.sx .sx-drawer-search input::placeholder{color:#8b8d92}
.sx .sx-drawer-search input:focus{outline:0;border-color:var(--red);box-shadow:0 0 0 3px rgba(181,24,26,.25)}
.sx .sx-drawer-search button{position:absolute;right:4px;top:4px;width:40px;height:40px;border:0;border-radius:9px;background:var(--red);display:grid;place-items:center}
.sx .sx-drawer svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.sx .sx-drawer-search button svg{stroke:#fff}
.sx .sx-drawer-scroll{flex:1;min-height:0;overflow-y:auto;overscroll-behavior:contain;padding:14px 0 28px;border-top:1px solid #222;-webkit-overflow-scrolling:touch}
.sx .sx-drawer-link{display:flex;align-items:center;justify-content:space-between;width:100%;min-height:54px;padding:0 20px;border-bottom:1px solid #222;color:#fff;font:800 14px var(--font-body);text-transform:uppercase;letter-spacing:.02em;text-decoration:none;transition:background-color .15s}
.sx .sx-drawer-link:active{background:#1d1d1d}
.sx .sx-drawer-link span{color:var(--red2);font-size:22px;font-weight:500}
.sx .sx-drawer-links:empty{display:none}
.sx .sx-drawer-links{margin-top:18px;border-top:1px solid #222}
.sx .sx-drawer-quick{display:grid;grid-template-columns:1fr 1fr;gap:8px;padding:4px 16px 0}
.sx .sx-drawer-feature{display:flex;flex-direction:column;justify-content:flex-end;gap:4px;min-height:78px;padding:12px 14px;border-radius:14px;background:#1d1d1d;border:1px solid #2a2a2a;color:#fff;text-decoration:none;transition:transform .15s,border-color .2s}
.sx .sx-drawer-feature.is-red{background:linear-gradient(135deg,#b5181a,#7d0f11);border-color:#b5181a}
.sx .sx-drawer-feature:active{transform:scale(.97)}
.sx .sx-drawer-feature .eyebrow{margin:0;font:800 9.5px/1.2 var(--font-body);letter-spacing:.14em;text-transform:uppercase;white-space:nowrap;color:rgba(255,255,255,.62)}
.sx .sx-drawer-feature .eyebrow:before{display:none}
.sx .sx-drawer-feature strong{font:800 16px/1.15 var(--font-body);color:#fff}
.sx .sx-drawer-cats{display:grid;grid-template-columns:1fr 1fr;gap:8px;padding:0 16px}
.sx .sx-drawer-cat{display:flex;align-items:center;gap:9px;min-width:0;min-height:56px;padding:6px 8px 6px 6px;border:1px solid #262626;border-radius:12px;background:#171717;color:#fff;font:700 clamp(12px,3.4vw,13px)/1.2 var(--font-body);text-decoration:none;transition:border-color .2s,transform .15s}
.sx .sx-drawer-cat:active{transform:scale(.97);border-color:var(--red)}
.sx .sx-drawer-cat-name{min-width:0;overflow-wrap:break-word;hyphens:manual}
.sx .sx-drawer-cat .sx-mega-thumb{flex:none;width:40px;height:40px;border-radius:9px;background:#fff;overflow:hidden}
.sx .sx-drawer .sx-mega-thumb svg{stroke:var(--red);width:22px;height:22px}
.sx .sx-drawer-cat.is-all{grid-column:1/-1;justify-content:center;min-height:50px;padding:0 12px;background:none;border-color:#333;color:var(--red2);font-weight:800;font-size:12.5px;letter-spacing:.04em;text-transform:uppercase}
.sx .sx-drawer-label{margin:22px 20px 10px;font:800 11px var(--font-body);letter-spacing:.18em;text-transform:uppercase;color:#8b8d92}
.sx .sx-drawer-account{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;padding:0 16px}
.sx .sx-drawer-account a{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;min-width:0;min-height:72px;padding:8px 4px;border-radius:12px;background:#1b1b1b;color:#fff;font:700 12px/1.2 var(--font-body);text-align:center;text-decoration:none;transition:transform .15s,background-color .15s}
.sx .sx-drawer-account a:active{transform:scale(.97);background:#232323}
.sx .sx-drawer-account a:first-child{grid-column:1/-1;flex-direction:row;justify-content:flex-start;gap:10px;min-height:52px;padding:0 14px;font-size:13.5px}
.sx .sx-drawer-account b{position:absolute;top:8px;left:calc(50% + 6px);min-width:20px;height:20px;padding:0 5px;border-radius:999px;background:var(--red);font:800 10.5px/20px var(--font-body);text-align:center}
.sx .sx-drawer-contact{display:grid;gap:8px;padding:18px 16px 0}
.sx .sx-drawer .sx-drawer-contact a{display:flex;flex-direction:row;align-items:center;justify-content:center;gap:10px;min-height:50px;padding:0 14px;border-radius:12px;border:1px solid #2a2a2a;color:#fff;font:700 14px var(--font-body);text-decoration:none}
.sx .sx-drawer-contact svg{flex:none}
.sx .sx-drawer-wa{background:#1ccc66;border-color:#1ccc66!important}
.sx .sx-drawer-wa svg{width:22px;height:22px;stroke:none}
.sx .sx-drawer.is-open .sx-drawer-scroll>*{animation:sx-drawer-in .4s var(--sx-ease,ease) both}
.sx .sx-drawer.is-open .sx-drawer-scroll>*:nth-child(2){animation-delay:.03s}
.sx .sx-drawer.is-open .sx-drawer-scroll>*:nth-child(3){animation-delay:.06s}
.sx .sx-drawer.is-open .sx-drawer-scroll>*:nth-child(n+4){animation-delay:.09s}
@keyframes sx-drawer-in{from{opacity:0;transform:translateX(-14px)}to{opacity:1;transform:none}}
/* celular: o menu ocupa a tela inteira (pedido) — sem faixa de fundo ao lado, respeitando entalhe e barra do sistema */
@media (max-width:767px){
  .sx .sx-drawer-panel{right:0;width:100%;height:100vh;height:100dvh;box-shadow:none;padding:env(safe-area-inset-top) env(safe-area-inset-right) 0 env(safe-area-inset-left)}
  .sx .sx-drawer-backdrop{backdrop-filter:none}
  .sx .sx-drawer-scroll{padding-bottom:calc(28px + env(safe-area-inset-bottom))}
  .sx .sx-drawer-top{padding-top:12px}
  .sx .sx-drawer-search{margin-top:8px}
}
@media (min-width:480px) and (max-width:767px){.sx .sx-drawer-cats{grid-template-columns:repeat(3,1fr)}}
@media (min-width:1300px){.sx .sx-drawer{display:none!important}}

/* =====================================================================
   FILTROS no celular: gaveta lateral (js/sueca-filter-toggle)
   ===================================================================== */
@media (max-width:850px){
  .sx #sx-side{display:block!important;position:fixed!important;z-index:1290;top:0!important;bottom:0;left:0;height:100vh!important;height:100dvh!important;max-height:none!important;width:min(88vw,380px);margin:0!important;border-radius:0 16px 16px 0;overflow-y:auto;overscroll-behavior:contain;transform:translateX(-104%);visibility:hidden;transition:transform .32s cubic-bezier(.2,.7,.2,1),visibility 0s linear .32s;padding-bottom:0}
  .sx #sx-side.is-open{transform:none;visibility:visible;transition:transform .32s cubic-bezier(.2,.7,.2,1)}
  .sx #sx-side .sx-side-bar{position:sticky;top:0;z-index:2;display:flex;align-items:center;justify-content:space-between;padding:12px 12px 12px 20px;background:#141414;color:#fff}
  .sx #sx-side .sx-side-bar strong{font:800 17px var(--font-body);text-transform:uppercase}
  .sx #sx-side .sx-side-close{width:42px;height:42px;border:0;border-radius:50%;background:rgba(255,255,255,.1);color:#fff;font:300 26px/1 Arial,sans-serif;display:grid;place-items:center}
  .sx #sx-side .sx-side-apply{position:sticky;bottom:0;z-index:2;padding:12px 16px calc(12px + env(safe-area-inset-bottom));background:linear-gradient(180deg,rgba(255,255,255,0),#fff 30%)}
  .sx #sx-side .sx-side-apply .btn{width:100%;justify-content:center;min-height:50px}
  .sx #sx-side>h3:first-of-type{display:none}   /* o título "FILTROS" já está na barra da gaveta */
  .sx #sx-side .side-filters{padding-top:8px}
  /* o Athlete2 esconde o bloco de filtros no celular (ele usaria um modal próprio); dentro da gaveta ele aparece */
  .sx #sx-side #layered-filter-block,.sx #sx-side #layered-filter-block .filter-content,.sx #sx-side #layered-filter-block .filter-options{display:block!important}
}
html.sx-filters-open .columns{z-index:1300!important}
.sx-filter-backdrop{position:fixed;inset:0;z-index:1280;background:rgba(8,8,10,.5);opacity:0;transition:opacity .28s ease;pointer-events:none}
.sx-filter-backdrop.is-open{opacity:1;pointer-events:auto}
@media (min-width:851px){.sx #sx-side .sx-side-bar,.sx #sx-side .sx-side-apply,.sx-filter-backdrop{display:none!important}}

/* =====================================================================
   POLIMENTO MOBILE: texto legível, alvos de toque, título do produto
   ===================================================================== */
@media (max-width:850px){
  .sx .topline{font-size:11px!important}
  .sx .hero-carousel .hero-details{font-size:11px!important}
  .sx .branch-card p,.sx .branch-card small,.sx .branch-card a,.sx .branch-card span,.sx .foot-branches .muted,.sx .foot-branches small{font-size:12px!important}
  .sx .hero-dot{position:relative}
  .sx .hero-dot:after{content:'';position:absolute;inset:-14px -5px}
  .sx a[href^="tel:"],.sx a[href^="mailto:"]{display:inline-block;padding:6px 0}
  .sx .account-modal-card a,.sx .account-modal a{display:inline-block;padding:8px 0}
}
@media (max-width:480px){
  .sx .detail-info h1{font-size:min(34px,7.6vw)!important;line-height:1.08}
}

/* foto da campanha no popup de promoções (admin › Campanha › Foto da promoção) */
/* o link da foto não herda o visual do botão "VER PROMOÇÕES" (.promo-popup a) */
body .sx .promo-popup a.promo-popup-media{display:block!important;margin:-4px -4px 14px!important;padding:0!important;border:0!important;border-radius:10px;overflow:hidden;background:var(--base)!important;box-shadow:none!important;min-height:0;width:auto;height:auto}
body .sx .promo-popup a.promo-popup-media:before,body .sx .promo-popup a.promo-popup-media:after{display:none!important;content:none!important}
.sx .promo-popup-media img{display:block;width:100%;max-height:200px;object-fit:cover;transition:transform .5s var(--sx-ease,ease)}
.sx .promo-popup-media:hover img{transform:scale(1.04)}

/* cadastro B2B: CEP digitado não encontrado — estado limpo e destacado até ser escolhido (js/b2b-register-mixin) */
.field.sx-attention select{border-color:#B5181A!important;box-shadow:0 0 0 3px rgba(181,24,26,.15)!important}