/*
 * NexoPlay V49 - acceso al catálogo + autofill auth
 * No introduce timers ni observers. El catálogo permanece bloqueado
 * hasta que exista una sesión aprobada por el flujo de afiliación.
 */

/* ---------- Chrome / Google autofill ---------- */
/* Logged-out auth only; the profile continues using the existing styles. */
#authBg:not([data-nx7-mode="profile"]):not([data-nx8-profile="1"]) .auth-input:-webkit-autofill,
#authBg:not([data-nx7-mode="profile"]):not([data-nx8-profile="1"]) .auth-input:-webkit-autofill:hover,
#authBg:not([data-nx7-mode="profile"]):not([data-nx8-profile="1"]) .auth-input:-webkit-autofill:focus,
#authBg:not([data-nx7-mode="profile"]):not([data-nx8-profile="1"]) .auth-input:-webkit-autofill:active {
  -webkit-text-fill-color: #fff !important;
  caret-color: #fff !important;
  background-color: transparent !important;
  box-shadow: 0 0 0 1000px rgba(5,10,24,.28) inset !important;
  border-color: rgba(255,255,255,.22) !important;
}

/* The browser can paint its own yellow/blue autofill background through the
   transition. Keep the auth surface visually stable for both themes. */
#authBg:not([data-nx7-mode="profile"]):not([data-nx8-profile="1"]) .auth-input:-webkit-autofill {
  transition: background-color 9999s ease-out 0s !important;
}

/* Light mode keeps the auth glass look but the autofilled text must remain
   readable against the dark glass instead of Chrome choosing a light fill. */
body[data-nx-theme="light"] #authBg:not([data-nx7-mode="profile"]):not([data-nx8-profile="1"]) .auth-input:-webkit-autofill,
body[data-nx-theme="light"] #authBg:not([data-nx7-mode="profile"]):not([data-nx8-profile="1"]) .auth-input:-webkit-autofill:hover,
body[data-nx-theme="light"] #authBg:not([data-nx7-mode="profile"]):not([data-nx8-profile="1"]) .auth-input:-webkit-autofill:focus,
body[data-nx-theme="light"] #authBg:not([data-nx7-mode="profile"]):not([data-nx8-profile="1"]) .auth-input:-webkit-autofill:active {
  -webkit-text-fill-color: #fff !important;
  background-color: transparent !important;
  box-shadow: 0 0 0 1000px rgba(5,10,24,.28) inset !important;
  color: #fff !important;
}

/* ---------- Catalog lock ---------- */
html.nx49-access-lock #catalogo > :not(#nx49CatalogGate) {
  display: none !important;
}

#nx49CatalogGate {
  display: none;
  margin-top: 18px;
}

html.nx49-access-lock #nx49CatalogGate,
html.nx49-access-checking #nx49CatalogGate {
  display: block;
}

.nx49-catalog-gate-card {
  width: min(720px, 100%);
  box-sizing: border-box;
  margin: 0 auto;
  padding: clamp(24px, 5vw, 38px);
  text-align: center;
  border: 1px solid rgba(120,120,150,.18);
  border-radius: 24px;
  background: rgba(255,255,255,.66);
  box-shadow: 0 18px 55px rgba(20,30,60,.11);
}

.nx49-catalog-gate-icon {
  width: 58px;
  height: 58px;
  margin: 0 auto 14px;
  display: grid;
  place-items: center;
  border-radius: 18px;
  background: linear-gradient(135deg, rgba(114,88,255,.16), rgba(45,199,243,.14));
  font-size: 28px;
}

.nx49-catalog-gate-card h3 {
  margin: 0;
  color: #16233a;
  font-size: clamp(22px, 4vw, 30px);
  line-height: 1.12;
}

.nx49-catalog-gate-card p {
  max-width: 560px;
  margin: 10px auto 0;
  color: #68738a;
  font-size: 13px;
  line-height: 1.65;
}

.nx49-catalog-gate-actions {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 9px;
  margin-top: 20px;
}

.nx49-catalog-gate-actions button {
  min-height: 42px;
  padding: 10px 16px;
  border: 1px solid rgba(120,120,150,.2);
  border-radius: 12px;
  background: #fff;
  color: #25324a;
  font: inherit;
  font-weight: 850;
  cursor: pointer;
}

.nx49-catalog-gate-actions button.primary {
  border-color: transparent;
  color: #fff;
  background: linear-gradient(135deg,#7258ff,#2dc7f3);
}

html.nx49-access-lock .hero-cta.primary-cta {
  cursor: pointer;
}

html.nx49-access-lock .hero-search {
  opacity: .72;
}

html.nx49-access-lock .hero-search .search {
  cursor: not-allowed;
}

html.nx49-access-lock #catalogo {
  scroll-margin-top: 18px;
}

/* Dark theme */
body[data-nx-theme="dark"] .nx49-catalog-gate-card,
html.nx49-access-lock body[data-nx-theme="dark"] .nx49-catalog-gate-card {
  background: rgba(17,22,38,.78);
  border-color: rgba(255,255,255,.12);
  box-shadow: 0 18px 60px rgba(0,0,0,.24);
}

body[data-nx-theme="dark"] .nx49-catalog-gate-card h3 {
  color: #f6f8ff;
}

body[data-nx-theme="dark"] .nx49-catalog-gate-card p {
  color: #aeb8cb;
}

body[data-nx-theme="dark"] .nx49-catalog-gate-actions button {
  background: #1b2234;
  border-color: rgba(255,255,255,.12);
  color: #eef3ff;
}

@media (max-width: 560px) {
  .nx49-catalog-gate-card {
    padding: 22px 16px;
    border-radius: 20px;
  }

  .nx49-catalog-gate-actions {
    flex-direction: column;
  }

  .nx49-catalog-gate-actions button {
    width: 100%;
  }
}

@media (prefers-reduced-motion: reduce) {
  #authBg:not([data-nx7-mode="profile"]):not([data-nx8-profile="1"]) .auth-input:-webkit-autofill {
    transition: none !important;
  }
}