/*
 * ╔═══════════════════════════════════════════════════════════════╗
 * ║  NEXURA PREMIUM THEME — Dark Mode (opt-in, no destructivo)     ║
 * ║  Se activa SOLO con  html[data-nx-theme="dark"].              ║
 * ║  Sin el atributo, la interfaz clara original queda intacta.   ║
 * ║  No cambia HTML, PHP ni lógica: solo re-mapea tokens --nx-*   ║
 * ║  y añade glass/glow a los componentes existentes.            ║
 * ╚═══════════════════════════════════════════════════════════════╝ */

/* ═══ 0. TIPOGRAFÍA — Plus Jakarta Sans (biblia, en claro Y oscuro) ═══ */
body, .partner-body, .admin-body,
body h1, body h2, body h3, body h4, body h5, body h6,
body .btn, body input, body select, body textarea, body .form-control {
  font-family: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
}
body h1, body h2, body h3, body .h1, body .h2, body .h3 { letter-spacing: -0.02em; }

/* ═══ 0b. NITIDEZ TIPOGRÁFICA — global (claro y oscuro) ═══
   Suaviza el render (antialiasing) y afina pesos: los 800–900 se
   veían demasiado gruesos; el máximo del sistema baja a 700. */
html, body {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}
body h1, body h2, body h3, body h4, body h5, body h6,
body .h1, body .h2, body .h3, body .h4, body .h5, body .h6,
body strong, body b, body .fw-bold, body .fw-bolder,
body .fw-800, body .fw-900 { font-weight: 700; }
body .display-1, body .display-2, body .display-3,
body .display-4, body .display-5, body .display-6 { font-weight: 700; }

/* ═══ 1. DESIGN TOKENS (Design Bible — navy premium elevado, no negro puro) ═══ */
html[data-nx-theme="dark"] {
  /* Superficies — slate/navy de la biblia (#151C2F / #1A1F36) */
  --nx-bg:      #0f1326;
  --nx-bg2:     #131834;
  --nx-bg3:     #1a1f3a;
  --nx-card:    rgba(26,31,58,.64);
  --nx-card2:   rgba(33,40,72,.82);
  --nx-soft:    rgba(124,58,237,.14);
  --nx-border:  rgba(124,111,240,.20);
  --nx-border2: rgba(139,124,246,.34);

  /* Marca (paleta oficial NEXURA) */
  --nx-pri:   #8b5cf6;
  --nx-pri2:  #7c3aed;
  --nx-pri3:  #6d28d9;
  --nx-acc:   #a78bfa;
  --nx-acc2:  #c4b5fd;
  --nx-blue:  #3b82f6;
  --nx-cyan:  #06b6d4;
  --nx-pink:  #ec4b99;

  /* Texto (slate) */
  --nx-ink:   #f1f5f9;
  --nx-dim:   #cbd5e1;
  --nx-muted: #7c88a5;

  /* Gradientes — morado → azul eléctrico → cian (biblia) */
  --nx-grad:      linear-gradient(135deg, #8b5cf6 0%, #3b82f6 52%, #06b6d4 100%);
  --nx-grad-soft: linear-gradient(135deg, rgba(139,92,246,.22), rgba(6,182,212,.14));

  /* Sombras con glow */
  --nx-shadow-sm: 0 2px 12px rgba(124,58,237,.16);
  --nx-shadow-md: 0 10px 34px rgba(60,20,120,.40);
  --nx-shadow-lg: 0 20px 60px rgba(76,29,149,.48);
  --nx-shadow-xl: 0 28px 80px rgba(10,8,24,.70);
  --nx-glow:      0 0 0 1px rgba(139,124,246,.22), 0 10px 44px rgba(124,58,237,.32);
  --nx-glow-cyan: 0 0 26px rgba(34,211,238,.30);

  /* Radios amplios */
  --nx-r-sm: 12px;
  --nx-r-md: 16px;
  --nx-r-lg: 20px;
  --nx-r-xl: 24px;

  color-scheme: dark;
}

/* ═══ 2. LIENZO (fondo aurora sutil) ═══ */
html[data-nx-theme="dark"] body {
  background:
    radial-gradient(1100px 620px at 10% -8%, rgba(139,92,246,.22), transparent 60%),
    radial-gradient(1000px 560px at 100% 0%, rgba(6,182,212,.14), transparent 55%),
    radial-gradient(900px 700px at 50% 120%, rgba(59,130,246,.16), transparent 60%),
    #0f1326 !important;
  color: var(--nx-ink);
  -webkit-font-smoothing: antialiased;
}
html[data-nx-theme="dark"] .partner-body,
html[data-nx-theme="dark"] .admin-body { background: transparent !important; }

/* Texto legible en oscuro — GLOBAL y estructural (cada selector lleva su prefijo).
   Fuerza tinta clara en títulos, párrafos, listas, celdas y etiquetas EN TODO EL
   CONTENIDO (no solo tarjetas). Los colores semánticos viven en .text-*/.badge y
   ganan por especificidad, así que se conservan. */
html[data-nx-theme="dark"] h1, html[data-nx-theme="dark"] h2,
html[data-nx-theme="dark"] h3, html[data-nx-theme="dark"] h4,
html[data-nx-theme="dark"] h5, html[data-nx-theme="dark"] h6,
html[data-nx-theme="dark"] p,  html[data-nx-theme="dark"] li,
html[data-nx-theme="dark"] dt, html[data-nx-theme="dark"] dd,
html[data-nx-theme="dark"] label, html[data-nx-theme="dark"] td,
html[data-nx-theme="dark"] th, html[data-nx-theme="dark"] caption,
html[data-nx-theme="dark"] figcaption, html[data-nx-theme="dark"] legend,
html[data-nx-theme="dark"] summary, html[data-nx-theme="dark"] blockquote,
html[data-nx-theme="dark"] .h1, html[data-nx-theme="dark"] .h2,
html[data-nx-theme="dark"] .h3, html[data-nx-theme="dark"] .h4,
html[data-nx-theme="dark"] .h5, html[data-nx-theme="dark"] .h6 { color: var(--nx-ink) !important; }
html[data-nx-theme="dark"] .text-muted,
html[data-nx-theme="dark"] .text-secondary,
html[data-nx-theme="dark"] small { color: var(--nx-dim) !important; }
html[data-nx-theme="dark"] .text-dark,
html[data-nx-theme="dark"] .text-body,
html[data-nx-theme="dark"] .text-black { color: var(--nx-ink) !important; }
html[data-nx-theme="dark"] a { color: var(--nx-acc); }
html[data-nx-theme="dark"] hr { border-color: var(--nx-border); opacity: 1; }

/* Contraste en oscuro — robusto y simple (evita :is/:not anidados que Chrome evalúa mal).
   1) contenedores heredan tinta clara; 2) números/valores oscuros incrustados se fuerzan;
   3) texto estructural de tarjetas/tablas a tinta. NO toca verdes/rojos (viven en badges
   y utilidades .text-*, que conservan su color). */
html[data-nx-theme="dark"] .card,
html[data-nx-theme="dark"] .nx-card,
html[data-nx-theme="dark"] .nx-panel,
html[data-nx-theme="dark"] .panel,
html[data-nx-theme="dark"] .box,
html[data-nx-theme="dark"] .list-group-item,
html[data-nx-theme="dark"] .table,
html[data-nx-theme="dark"] .nx-table,
html[data-nx-theme="dark"] .modal-content,
html[data-nx-theme="dark"] .nx-page-head { color: var(--nx-ink); }

/* Colores slate/oscuros de la paleta del sistema incrustados EN LÍNEA (div/span con
   color:#…) → tinta clara. Lista específica de hexes oscuros → NO toca verdes/rojos/
   ámbar semánticos. Flag «i» para mayúsculas/minúsculas. */
html[data-nx-theme="dark"] [style*="#0f172a" i], html[data-nx-theme="dark"] [style*="#1e293b" i],
html[data-nx-theme="dark"] [style*="#334155" i], html[data-nx-theme="dark"] [style*="#475569" i],
html[data-nx-theme="dark"] [style*="#1a0a2e" i], html[data-nx-theme="dark"] [style*="#1f1235" i],
html[data-nx-theme="dark"] [style*="#0b0b14" i], html[data-nx-theme="dark"] [style*="#111827" i],
html[data-nx-theme="dark"] [style*="#151c2f" i], html[data-nx-theme="dark"] [style*="#1a1f36" i],
html[data-nx-theme="dark"] [style*="#1e1e2e" i], html[data-nx-theme="dark"] [style*="#2a2a3a" i],
html[data-nx-theme="dark"] [style*="#0f1326" i], html[data-nx-theme="dark"] [style*="#180d2e" i],
html[data-nx-theme="dark"] [style*="#220a40" i], html[data-nx-theme="dark"] [style*="#3b2a5a" i],
html[data-nx-theme="dark"] [style*="#374151" i], html[data-nx-theme="dark"] [style*="#4b5563" i],
html[data-nx-theme="dark"] [style*="#6b7280" i], html[data-nx-theme="dark"] [style*="#1f2937" i],
html[data-nx-theme="dark"] [style*="#0f172a" i], html[data-nx-theme="dark"] [style*="#0b0d17" i] {
  color: var(--nx-ink) !important;
}
/* Etiquetas con color oscuro por CLASE (no inline): quick-tiles del dashboard y afines.
   Se listan clases conocidas de texto oscuro fijo — seguro (no toca color semántico). */
html[data-nx-theme="dark"] .qt,
html[data-nx-theme="dark"] .qtile-label,
html[data-nx-theme="dark"] .tile-title,
html[data-nx-theme="dark"] .q-title { color: var(--nx-ink) !important; }

/* Tarjetas de acceso rápido: fondo blanco fijo → glass oscuro en modo oscuro
   (la destacada .hero conserva su gradiente). Así el texto claro se lee. */
html[data-nx-theme="dark"] .nx-qtile:not(.hero) {
  background: var(--nx-card) !important;
  border: 1px solid var(--nx-border) !important;
  -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px);
}
html[data-nx-theme="dark"] .nx-qtile:not(.hero):hover {
  border-color: var(--nx-border2) !important;
  box-shadow: var(--nx-glow);
}
html[data-nx-theme="dark"] .qs { color: var(--nx-dim) !important; }

/* Topbar (barra superior) con fondo blanco fijo → glass oscuro en modo oscuro. */
html[data-nx-theme="dark"] .nx-topbar {
  background: rgba(15,19,38,.82) !important;
  border-color: var(--nx-border) !important;
  -webkit-backdrop-filter: blur(16px) saturate(140%); backdrop-filter: blur(16px) saturate(140%);
}
html[data-nx-theme="dark"] .nx-topbar-memb { color: var(--nx-acc) !important; }

/* ═══════════════════════════════════════════════════════════════════
   SISTEMA DE SUPERFICIES EN OSCURO — patrón único de combinación.
   TODA superficie con fondo blanco/claro fijo (por clase) se remapea a
   glass oscuro (--nx-card) con borde (--nx-border) y texto claro (--nx-ink).
   Los badges/alertas de color y los degradados de marca NO se tocan.
   ═══════════════════════════════════════════════════════════════════ */
html[data-nx-theme="dark"] .nx-stat,
html[data-nx-theme="dark"] .nx-filter-pill,
html[data-nx-theme="dark"] .btn-nx-soft,
html[data-nx-theme="dark"] .ps-profile,
html[data-nx-theme="dark"] .ps-stat-chip,
html[data-nx-theme="dark"] .store-cart-panel,
html[data-nx-theme="dark"] .store-cart-thumb,
html[data-nx-theme="dark"] .store-cart-summary-box,
html[data-nx-theme="dark"] .store-cart-empty,
html[data-nx-theme="dark"] #nx-chat-panel,
html[data-nx-theme="dark"] .nx-msg-bot,
html[data-nx-theme="dark"] .nx-chip {
  background: var(--nx-card) !important;
  border-color: var(--nx-border) !important;
  color: var(--nx-ink) !important;
  -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px);
}
/* Texto e iconos dentro de esas superficies → claros */
html[data-nx-theme="dark"] .nx-stat *:not(.badge):not([class*="nx-badge"]):not(svg):not(path),
html[data-nx-theme="dark"] .ps-profile *:not(svg):not(path),
html[data-nx-theme="dark"] .store-cart-panel *:not(.badge):not(svg):not(path) { color: var(--nx-ink); }
/* Iconos (svg con currentColor oscuro) dentro de superficies claras → acento */
html[data-nx-theme="dark"] .nx-stat svg,
html[data-nx-theme="dark"] .nx-filter-pill svg,
html[data-nx-theme="dark"] .ps-profile svg { color: var(--nx-acc); }
html[data-nx-theme="dark"] [style*="#64748b" i], html[data-nx-theme="dark"] [style*="#6b5b8a" i],
html[data-nx-theme="dark"] [style*="#94a3b8" i], html[data-nx-theme="dark"] [style*="#9ca3af" i],
html[data-nx-theme="dark"] [style*="#8b90b5" i] { color: var(--nx-dim) !important; }

/* ── TIENDA (storefront) en oscuro — superficies claras → glass ── */
html[data-nx-theme="dark"] .store-topbar-sticky,
html[data-nx-theme="dark"] .store-catalog-toolbar,
html[data-nx-theme="dark"] .store-product,
html[data-nx-theme="dark"] .store-product-media,
html[data-nx-theme="dark"] .store-panel,
html[data-nx-theme="dark"] .store-search,
html[data-nx-theme="dark"] .store-nav-home,
html[data-nx-theme="dark"] .store-nav-pill,
html[data-nx-theme="dark"] .store-stat-chip,
html[data-nx-theme="dark"] .store-price-row,
html[data-nx-theme="dark"] .store-drawer-suggestion,
html[data-nx-theme="dark"] .store-cart-drawer-panel,
html[data-nx-theme="dark"] .store-preview,
html[data-nx-theme="dark"] .store-preview-panel,
html[data-nx-theme="dark"] .store-benefits,
html[data-nx-theme="dark"] .store-benefits-panel {
  background: var(--nx-card) !important;
  border-color: var(--nx-border) !important;
  color: var(--nx-ink) !important;
  -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px);
}
/* Texto dentro de superficies de tienda (excepto badges/botones de color, iconos) → claro */
html[data-nx-theme="dark"] .store-topbar-sticky *:not([class*="badge"]):not([class*="btn"]):not(svg):not(path),
html[data-nx-theme="dark"] .store-product *:not([class*="badge"]):not([class*="btn"]):not(svg):not(path),
html[data-nx-theme="dark"] .store-panel *:not([class*="badge"]):not([class*="btn"]):not(svg):not(path),
html[data-nx-theme="dark"] .store-preview *:not([class*="badge"]):not([class*="btn"]):not(svg):not(path),
html[data-nx-theme="dark"] .store-drawer-suggestion *:not([class*="badge"]):not([class*="btn"]):not(svg):not(path),
html[data-nx-theme="dark"] .store-cart-drawer-panel *:not([class*="badge"]):not([class*="btn"]):not(svg):not(path) { color: var(--nx-ink); }
/* Subtítulos / kickers / precios tachados de tienda → tenue */
html[data-nx-theme="dark"] .store-preview-kicker,
html[data-nx-theme="dark"] .store-benefits-kicker,
html[data-nx-theme="dark"] .store-preview-badge,
html[data-nx-theme="dark"] .store-nav-divider,
html[data-nx-theme="dark"] .store-cart-drawer-sub,
html[data-nx-theme="dark"] .store-preview-empty,
html[data-nx-theme="dark"] .store-price-was { color: var(--nx-dim) !important; }
/* Chips pequeños con fondo claro propio dentro de tarjetas/modales de tienda */
html[data-nx-theme="dark"] .store-product-category,
html[data-nx-theme="dark"] .store-product-sku,
html[data-nx-theme="dark"] .store-benefits-block,
html[data-nx-theme="dark"] .store-benefits-dialog,
html[data-nx-theme="dark"] .store-benefits-close,
html[data-nx-theme="dark"] .store-cart-drawer-close,
html[data-nx-theme="dark"] .store-drawer-suggestion-media,
html[data-nx-theme="dark"] .store-preview-badge,
html[data-nx-theme="dark"] .store-preview-close,
html[data-nx-theme="dark"] .store-preview-note,
html[data-nx-theme="dark"] .store-preview-option {
  background: var(--nx-card2) !important;
  border-color: var(--nx-border) !important;
  color: var(--nx-dim) !important;
}
html[data-nx-theme="dark"] .store-product-category { color: var(--nx-acc) !important; }
/* Selector de país/moneda (dropdown #nxc-drop, abre por click → fijo por CSS) */
html[data-nx-theme="dark"] #nxc-drop { background: var(--nx-bg2) !important; border-color: var(--nx-border) !important; }
html[data-nx-theme="dark"] #nxc-drop, html[data-nx-theme="dark"] #nxc-drop * { color: var(--nx-ink) !important; }
html[data-nx-theme="dark"] #nxc-drop .nx-country-opt { background: transparent !important; }
html[data-nx-theme="dark"] #nxc-drop .nx-country-opt.nxc-active { background: var(--nx-card2) !important; }
html[data-nx-theme="dark"] #nxc-drop .nxc-head,
html[data-nx-theme="dark"] #nxc-drop .nxco-sub { color: var(--nx-dim) !important; }
html[data-nx-theme="dark"] #nxc-drop .nxc-sep { border-color: var(--nx-border) !important; }

/* Números / métricas / valores destacados (el texto oscuro incrustado más visible) */
html[data-nx-theme="dark"] .metric,  html[data-nx-theme="dark"] .stat,
html[data-nx-theme="dark"] .value,   html[data-nx-theme="dark"] .kpi,
html[data-nx-theme="dark"] .number,  html[data-nx-theme="dark"] .amount,
html[data-nx-theme="dark"] .monto,   html[data-nx-theme="dark"] .saldo,
html[data-nx-theme="dark"] .display-1, html[data-nx-theme="dark"] .display-2,
html[data-nx-theme="dark"] .display-3, html[data-nx-theme="dark"] .display-4,
html[data-nx-theme="dark"] .display-5, html[data-nx-theme="dark"] .display-6 { color: var(--nx-ink) !important; }

/* Texto estructural dentro de tarjetas/tablas (títulos, párrafos, celdas, etiquetas) */
html[data-nx-theme="dark"] .card h1, html[data-nx-theme="dark"] .card h2,
html[data-nx-theme="dark"] .card h3, html[data-nx-theme="dark"] .card h4,
html[data-nx-theme="dark"] .card h5, html[data-nx-theme="dark"] .card h6,
html[data-nx-theme="dark"] .card p,  html[data-nx-theme="dark"] .card dt,
html[data-nx-theme="dark"] .card dd, html[data-nx-theme="dark"] .card label,
html[data-nx-theme="dark"] .table td, html[data-nx-theme="dark"] .table th,
html[data-nx-theme="dark"] .nx-table td, html[data-nx-theme="dark"] .nx-table th { color: var(--nx-ink) !important; }

/* ═══ 3. TARJETAS — glassmorphism ═══ */
html[data-nx-theme="dark"] .card,
html[data-nx-theme="dark"] .nx-card,
html[data-nx-theme="dark"] .nx-panel,
html[data-nx-theme="dark"] .panel,
html[data-nx-theme="dark"] .box {
  background: var(--nx-card) !important;
  border: 1px solid var(--nx-border) !important;
  border-radius: var(--nx-r-lg) !important;
  box-shadow: var(--nx-shadow-md);
  -webkit-backdrop-filter: blur(18px) saturate(140%);
  backdrop-filter: blur(18px) saturate(140%);
  color: var(--nx-ink);
  transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
html[data-nx-theme="dark"] .card:hover,
html[data-nx-theme="dark"] .nx-card:hover {
  transform: translateY(-3px);
  border-color: var(--nx-border2) !important;
  box-shadow: var(--nx-glow);
}
html[data-nx-theme="dark"] .card-header,
html[data-nx-theme="dark"] .card-footer {
  background: rgba(255,255,255,.02) !important;
  border-color: var(--nx-border) !important;
  color: var(--nx-ink);
}
html[data-nx-theme="dark"] .card-body { color: var(--nx-ink); }

/* Cabecera de módulo */
html[data-nx-theme="dark"] .nx-page-head {
  background: var(--nx-grad-soft) !important;
  border: 1px solid var(--nx-border) !important;
  border-radius: var(--nx-r-lg) !important;
  box-shadow: var(--nx-shadow-sm);
}

/* ═══ 4. BOTONES ═══ */
html[data-nx-theme="dark"] .btn-primary,
html[data-nx-theme="dark"] .btn-nx,
html[data-nx-theme="dark"] .btn-nx-primary {
  background: var(--nx-grad) !important;
  border: none !important;
  color: #fff !important;
  border-radius: 999px !important;
  font-weight: 600;
  box-shadow: 0 8px 24px rgba(124,58,237,.42);
  transition: transform .22s ease, box-shadow .22s ease, filter .22s ease;
}
html[data-nx-theme="dark"] .btn-primary:hover,
html[data-nx-theme="dark"] .btn-nx:hover {
  transform: translateY(-2px);
  filter: brightness(1.08);
  box-shadow: 0 12px 34px rgba(124,58,237,.55), var(--nx-glow-cyan);
}
html[data-nx-theme="dark"] .btn-secondary,
html[data-nx-theme="dark"] .btn-outline-primary,
html[data-nx-theme="dark"] .btn-outline-secondary,
html[data-nx-theme="dark"] .btn-light,
html[data-nx-theme="dark"] .btn-nx-outline {
  background: rgba(255,255,255,.04) !important;
  border: 1px solid var(--nx-border2) !important;
  color: var(--nx-ink) !important;
  border-radius: 999px !important;
  transition: background .22s ease, border-color .22s ease, transform .22s ease;
}
html[data-nx-theme="dark"] .btn-secondary:hover,
html[data-nx-theme="dark"] .btn-outline-primary:hover,
html[data-nx-theme="dark"] .btn-outline-secondary:hover,
html[data-nx-theme="dark"] .btn-light:hover,
html[data-nx-theme="dark"] .btn-nx-outline:hover {
  background: rgba(139,124,246,.14) !important;
  border-color: var(--nx-acc) !important;
  transform: translateY(-1px);
}
html[data-nx-theme="dark"] .btn-success { background: linear-gradient(135deg,#059669,#10b981)!important;border:none!important;border-radius:999px!important;color:#fff!important; }
html[data-nx-theme="dark"] .btn-danger  { background: linear-gradient(135deg,#dc2626,#f43f5e)!important;border:none!important;border-radius:999px!important;color:#fff!important; }
html[data-nx-theme="dark"] .btn-warning { background: linear-gradient(135deg,#d97706,#f59e0b)!important;border:none!important;border-radius:999px!important;color:#0b0b14!important; }

/* ═══ 5. TABLAS ═══ */
html[data-nx-theme="dark"] .table,
html[data-nx-theme="dark"] .nx-table {
  color: var(--nx-ink);
  border-color: var(--nx-border);
  --bs-table-bg: transparent;
  --bs-table-color: var(--nx-ink);
}
html[data-nx-theme="dark"] .table > :not(caption) > * > *,
html[data-nx-theme="dark"] .nx-table td,
html[data-nx-theme="dark"] .nx-table th {
  background: transparent !important;
  border-color: var(--nx-border) !important;
  color: var(--nx-ink);
}
html[data-nx-theme="dark"] .table thead th,
html[data-nx-theme="dark"] .nx-table thead th {
  background: rgba(124,58,237,.14) !important;
  color: var(--nx-acc2) !important;
  border-color: var(--nx-border2) !important;
  text-transform: uppercase;
  letter-spacing: .04em;
  font-size: .74rem;
}
html[data-nx-theme="dark"] .table tbody tr:hover > *,
html[data-nx-theme="dark"] .nx-table tbody tr:hover > * {
  background: rgba(139,124,246,.08) !important;
}
html[data-nx-theme="dark"] .table-striped > tbody > tr:nth-of-type(odd) > * {
  background: rgba(255,255,255,.02) !important;
  color: var(--nx-ink);
}

/* ═══ 6. FORMULARIOS — focus luminoso ═══ */
html[data-nx-theme="dark"] .form-control,
html[data-nx-theme="dark"] .form-select,
html[data-nx-theme="dark"] .nx-input,
html[data-nx-theme="dark"] textarea,
html[data-nx-theme="dark"] input[type="text"],
html[data-nx-theme="dark"] input[type="email"],
html[data-nx-theme="dark"] input[type="password"],
html[data-nx-theme="dark"] input[type="number"],
html[data-nx-theme="dark"] input[type="search"],
html[data-nx-theme="dark"] input[type="date"] {
  background: rgba(20,18,40,.55) !important;
  border: 1px solid var(--nx-border2) !important;
  border-radius: var(--nx-r-md) !important;
  color: var(--nx-ink) !important;
  transition: border-color .2s ease, box-shadow .2s ease, background .2s ease;
}
html[data-nx-theme="dark"] .form-control::placeholder,
html[data-nx-theme="dark"] .nx-input::placeholder { color: var(--nx-muted) !important; }
html[data-nx-theme="dark"] .form-control:focus,
html[data-nx-theme="dark"] .form-select:focus,
html[data-nx-theme="dark"] .nx-input:focus,
html[data-nx-theme="dark"] textarea:focus,
html[data-nx-theme="dark"] input:focus {
  background: rgba(20,18,40,.85) !important;
  border-color: var(--nx-acc) !important;
  box-shadow: 0 0 0 3px rgba(139,124,246,.22), 0 0 22px rgba(124,58,237,.28) !important;
  outline: none;
}
html[data-nx-theme="dark"] .form-select {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23c4b5fd' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e") !important;
  background-repeat: no-repeat !important;
  background-position: right 14px center !important;
  background-size: 15px 12px !important;
  padding-right: 40px !important;
}
html[data-nx-theme="dark"] .input-group-text {
  background: rgba(139,124,246,.10) !important;
  border-color: var(--nx-border2) !important;
  color: var(--nx-acc2) !important;
}

/* ═══ 7. BADGES / ALERTAS / CHIPS ═══ */
html[data-nx-theme="dark"] .badge.bg-primary,
html[data-nx-theme="dark"] .nx-badge { background: var(--nx-grad) !important; color: #fff !important; }
html[data-nx-theme="dark"] .badge.bg-light { background: rgba(255,255,255,.08)!important; color: var(--nx-ink)!important; }
html[data-nx-theme="dark"] .alert {
  border-radius: var(--nx-r-md) !important;
  border: 1px solid var(--nx-border) !important;
  background: var(--nx-card) !important;
  color: var(--nx-ink);
  -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px);
}
html[data-nx-theme="dark"] .alert-success { border-color: rgba(16,185,129,.4)!important; background: rgba(16,185,129,.12)!important; }
html[data-nx-theme="dark"] .alert-danger  { border-color: rgba(244,63,94,.4)!important;  background: rgba(244,63,94,.12)!important; }
html[data-nx-theme="dark"] .alert-warning { border-color: rgba(245,158,11,.4)!important; background: rgba(245,158,11,.12)!important; }

/* ═══ 8. NAV / DROPDOWN / MODAL / LIST ═══ */
html[data-nx-theme="dark"] .dropdown-menu,
html[data-nx-theme="dark"] .modal-content,
html[data-nx-theme="dark"] .offcanvas {
  background: rgba(32,29,56,.94) !important;
  border: 1px solid var(--nx-border) !important;
  border-radius: var(--nx-r-lg) !important;
  color: var(--nx-ink);
  box-shadow: var(--nx-shadow-xl);
  -webkit-backdrop-filter: blur(24px); backdrop-filter: blur(24px);
}
html[data-nx-theme="dark"] .dropdown-item { color: var(--nx-dim); border-radius: 10px; }
html[data-nx-theme="dark"] .dropdown-item:hover { background: rgba(139,124,246,.16) !important; color: #fff; }
html[data-nx-theme="dark"] .modal-header, html[data-nx-theme="dark"] .modal-footer { border-color: var(--nx-border) !important; }
html[data-nx-theme="dark"] .nav-tabs { border-color: var(--nx-border); }
html[data-nx-theme="dark"] .nav-tabs .nav-link { color: var(--nx-dim); border: none; }
html[data-nx-theme="dark"] .nav-tabs .nav-link.active {
  color: #fff; background: transparent;
  border-bottom: 2px solid var(--nx-acc);
}
html[data-nx-theme="dark"] .list-group-item {
  background: transparent !important;
  border-color: var(--nx-border) !important;
  color: var(--nx-ink);
}
html[data-nx-theme="dark"] .list-group-item:hover { background: rgba(139,124,246,.08) !important; }

/* ═══ 9. PAGINACIÓN / PROGRESO / BORDES ═══ */
html[data-nx-theme="dark"] .page-link { background: rgba(255,255,255,.03)!important; border-color: var(--nx-border)!important; color: var(--nx-dim)!important; border-radius: 10px!important; margin: 0 2px; }
html[data-nx-theme="dark"] .page-item.active .page-link { background: var(--nx-grad)!important; border: none!important; color:#fff!important; }
html[data-nx-theme="dark"] .progress { background: rgba(255,255,255,.06)!important; border-radius: 999px; }
html[data-nx-theme="dark"] .progress-bar { background: var(--nx-grad)!important; }
html[data-nx-theme="dark"] .border, html[data-nx-theme="dark"] .border-top,
html[data-nx-theme="dark"] .border-bottom, html[data-nx-theme="dark"] .border-start,
html[data-nx-theme="dark"] .border-end { border-color: var(--nx-border) !important; }
html[data-nx-theme="dark"] .bg-white, html[data-nx-theme="dark"] .bg-light {
  background: var(--nx-card) !important; color: var(--nx-ink);
}

/* ═══ 10. SCROLLBAR ═══ */
html[data-nx-theme="dark"] ::-webkit-scrollbar { width: 11px; height: 11px; }
html[data-nx-theme="dark"] ::-webkit-scrollbar-track { background: #17152a; }
html[data-nx-theme="dark"] ::-webkit-scrollbar-thumb {
  background: linear-gradient(#7c3aed, #6366f1);
  border-radius: 99px; border: 2px solid #17152a;
}
html[data-nx-theme="dark"] ::-webkit-scrollbar-thumb:hover { background: linear-gradient(#7c3aed, #22d3ee); }

/* ═══ 11. INTERRUPTOR FLOTANTE 🌙 (inyectado por JS, sin tocar el DOM existente) ═══ */
.nx-theme-toggle {
  position: fixed; left: 18px; bottom: 18px; z-index: 99999;
  display: inline-flex; align-items: center; gap: 8px;
  height: 46px; padding: 0 18px 0 15px; border-radius: 999px;
  cursor: pointer; font-size: .86rem; font-weight: 700; letter-spacing: .01em;
  border: 1px solid rgba(167,139,250,.55);
  background: linear-gradient(135deg, #6d28d9, #4f46e5);
  color: #fff; box-shadow: 0 8px 30px rgba(124,58,237,.5);
  transition: transform .25s ease, box-shadow .25s ease, filter .25s ease;
}
.nx-theme-toggle:hover { transform: translateY(-2px); filter: brightness(1.1); box-shadow: 0 12px 40px rgba(124,58,237,.7), 0 0 22px rgba(52,211,238,.45); }
.nx-theme-toggle:active { transform: translateY(0) scale(.97); }
.nx-theme-toggle svg { flex: none; }
.nx-theme-toggle .nx-tt-label { white-space: nowrap; }
@media (max-width: 640px){
  .nx-theme-toggle{ padding: 0; width: 46px; justify-content: center; }
  .nx-theme-toggle .nx-tt-label{ display: none; }
}

/* ═══ 12. DESIGN BIBLE — componentes premium (claro Y oscuro) ═══ */

/* Cuadro de icono para tarjetas (como en la biblia) */
.nx-icon-square{
  display:inline-grid; place-items:center; width:44px; height:44px; border-radius:14px;
  background:linear-gradient(135deg, rgba(139,92,246,.18), rgba(6,182,212,.12));
  border:1px solid rgba(139,92,246,.26); color:#7c3aed;
  transition:transform .25s ease, box-shadow .25s ease;
}
.nx-icon-square svg, .nx-icon-square i{ width:22px; height:22px; }
.nx-icon-square:hover{ transform:translateY(-2px); box-shadow:0 8px 22px rgba(139,92,246,.3); }
html[data-nx-theme="dark"] .nx-icon-square{ color:#a78bfa; box-shadow:0 6px 20px rgba(139,92,246,.22); }

/* Iconos Lucide con color e hover corporativo */
[data-lucide]{ vertical-align:-2px; }
.nx-ico-hover{ transition:color .2s ease, filter .2s ease; }
.nx-ico-hover:hover{ color:var(--nx-pri); filter:drop-shadow(0 0 6px rgba(139,92,246,.5)); }

/* Badges de estado tipo píldora (paleta oficial), ambos modos */
.badge{ border-radius:999px !important; font-weight:600 !important; padding:.42em .8em !important; letter-spacing:.01em; }
.badge.bg-success{ background:rgba(34,197,94,.15)!important; color:#16a34a!important; }
.badge.bg-warning{ background:rgba(245,158,11,.16)!important; color:#b45309!important; }
.badge.bg-danger,  .badge.bg-error{ background:rgba(239,68,68,.15)!important; color:#dc2626!important; }
.badge.bg-info{ background:rgba(59,130,246,.15)!important; color:#2563eb!important; }
html[data-nx-theme="dark"] .badge.bg-success{ color:#4ade80!important; border:1px solid rgba(34,197,94,.3); }
html[data-nx-theme="dark"] .badge.bg-warning{ color:#fbbf24!important; border:1px solid rgba(245,158,11,.3); }
html[data-nx-theme="dark"] .badge.bg-danger,
html[data-nx-theme="dark"] .badge.bg-error{ color:#f87171!important; border:1px solid rgba(239,68,68,.3); }
html[data-nx-theme="dark"] .badge.bg-info{ color:#60a5fa!important; border:1px solid rgba(59,130,246,.3); }

/* Botones rounded-XL de la biblia (no pill completo) */
html[data-nx-theme="dark"] .btn-primary, html[data-nx-theme="dark"] .btn-nx,
html[data-nx-theme="dark"] .btn-secondary, html[data-nx-theme="dark"] .btn-outline-primary,
html[data-nx-theme="dark"] .btn-outline-secondary, html[data-nx-theme="dark"] .btn-light,
html[data-nx-theme="dark"] .btn-success, html[data-nx-theme="dark"] .btn-danger,
html[data-nx-theme="dark"] .btn-warning, html[data-nx-theme="dark"] .btn-nx-outline{
  border-radius:14px !important;
}

/* Sidebar: item activo con realce morado→azul (solo oscuro, no rompe el claro) */
html[data-nx-theme="dark"] .nav-link.active,
html[data-nx-theme="dark"] .menu-item.active,
html[data-nx-theme="dark"] .sidebar .active,
html[data-nx-theme="dark"] a.active{
  background:linear-gradient(135deg, rgba(139,92,246,.24), rgba(59,130,246,.14)) !important;
  color:#fff !important; border-radius:12px !important;
}

/* Mini-gráfico de tarjeta con glow (contenedor opcional .nx-spark) */
.nx-spark{ height:44px; border-radius:10px; overflow:hidden; }
.nx-spark svg polyline, .nx-spark svg path{ filter:drop-shadow(0 0 5px rgba(139,92,246,.5)); }