/* ============================================================
   New Catanium — Design Tokens
   6 temas via [data-nc-theme="..."]: light · dark · navy · catan · verde · amatista (default)
   Solo se aplica a elementos con clases nc-*. No interfiere con style.css legado.
   ============================================================ */

:root {
  /* Tipografía base (subset de Netline tokens necesarios) */
  --nl-font-sans: 'Open Sans', system-ui, -apple-system, sans-serif;
  --nl-font-poppins: 'Poppins', var(--nl-font-sans);
  --nl-leading-normal: 1.5;
  --nl-text-body: #4c4c5c;
  --nl-ease: 0.15s ease;
  --nl-ease-md: 0.2s ease;
  --nl-ease-slow: 0.3s ease;
  --nl-blue-border: #2563eb;
  --nl-success: #0acf97;
  --nl-success-bg: #daf8ef;
  --nl-success-dark: #146c43;

  /* Acento Catanium (cálido tipo board game) */
  --nc-accent: #f8ac59;
  --nc-accent-dark: #e29440;
  --nc-accent-bg: #fef3e6;

  /* === Tema base: light === */
  --nc-page: #f1f2f7;
  --nc-card: #ffffff;
  --nc-card-2: #f6f7fb;
  --nc-text: #4c4c5c;
  --nc-text-strong: #1a1f36;
  --nc-text-muted: #9ba6b7;
  --nc-border: #e7e9eb;
  --nc-band: #23238b;
  --nc-band-2: #1a1a6e;
  --nc-band-text: #ffffff;
  --nc-brand: #23238b;
  --nc-brand-dark: #1a1a6e;
  --nc-brand-ice: #e0eaff;
  --nc-brand-ice-bdr: #93c5fd;
  --nc-brand-ink: #1d4ed8;
  --nc-hero-grad: linear-gradient(135deg, var(--nc-band) 0%, var(--nc-band-2) 100%);
  --nc-shadow: 0 10px 30px rgba(15, 23, 42, 0.08);
  --nc-shadow-lg: 0 20px 50px rgba(15, 23, 42, 0.12);
}

[data-nc-theme="light"] {
  /* Igual al :root base; declarado explícitamente para que el selector reconozca el valor. */
  --nc-page: #f1f2f7;
  --nc-card: #ffffff;
  --nc-card-2: #f6f7fb;
  --nc-text: #4c4c5c;
  --nc-text-strong: #1a1f36;
  --nc-text-muted: #9ba6b7;
  --nc-border: #e7e9eb;
  --nc-band: #23238b;
  --nc-band-2: #1a1a6e;
  --nc-brand: #23238b;
  --nc-brand-dark: #1a1a6e;
  --nc-brand-ice: #e0eaff;
  --nc-brand-ice-bdr: #93c5fd;
  --nc-brand-ink: #1d4ed8;
  --nc-hero-grad: linear-gradient(135deg, var(--nc-band) 0%, var(--nc-band-2) 100%);
  --nc-shadow: 0 10px 30px rgba(15, 23, 42, 0.08);
  --nc-shadow-lg: 0 20px 50px rgba(15, 23, 42, 0.12);
}

[data-nc-theme="dark"] {
  --nc-page: #0f1320;
  --nc-card: #171c2e;
  --nc-card-2: #11162a;
  --nc-text: #cbd1de;
  --nc-text-strong: #f3f5fa;
  --nc-text-muted: #7a8499;
  --nc-border: rgba(255, 255, 255, 0.08);
  --nc-band: #0a0e1c;
  --nc-band-2: #050813;
  --nc-band-text: #ffffff;
  --nc-shadow: 0 10px 30px rgba(0, 0, 0, 0.4);
  --nc-shadow-lg: 0 20px 50px rgba(0, 0, 0, 0.55);
}

[data-nc-theme="navy"] {
  --nc-page: #1a1a4f;
  --nc-card: #23238b;
  --nc-card-2: #1d1d72;
  --nc-text: #d6d8f5;
  --nc-text-strong: #ffffff;
  --nc-text-muted: #8d8fc8;
  --nc-border: rgba(255, 255, 255, 0.12);
  --nc-band: #0f0f3d;
  --nc-band-2: #050527;
  --nc-band-text: #ffffff;
  --nc-shadow: 0 10px 30px rgba(0, 0, 0, 0.35);
  --nc-shadow-lg: 0 20px 50px rgba(0, 0, 0, 0.5);
}

[data-nc-theme="catan"] {
  --nc-page: #fdf6ec;
  --nc-card: #ffffff;
  --nc-card-2: #fbf0e0;
  --nc-text: #5b4636;
  --nc-text-strong: #3d2415;
  --nc-text-muted: #a98a6f;
  --nc-border: #efe1cf;
  --nc-band: #a8281a;
  --nc-band-2: #6e160f;
  --nc-band-text: #ffffff;
  --nc-brand: #b23a1e;
  --nc-brand-dark: #8c2a13;
  --nc-brand-ice: #fbe3d2;
  --nc-brand-ice-bdr: #f0c089;
  --nc-brand-ink: #b23a1e;
  --nc-hero-grad: radial-gradient(120% 130% at 50% 118%, #ffd56b 0%, #f4a23c 22%, #d9531f 46%, #a8281a 70%, #6e140d 100%);
  --nc-shadow: 0 10px 30px rgba(110, 22, 15, 0.12);
  --nc-shadow-lg: 0 20px 50px rgba(110, 22, 15, 0.18);
}

[data-nc-theme="verde"] {
  --nc-page: #ebefe3;
  --nc-card: #ffffff;
  --nc-card-2: #f1f5e9;
  --nc-text: #4a4d42;
  --nc-text-strong: #2b3124;
  --nc-text-muted: #8a917d;
  --nc-border: #e0e6d3;
  --nc-band: #4b6b34;
  --nc-band-2: #35501f;
  --nc-band-text: #ffffff;
  --nc-brand: #5d8a3f;
  --nc-brand-dark: #4a6f31;
  --nc-brand-ice: #e6efd6;
  --nc-brand-ice-bdr: #b6d091;
  --nc-brand-ink: #3f6322;
  --nc-accent: #e8c34a;
  --nc-accent-dark: #b78d1f;
  --nc-accent-bg: #f7eecb;
  --nc-hero-grad: linear-gradient(135deg, #4b6b34 0%, #2f4420 100%);
  --nc-shadow: 0 10px 30px rgba(40, 60, 25, 0.12);
  --nc-shadow-lg: 0 20px 50px rgba(40, 60, 25, 0.18);
}

[data-nc-theme="amatista"] {
  --nc-page: #f4f1fb;
  --nc-card: #ffffff;
  --nc-card-2: #f2ecfc;
  --nc-text: #4a4360;
  --nc-text-strong: #2a1f45;
  --nc-text-muted: #968cae;
  --nc-border: #e9e2f5;
  --nc-band: #4c2a86;
  --nc-band-2: #341a63;
  --nc-band-text: #ffffff;
  --nc-brand: #7c3aed;
  --nc-brand-dark: #6d28d9;
  --nc-brand-ice: #ede5fc;
  --nc-brand-ice-bdr: #c9b6f5;
  --nc-brand-ink: #6d28d9;
  --nc-accent: #e8b53f;
  --nc-accent-dark: #a9791a;
  --nc-accent-bg: #f7eecb;
  --nc-hero-grad: linear-gradient(135deg, #5b2da0 0%, #36205f 60%, #25153f 100%);
  --nc-shadow: 0 10px 30px rgba(60, 30, 110, 0.10);
  --nc-shadow-lg: 0 20px 50px rgba(60, 30, 110, 0.16);
}