:root{ --primary:#00d26a; }
.text-primary, .bg-primary { color: var(--primary); }
.bg-primary{ background-color: var(--primary) !important; }

/* Enlace activo del menú */
.nav-active {
  color: #067ff9 !important;
  position: relative;
  font-weight: 800;
}

/* Línea inferior fina */
.nav-active::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -6px;
  width: 100%;
  height: 2px;
  background-color: #067ff9;
  border-radius: 999px;
}

/* Versión móvil */
#mobileMenu .nav-active {
  background: rgba(6,127,249,0.08);
  border-radius: 0.75rem;
  padding: 0.5rem 0.75rem;
}

/* Mejora el scroll suave y el “arrastre” */
.js-tv-scroller,
.js-premium-scroller,
.js-sports-scroller {
  scroll-behavior: auto; /* dejamos que JS controle */
  -webkit-overflow-scrolling: touch;
}


/* Evita que las clones “rompan” el diseño (opcional) */
.is-clone {
  pointer-events: none; /* los clones no capturan clic */
}

/* Desactiva snap mientras el auto-scroll corre */
.js-nosnap {
  scroll-snap-type: none !important;
  scroll-behavior: auto !important;
}

/* clones no deben capturar clics */
.is-clone { pointer-events: none; }

/* desactiva snap mientras el auto-scroll corre */
.js-nosnap { scroll-snap-type: none !important; }

/* Cuando JS pone .js-nosnap, desactivamos el snap (si no, el scroll se clava) */
.js-nosnap{
  scroll-snap-type: none !important;
  scroll-behavior: auto !important;
}
.js-nosnap > *{
  scroll-snap-align: none !important;
}

.js-nosnap{
  scroll-snap-type: none !important;
  scroll-behavior: auto !important;
}
.js-nosnap > *{
  scroll-snap-align: none !important;
}

/* Auto-scroll: desactivar el snap mientras corre */
.js-hscroll.js-nosnap{
  scroll-snap-type: none !important;
}

.js-hscroll.js-nosnap > *{
  scroll-snap-align: none !important;
}

/* =========================
   CINE PREMIUM (PRO)
   ========================= */
.mb-divider-premium{
  height: 1px;
  width: 100%;
  margin: 6px 0 10px;
  background: linear-gradient(90deg, rgba(255,255,255,0), rgba(255,255,255,.14), rgba(255,255,255,0));
}

.mb-premium-card{
  background-color: rgba(255,255,255,.04);
}

.mb-badge-premium{
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 10px;
  border-radius: 12px;
  font-size: 11px;
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: #1a1200;
  border: 1px solid rgba(255,255,255,.22);
  background: linear-gradient(135deg, #ffe9a6, #d7a742 55%, #a87922);
  box-shadow: 0 10px 22px rgba(0,0,0,.28);
}

.mb-badge-premium::after{
  content:"";
  position:absolute;
  inset:0;
  border-radius: 12px;
  background: linear-gradient(120deg, rgba(255,255,255,.55), rgba(255,255,255,0) 45%);
  opacity:.22;
  pointer-events:none;
}

.mb-badge-genre{
  display:inline-flex;
  align-items:center;
  padding: 6px 10px;
  border-radius: 12px;
  font-size: 11px;
  font-weight: 800;
  color: rgba(255,255,255,.88);
  background: rgba(255,255,255,.10);
  border: 1px solid rgba(255,255,255,.14);
  backdrop-filter: blur(10px);
}

.js-premium-preview{
  pointer-events: none; /* para que el click siempre abra el modal */
}

.js-premium-preview iframe{
  width:100%;
  height:100%;
  border:0;
}

  html { font-size: 16px; }

  @media (max-width: 480px) {
    html { font-size: 14px; } /* prueba 13px si aún lo ves grande */
  }

  @media (max-width: 360px) {
    html { font-size: 13px; }
  }