/* INTRO CMS — Bona · Navegación tipo app en móvil (barra inferior) */
.mobile-tabbar{display:none}

@media (max-width:768px){
  .mobile-tabbar{
    display:flex;position:fixed;left:0;right:0;bottom:0;z-index:70;
    background:#fff;border-top:1px solid rgba(0,0,0,.08);
    box-shadow:0 -4px 18px rgba(16,32,26,.10);
    padding:6px 4px calc(6px + env(safe-area-inset-bottom));
    justify-content:space-around;align-items:stretch;
  }
  .mobile-tabbar .tab{
    flex:1;display:flex;flex-direction:column;align-items:center;gap:3px;
    text-decoration:none;color:#8a9791;font-size:10.5px;font-weight:600;
    padding:4px 2px;border-radius:12px;line-height:1.1;text-align:center;
  }
  .mobile-tabbar .tab svg{width:23px;height:23px;display:block}
  .mobile-tabbar .tab.on{color:var(--primary)}
  .mobile-tabbar .tab-ico{position:relative;display:inline-flex}
  .mobile-tabbar .tab-badge{
    position:absolute;top:-7px;right:-10px;min-width:16px;height:16px;padding:0 4px;
    background:var(--accent);color:#fff;border-radius:999px;font-size:10px;font-weight:800;
    display:flex;align-items:center;justify-content:center;line-height:1;
  }

  /* Header móvil más limpio: las acciones (perfil/favoritos/carrito) pasan a la barra inferior */
  .site-header .header-actions{display:none}

  /* Espacio para que la barra fija no tape el contenido ni el footer */
  body{padding-bottom:calc(66px + env(safe-area-inset-bottom))}

  /* Botón flotante de WhatsApp (modo sin widget de chat) por encima de la barra */
  .wa-float{bottom:calc(80px + env(safe-area-inset-bottom))}

  /* ---- Menú hamburguesa: panel desplegable limpio ---- */
  .site-header .nav{position:relative;flex-wrap:nowrap;align-items:center;gap:12px}
  .site-header .brand{margin-right:auto}
  .site-header .nav-toggle{order:3;display:inline-flex;align-items:center;justify-content:center;
    width:44px;height:44px;font-size:22px;line-height:1;background:transparent;border:0;color:var(--ink);cursor:pointer}
  .site-header .nav-links{
    display:none;position:absolute;top:100%;left:0;right:0;margin:0;padding:6px 0;
    list-style:none;flex-direction:column;background:#fff;
    border-top:1px solid rgba(0,0,0,.08);box-shadow:0 14px 26px rgba(16,32,26,.12);
    z-index:65;max-height:70vh;overflow:auto;
  }
  .site-header .nav-links.open{display:flex}
  .site-header .nav-links li{width:100%;margin:0}
  .site-header .nav-links li a{
    display:block;width:100%;padding:15px 22px;text-align:left;
    color:var(--ink);font-weight:600;font-size:16px;border-bottom:1px solid rgba(0,0,0,.06);
  }
  .site-header .nav-links li:last-child a{border-bottom:0}
  .site-header .nav-links li a:hover,.site-header .nav-links li a:active{background:var(--muted)}
}
