/* NexoPlay V6 — apariencia final + correcciones visuales seguras. */
:root{
  --nx6-bg:#f6f9ff;
  --nx6-surface:#ffffff;
  --nx6-surface2:#edf3fb;
  --nx6-ink:#17304f;
  --nx6-muted:#6f8198;
  --nx6-line:#dbe5f1;
  --nx6-purple:#715cff;
  --nx6-cyan:#1fc6e8;
}

/* Quitamos la sensación de encabezado negro/línea gris en los modales clave. */
#purchasesModalBg .tutorial-modal,
#ordersModalBg .tutorial-modal,
#recoveryModalBg .tutorial-modal,
#authBg .auth-modal,
#nexoVipBg .nx-vip-modal,
#nx6ReferralManagerBg .nx6-ref-modal,
#nexoReferralBg .nx-vip-modal,
#nexoReferralBg .auth-modal,
#nexoReferralBg .tutorial-modal{
  background:linear-gradient(145deg,#ffffff,#f3f7fd)!important;
  color:var(--nx6-ink)!important;
  border:1px solid rgba(100,124,156,.18)!important;
  box-shadow:0 35px 100px rgba(33,60,96,.20)!important;
}
#purchasesModalBg .tutorial-modal-head,
#ordersModalBg .tutorial-modal-head,
#recoveryModalBg .tutorial-modal-head,
#authBg .auth-head,
#authBg .tutorial-modal-head,
#nexoVipBg .nx-vip-head,
#nexoReferralBg .nx-vip-head{
  border-bottom:0!important;
  background:radial-gradient(450px 100px at 10% 0%,rgba(113,92,255,.12),transparent 72%),radial-gradient(400px 110px at 92% 0%,rgba(31,198,232,.11),transparent 72%),transparent!important;
  color:var(--nx6-ink)!important;
  position:relative;
}
#purchasesModalBg .tutorial-modal-head:after,
#ordersModalBg .tutorial-modal-head:after,
#recoveryModalBg .tutorial-modal-head:after,
#authBg .auth-head:after,
#nexoVipBg .nx-vip-head:after{
  content:"";position:absolute;left:22px;right:22px;bottom:0;height:2px;border-radius:999px;
  background:linear-gradient(90deg,transparent,var(--nx6-purple),var(--nx6-cyan),transparent);
  opacity:.6;
}
#purchasesModalBg h2,
#ordersModalBg h2,
#recoveryModalBg h2,
#authBg h2,
#nexoVipBg h2{color:var(--nx6-ink)!important}
#purchasesModalBg .close,
#ordersModalBg .close,
#recoveryModalBg .close,
#authBg .close,
#nexoVipBg .close,
#nx6ReferralManagerBg .nx6-close{
  background:#edf3fb!important;color:var(--nx6-ink)!important;border:1px solid var(--nx6-line)!important;
}

/* Carrusel de plataformas: solo nombres, ligero y RGB. */
.nx6-ticker{overflow:hidden;position:relative;margin:0 22px 14px;padding:7px 0;border:1px solid rgba(113,92,255,.12);border-radius:999px;background:rgba(255,255,255,.72);box-shadow:0 8px 24px rgba(40,72,110,.05)}
.nx6-ticker-track{display:flex;gap:22px;white-space:nowrap;width:max-content;animation:nx6Ticker 28s linear infinite}
.nx6-ticker span{font-size:10px;font-weight:900;letter-spacing:.9px;background:linear-gradient(90deg,#6d4aff,#1fc6e8,#d34cff,#6d4aff);-webkit-background-clip:text;background-clip:text;color:transparent}
.nx6-ticker:hover .nx6-ticker-track{animation-play-state:paused}
@keyframes nx6Ticker{from{transform:translateX(0)}to{transform:translateX(-50%)}}

/* Títulos de rangos y compras. */
#purchasesModalBg .purchase-page,
#ordersModalBg .quick-modal-body,
#nexoVipBg .nx-vip-body{background:transparent!important}
#purchasesModalBg .purchase-grid,
#ordersModalBg .quick-orders{color:var(--nx6-ink)}

/* Perfil actual: evita apariencia de “bloque negro”. */
#authBg .auth-body{background:transparent!important}
#authBg .auth-tabs{background:#edf3fb;border:1px solid var(--nx6-line);padding:5px;border-radius:14px}
#authBg .auth-tab{background:transparent;border:0;color:#60748e}
#authBg .auth-tab.active{background:#fff;color:#4f46d8;box-shadow:0 6px 16px rgba(37,61,98,.08)}
#authBg .auth-label{color:#60748e!important}
#authBg .auth-input,
#recoveryModalBg .auth-input{background:#fff!important;color:var(--nx6-ink)!important;border-color:var(--nx6-line)!important;box-shadow:none!important}
#authBg .auth-input:focus,
#recoveryModalBg .auth-input:focus{border-color:#8a78ff!important;box-shadow:0 0 0 4px rgba(113,92,255,.10)!important}
#authBg .password-toggle{color:#5a50d8}
#authBg .recovery-box{background:#eef4fb!important;border-color:var(--nx6-line)!important}
#authBg .recovery-title{color:var(--nx6-ink)!important}
#authBg .recovery-box p{color:var(--nx6-muted)!important}
#authBg .recovery-btn{background:#fff!important;border-color:var(--nx6-line)!important;color:#29415f!important}
#authBg .register-pin-card{background:#eef4fb!important;border-color:var(--nx6-line)!important;color:var(--nx6-ink)!important}
#authBg .pin-title,#authBg .pin-sub,#authBg .security-hint{color:inherit!important}

/* Centro VIP / Panel de referidos. */
#nexoVipBg .nx-vip-modal{width:min(1120px,96vw)!important;max-width:1120px!important;border-radius:30px!important;overflow:hidden}
#nexoVipBg .nx-vip-body{padding:20px 22px 24px!important}
.nx6-membership-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:14px}
.nx6-card{background:#fff;border:1px solid var(--nx6-line);border-radius:20px;padding:18px;box-shadow:0 10px 28px rgba(33,61,101,.06)}
.nx6-card.hero{background:radial-gradient(450px 180px at 0% 0%,rgba(113,92,255,.12),transparent 72%),radial-gradient(350px 160px at 100% 0%,rgba(31,198,232,.11),transparent 72%),#fff}
.nx6-card h3{margin:6px 0;color:var(--nx6-ink);font-size:24px;letter-spacing:-.6px}
.nx6-card h4{margin:0;color:var(--nx6-ink);font-size:15px}
.nx6-card p{color:var(--nx6-muted);font-size:11px;line-height:1.65}
.nx6-badge{display:inline-flex;align-items:center;gap:5px;padding:6px 9px;border-radius:999px;background:#eef8f3;color:#1a8d60;font-size:9px;font-weight:900}
.nx6-benefits{display:grid;grid-template-columns:repeat(2,1fr);gap:9px;margin-top:12px}
.nx6-benefit{padding:12px;border-radius:14px;background:#f7faff;border:1px solid #e4ecf5}
.nx6-benefit strong{display:block;color:var(--nx6-ink);font-size:11px;margin-bottom:3px}.nx6-benefit span{display:block;color:var(--nx6-muted);font-size:9px;line-height:1.5}
.nx6-contact{margin-top:12px;padding:13px;border-radius:16px;background:linear-gradient(135deg,#f1edff,#edfaff);border:1px solid rgba(113,92,255,.15)}
.nx6-contact strong{display:block;color:var(--nx6-ink);font-size:12px}.nx6-contact span{display:block;margin:4px 0 10px;color:#667b96;font-size:10px}
.nx6-contact a{display:inline-flex;text-decoration:none;align-items:center;justify-content:center;padding:9px 12px;border-radius:10px;background:linear-gradient(135deg,#6d4aff,#1fc6e8);color:#fff;font-size:10px;font-weight:900}
.nx6-kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:9px;margin-top:12px}.nx6-kpi{background:#fff;border:1px solid var(--nx6-line);border-radius:16px;padding:13px}.nx6-kpi span{display:block;color:#71839b;font-size:9px}.nx6-kpi b{display:block;color:var(--nx6-ink);font-size:18px;margin-top:4px}

/* Panel de referidos separado: aquí sí vive el código. */
#nx6ReferralManagerBg{position:fixed;inset:0;z-index:280;display:none;align-items:center;justify-content:center;padding:16px;background:rgba(8,15,27,.54);backdrop-filter:blur(12px)}
#nx6ReferralManagerBg.open{display:flex}
.nx6-ref-modal{width:min(1120px,96vw);max-height:92vh;overflow:auto;border-radius:30px;padding:22px}
.nx6-ref-head{display:flex;justify-content:space-between;gap:15px;align-items:flex-start;margin-bottom:14px}.nx6-ref-head h3{margin:5px 0;color:var(--nx6-ink);font-size:26px}.nx6-ref-head p{margin:0;color:var(--nx6-muted);font-size:11px;line-height:1.6}
.nx6-code-box{padding:18px;border-radius:20px;background:linear-gradient(135deg,#eef0ff,#eafaff);border:1px solid rgba(113,92,255,.18)}
.nx6-code-label{font-size:9px;font-weight:950;letter-spacing:1.5px;color:#6c5ee7}.nx6-code-value{font-size:31px;font-weight:950;color:#17304f;letter-spacing:2px;margin:7px 0;overflow-wrap:anywhere}
.nx6-code-actions{display:flex;gap:7px;flex-wrap:wrap}.nx6-code-actions button{border:1px solid #d5def0;background:#fff;color:#29415f;border-radius:10px;padding:9px 11px;font-size:10px;font-weight:900}.nx6-code-actions button.primary{border:0;background:linear-gradient(135deg,#6d4aff,#1fc6e8);color:#fff}
.nx6-tabs{display:flex;gap:6px;margin:12px 0;padding:6px;border-radius:14px;background:#eaf0f7}.nx6-tabs button{flex:1;border:0;border-radius:10px;background:transparent;color:#60748e;padding:10px;font-weight:900}.nx6-tabs button.active{background:#fff;color:#4f46d8;box-shadow:0 5px 14px rgba(38,62,99,.08)}
.nx6-list{display:grid;gap:8px}.nx6-request,.nx6-client{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px;align-items:center;background:#fff;border:1px solid var(--nx6-line);border-radius:15px;padding:12px}.nx6-request-id,.nx6-client-id{display:flex;align-items:center;gap:9px;min-width:0}.nx6-avatar{width:40px;height:40px;flex:0 0 40px;border-radius:13px;display:grid;place-items:center;background:linear-gradient(145deg,#edf0ff,#e7f9fd);color:#4e48db;font-weight:950}.nx6-request-id strong,.nx6-client-id strong{display:block;color:var(--nx6-ink);font-size:11px;overflow-wrap:anywhere}.nx6-request-id span,.nx6-client-id span,.nx6-request-id small,.nx6-client-id small{display:block;color:#74879f;font-size:9px;overflow-wrap:anywhere}
.nx6-request-actions{grid-column:1/-1;display:flex;gap:7px}.nx6-request-actions button{border:1px solid #bfe8d5;background:#effaf5;color:#197d58;border-radius:9px;padding:8px 11px;font-size:10px;font-weight:900}.nx6-request-actions button.reject{border-color:#f0ccd3;background:#fff2f4;color:#b6344c}
.nx6-client-metrics{display:flex;gap:8px;flex-wrap:wrap}.nx6-metric{min-width:88px;padding:9px 10px;border-radius:11px;background:#f7faff;border:1px solid #e4ecf5}.nx6-metric span{display:block;color:#7a8ca2;font-size:8px}.nx6-metric b{display:block;color:var(--nx6-ink);font-size:13px;margin-top:2px}
.nx6-privacy{margin-top:12px;padding:10px 12px;border-radius:12px;background:#eef4fb;color:#607691;font-size:9px;line-height:1.55}

/* Modales de código y formularios V5/V6. */
#nexoReferralBg .nx-vip-modal{width:min(560px,94vw)!important;border-radius:24px!important}
#nexoReferralBg .nx-vip-body{padding:20px!important}
#nexoReferralBg .nx-referral-input{background:#fff!important;color:var(--nx6-ink)!important;border:1px solid var(--nx6-line)!important}

/* Panel de ventas ya existente: mantener estilo claro V5 y reforzarlo. */
#distributorPanelBg .distributor-topbar{background:transparent!important;border-bottom:0!important}
#distributorPanelBg .distributor-modal{background:linear-gradient(180deg,#f7fbff,#edf4fb)!important}

@media(max-width:820px){
  .nx6-membership-grid{grid-template-columns:1fr}
  .nx6-benefits{grid-template-columns:1fr}
  .nx6-client{grid-template-columns:1fr}
  .nx6-client-metrics{justify-content:flex-start}
}
@media(max-width:620px){
  .nx6-code-value{font-size:24px}
  .nx6-kpis{grid-template-columns:1fr 1fr}
  .nx6-ref-modal{padding:15px;border-radius:22px}
  .nx6-ticker{margin-left:14px;margin-right:14px}
}