/* ===================================================================
   Be On Sport - Correcoes de review MOBILE (UpWeGo, 2026-07-15)
   Ficheiro isolado e reversivel: apagar este ficheiro (e o enqueue
   'beon-mobile' em functions.php) reverte 100% das alteracoes.
   Foco: alvos de toque >=44px (WCAG 2.5.5 / Apple HIG), escala de
   titulos, CTA de produto, rodape, dots do carrossel, safe-area iOS.
   Nota: o drawer mobile fica FORA de .beon-hdr no DOM -> seletores
   sem ancestral e cor literal (#ea5e47) para nao depender do scope.
   =================================================================== */

/* ---- 1. Barra mobile do cabecalho (burger + carrinho) ---- */
@media (max-width:1024px){
  .beon-hdr .bh-burger{ width:44px; height:44px; }
  .beon-hdr .bh-mcart{ min-width:44px; min-height:44px; align-items:center; justify-content:center; }
}

/* ---- 2. Drawer mobile: fechar, submenus, conta/favoritos, idioma ---- */
@media (max-width:1024px){
  .bh-close{ width:44px; height:44px; display:flex; align-items:center; justify-content:center; padding:0; }
  .bh-acc-p a{ min-height:44px; display:flex; align-items:center; }
  .bh-dfoot a.link{ min-height:44px; }
  .bh-dfoot .row{ align-items:center; }

  /* Seletor de idioma: area de toque + estado ativo visivel (nao so cor) */
  .bh-lang{ gap:6px; }
  .bh-lang a{
    min-width:44px; min-height:44px; display:inline-flex;
    align-items:center; justify-content:center; padding:0 6px;
  }
  .bh-lang a.on{ color:#ea5e47; font-weight:700; border-bottom:2px solid #ea5e47; }

  /* Altura dinamica (barra do Safari) + safe-area iPhone */
  .bh-drawer{ height:100dvh; }
  .bh-dfoot{ padding-bottom:calc(16px + env(safe-area-inset-bottom)); }
}

/* ---- 3. Icones sociais do rodape: caixa de toque 44x44 SO no mobile
   (no desktop os 44px alargavam a coluna SIGA-NOS e encostavam a newsletter) ---- */
@media (max-width:1024px){
  .elementor-element-276a1506 li.elementor-icon-list-item a{
    min-width:44px; min-height:44px;
    align-items:center; justify-content:center;
  }
}

/* ---- 4. Rodape mobile: alinhar as 2 colunas de links + espacamento compacto ---- */
@media (max-width:768px){
  /* Elementor poe padding-top diferente nas 2 colunas (headings 20px desalinhados). Zerar. */
  [data-elementor-type="footer"] .elementor-inner-section .elementor-column .elementor-widget-wrap,
  [data-elementor-type="footer"] .elementor-inner-section .elementor-column .elementor-element-populated{
    padding-top:0 !important; margin-top:0 !important;
  }
  /* linhas tocaveis mas sem os gaps enormes do 44px */
  [data-elementor-type="footer"] .elementor-inner-section .elementor-icon-list-item a{ padding:6px 0; }
}

/* ---- 5. Botao "voltar ao topo": >=44px tambem em mobile (era 42px) ---- */
@media (max-width:782px){
  .beon-totop{ width:46px; height:46px; line-height:46px; }
}

/* ---- 6. Pagina de produto: CTA principal forte em mobile ---- */
@media (max-width:768px){
  .woocommerce div.product form.cart .single_add_to_cart_button{
    width:100%; min-width:60%; min-height:50px; font-size:17px; margin-top:8px;
  }
  .woocommerce div.product form.cart .quantity .qty{ min-height:48px; }
}

/* ---- 7. Escala de titulos: reduzir o H3 gigante (46px) do bloco newsletter ---- */
@media (max-width:560px){
  .beon-home .bh-news h3{ font-size:30px; line-height:1; }
}

/* ---- 8. Dots do carrossel (hero): area de toque maior, visual 9px intacto ---- */
.beon-home .bh-dot{ position:relative; }
.beon-home .bh-dot::after{
  content:""; position:absolute; top:50%; left:50%;
  width:24px; height:40px; transform:translate(-50%,-50%);
}

/* ---- 9. Blog "Ver Mais": linha tocavel sem mudar o visual ---- */
.blog .elementor-post__read-more{ min-height:44px; }

/* ---- 10. Wishlist funcional na categoria: alvo de toque ---- */
.woocommerce ul.products li.product .yith-wcwl-add-to-wishlist a{
  display:inline-flex; align-items:center; min-height:44px;
}

/* ---- 10b. Banner de cookies (CookieYes): cartao compacto em vez de barra ---- */
.cky-consent-container.cky-banner-bottom,
.cky-consent-container.cky-banner-top,
.cky-consent-container{
  left:18px !important; right:auto !important; bottom:18px !important; top:auto !important;
  width:min(380px, calc(100vw - 36px)) !important; max-width:380px !important;
}
.cky-consent-container .cky-consent-bar{
  border-radius:14px !important; box-shadow:0 18px 50px rgba(12,25,58,.28) !important;
  padding:18px !important;
}
.cky-consent-container .cky-notice-group{ display:block !important; }
.cky-consent-container .cky-notice-des{ margin:0 0 12px !important; max-height:150px; overflow:auto; }
.cky-consent-container .cky-notice-btn-wrapper{
  display:flex !important; flex-wrap:wrap !important; gap:8px !important; margin:0 !important;
}
.cky-consent-container .cky-btn{ flex:1 1 auto !important; margin:0 !important; border-radius:8px !important; }
@media (max-width:560px){
  .cky-consent-container{ left:12px !important; bottom:12px !important; width:calc(100vw - 24px) !important; }
}

/* ---- 11. Carrinho em painel lateral (off-canvas) no mobile ---- */
.bh-cartdrawer{
  /* o drawer fica FORA de .beon-hdr -> re-declarar as vars da marca senao
     os estilos .bh-mc-* (botao coral, subtotal, etc.) ficam sem cor */
  --bh-coral:#ea5e47; --bh-coral-d:#d2492f; --bh-navy:#0c193a; --bh-ink:#0c193a; --bh-line:#e7e9ef;
  position:fixed; top:0; right:0; height:100dvh; width:92%; max-width:400px;
  background:#fff; z-index:1300; transform:translateX(100%);
  transition:transform .28s cubic-bezier(.2,.7,.3,1); display:flex; flex-direction:column;
  box-shadow:-10px 0 44px rgba(12,25,58,.28);
}
body.bh-cartdrawer-open .bh-cartdrawer{ transform:translateX(0); }
body.bh-cartdrawer-open{ overflow:hidden; }
.bh-cartdrawer-scrim{
  position:fixed; inset:0; background:rgba(9,17,38,.55);
  opacity:0; visibility:hidden; transition:.25s; z-index:1299;
}
body.bh-cartdrawer-open .bh-cartdrawer-scrim{ opacity:1; visibility:visible; }
.bh-cartdrawer-head{
  display:flex; align-items:center; justify-content:space-between;
  padding:14px 16px; background:#0c193a; color:#fff; flex:none;
}
.bh-cartdrawer-title{ font-family:'Bebas Neue',sans-serif; letter-spacing:.04em; font-size:21px; text-transform:uppercase; }
.bh-cartdrawer-close{ width:44px !important; height:44px; flex:none; padding:0 !important; background:transparent !important; border:0 !important; color:#fff !important; font-size:30px; line-height:1; cursor:pointer; box-shadow:none !important; }
.bh-cartdrawer-body{ flex:1 1 auto; overflow-y:auto; padding:14px 16px calc(16px + env(safe-area-inset-bottom)); }
/* só mobile: no desktop mantém-se o mini-carrinho existente */
@media (min-width:1025px){ .bh-cartdrawer, .bh-cartdrawer-scrim{ display:none !important; } }