/* ==========================================================================
   Entaina Design Tokens — generated by Style Dictionary
   ========================================================================== */

/* --- Palette tokens (fixed, not theme-dependent) --- */
:root {
  --blue-50: #f3f4fb;
  --blue-100: #e0e5ff;
  --blue-200: #c6cfff;
  --blue-300: #a4b0ff;
  --blue-400: #828dfd;
  --blue-500: #6d75eb;
  --blue-600: #585eca;
  --blue-700: #494fa4;
  --blue-800: #3a3f76;
  --blue-900: #2f324a;
  --blue-950: #232328;
  --chicago-50: #f5f5f5;
  --chicago-100: #e8e8e8;
  --chicago-200: #d4d4d4;
  --chicago-300: #bababa;
  --chicago-400: #9e9e9e;
  --chicago-500: #898989;
  --chicago-600: #717171;
  --chicago-700: #5d5d5d;
  --chicago-800: #484848;
  --chicago-900: #353535;
  --chicago-950: #242424;
  --copperfield-50: #fff2ed;
  --copperfield-100: #ffe1d4;
  --copperfield-200: #fec6ad;
  --copperfield-300: #faa27a;
  --copperfield-400: #de855c;
  --copperfield-500: #c37049;
  --copperfield-600: #a35c3b;
  --copperfield-700: #834e35;
  --copperfield-800: #603e2f;
  --copperfield-900: #40322b;
  --copperfield-950: #282321;
  --golden-tainoi-50: #fff4dd;
  --golden-tainoi-100: #ffe5ae;
  --golden-tainoi-200: #fdce60;
  --golden-tainoi-300: #e1b447;
  --golden-tainoi-400: #c19832;
  --golden-tainoi-500: #a7842e;
  --golden-tainoi-600: #896d2b;
  --golden-tainoi-700: #6f5b2e;
  --golden-tainoi-800: #52462c;
  --golden-tainoi-900: #3a352a;
  --golden-tainoi-950: #262420;
  --green-50: #f1f7f2;
  --green-100: #d2f2d9;
  --green-200: #a1eab4;
  --green-300: #66d88a;
  --green-400: #0bc062;
  --green-500: #00a94e;
  --green-600: #008d3d;
  --green-700: #00762e;
  --green-800: #06582a;
  --green-900: #223d29;
  --green-950: #212522;
  --hoki-50: #f1f6fa;
  --hoki-100: #e0e9f1;
  --hoki-200: #c4d7e7;
  --hoki-300: #a3bfd5;
  --hoki-400: #82a3bd;
  --hoki-500: #6486a1;
  --hoki-600: #56768e;
  --hoki-700: #486175;
  --hoki-800: #3a4a57;
  --hoki-900: #2f363c;
  --hoki-950: #212528;
  --on-dark: #f5f5f5;
  --on-light: #595959;
  --orange-50: #fff7ed;
  --orange-100: #ffedd4;
  --orange-200: #ffd6a7;
  --orange-300: #ffb86a;
  --orange-400: #ff8904;
  --orange-500: #ff6900;
  --orange-600: #f54900;
  --orange-700: #ca3500;
  --orange-800: #9f2d00;
  --orange-900: #7e2a0c;
  --orange-950: #441306;
  --red-50: #fef2f2;
  --red-100: #ffe2e2;
  --red-200: #ffc9c9;
  --red-300: #ffa2a2;
  --red-400: #ff6467;
  --red-500: #fb2c36;
  --red-600: #e7000b;
  --red-700: #c10007;
  --red-800: #9f0712;
  --red-900: #82181a;
  --red-950: #460809;

  /* Typography */
  --font-family-comfortaa: Comfortaa, sans-serif;
  --font-family-space-grotesk: "Space Grotesk", sans-serif;
  --font-family-inter: Inter, sans-serif;
  --font-family-lato: Lato, sans-serif;
  --font-family-dm-sans: "DM Sans", sans-serif;
  --font-family-dm-serif: "DM Serif Display", serif;
  --font-family-jetbrains: "JetBrains Mono", monospace;

  /* Layout & transition tokens (shared across all themes) */
  --radius: 14px;
  --radius-sm: 7px;
  --transition: 0.4s cubic-bezier(0.4, 0, 0.2, 1);
  --sage: #6BE675;
}

/* --- Semantic colors: Theme Neutral (default) --- */
:root,
[data-theme="neutral"] {
  --background: #f5f5f5;
  --surface: #f5f5f5;
  --surface-alt: #e8e8e8;
  --border: #d4d4d4;
  --text: #353535;
  --text-subtle: #898989;
  --text-dim: #898989;
  --on-dark: #f5f5f5;
  --on-light: #595959;
  --primary: #5d5d5d;
  --primary-light: #e8e8e8;
  --primary-dark: #484848;
  --on-primary: #f5f5f5;
  --accent: #6486a1;
  --accent-light: #e0e9f1;
  --accent-dark: #486175;
  --on-accent: #f5f5f5;
  --danger: #fb2c36;
  --danger-light: #fef2f2;
  --danger-dark: #c10007;
  --success: #008d3d;
  --success-light: #d2f2d9;
  --success-dark: #06582a;
  --warning: #ff8904;
  --warning-light: #fff7ed;
  --warning-dark: #ca3500;
  --info: #585eca;
  --info-light: #e0e5ff;
  --info-dark: #3a3f76;
  --font-display: Inter, sans-serif;
  --font-body: Inter, sans-serif;
}

/* --- Theme: Technology --- */
[data-theme="technology"] {
  --background: #f1f6fa;
  --surface: #f5f5f5;
  --surface-alt: #e8e8e8;
  --border: #d4d4d4;
  --text: #353535;
  --text-subtle: #898989;
  --on-dark: #f5f5f5;
  --on-light: #595959;
  --primary: #6486a1;
  --primary-light: #e0e9f1;
  --primary-dark: #486175;
  --on-primary: #f5f5f5;
  --accent: #fdce60;
  --accent-light: #fff4dd;
  --accent-dark: #896d2b;
  --on-accent: #595959;
  --danger: #fb2c36;
  --danger-light: #fef2f2;
  --danger-dark: #c10007;
  --success: #008d3d;
  --success-light: #d2f2d9;
  --success-dark: #06582a;
  --warning: #ff8904;
  --warning-light: #fff7ed;
  --warning-dark: #ca3500;
  --info: #585eca;
  --info-light: #e0e5ff;
  --info-dark: #3a3f76;
  --font-display: "Space Grotesk", sans-serif;
  --font-body: Inter, sans-serif;
}

/* --- Theme: Innovation --- */
[data-theme="innovation"] {
  --background: #fff2ed;
  --surface: #f5f5f5;
  --surface-alt: #e8e8e8;
  --border: #d4d4d4;
  --text: #353535;
  --text-subtle: #898989;
  --on-dark: #f5f5f5;
  --on-light: #595959;
  --primary: #de855c;
  --primary-light: #ffe1d4;
  --primary-dark: #a35c3b;
  --on-primary: #242424;
  --accent: #6486a1;
  --accent-light: #e0e9f1;
  --accent-dark: #486175;
  --on-accent: #f5f5f5;
  --danger: #fb2c36;
  --danger-light: #fef2f2;
  --danger-dark: #c10007;
  --success: #008d3d;
  --success-light: #d2f2d9;
  --success-dark: #06582a;
  --warning: #ff8904;
  --warning-light: #fff7ed;
  --warning-dark: #ca3500;
  --info: #585eca;
  --info-light: #e0e5ff;
  --info-dark: #3a3f76;
  --font-display: "Space Grotesk", sans-serif;
  --font-body: "Space Grotesk", sans-serif;
}

/* --- Theme: People --- */
[data-theme="people"] {
  --background: #fff4dd;
  --surface: #f5f5f5;
  --surface-alt: #e8e8e8;
  --border: #d4d4d4;
  /*
    Mejora de contraste: texto principal más oscuro para fondo claro (#242424 en vez de #353535).
    Justificación: Cumplir WCAG 2.2 AA en tamaños pequeños y condiciones de luz adversas.
  */
  --text: #242424;
  /*
    Mejora de contraste: texto secundario más oscuro (#595959 en vez de #898989).
    Justificación: El gris original no cumple contraste mínimo sobre fondo #fff4dd.
  */
  --text-subtle: #595959;
  --on-dark: #f5f5f5;
  --on-light: #242424; /* Más oscuro para botones y badges sobre primary */
  /*
    Mejora de contraste: on-primary más oscuro (#242424 en vez de #595959).
    Justificación: El ratio con #fdce60 sube a ~7:1, cumpliendo AA y AAA para cualquier tamaño.
  */
  --primary: #fdce60;
  --primary-light: #fff4dd;
  --primary-dark: #c19832;
  --on-primary: #242424;
  --accent: #6486a1;
  --accent-light: #e0e9f1;
  --accent-dark: #486175;
  --on-accent: #f5f5f5;
  --danger: #fb2c36;
  --danger-light: #fef2f2;
  --danger-dark: #c10007;
  --success: #008d3d;
  --success-light: #d2f2d9;
  --success-dark: #06582a;
  --warning: #ff8904;
  --warning-light: #fff7ed;
  --warning-dark: #ca3500;
  --info: #585eca;
  --info-light: #e0e5ff;
  --info-dark: #3a3f76;
  /*
    Mejora de legibilidad: Comfortaa solo para títulos, Inter para cuerpo.
    Justificación: Comfortaa tiene baja legibilidad en cuerpo pequeño.
  */
  --font-display: Comfortaa, sans-serif;
  --font-body: Inter, sans-serif;
}

/* --- Theme: Empathy --- */
[data-theme="empathy"] {
  --background: #fff4dd;
  --surface: #f5f5f5;
  --surface-alt: #e8e8e8;
  --border: #d4d4d4;
  --text: #353535;
  --text-subtle: #898989;
  --on-dark: #f5f5f5;
  --on-light: #595959;
  --primary: #fdce60;
  --primary-light: #fff4dd;
  --primary-dark: #c19832;
  --on-primary: #595959;
  --accent: #de855c;
  --accent-light: #ffe1d4;
  --accent-dark: #a35c3b;
  --on-accent: #242424;
  --danger: #fb2c36;
  --danger-light: #fef2f2;
  --danger-dark: #c10007;
  --success: #008d3d;
  --success-light: #d2f2d9;
  --success-dark: #06582a;
  --warning: #ff8904;
  --warning-light: #fff7ed;
  --warning-dark: #ca3500;
  --info: #585eca;
  --info-light: #e0e5ff;
  --info-dark: #3a3f76;
  --font-display: Comfortaa, sans-serif;
  --font-body: Lato, sans-serif;
}

/* --- Theme: Craft --- */
[data-theme="craft"] {
  --background: #f1f6fa;
  --surface: #f5f5f5;
  --surface-alt: #e8e8e8;
  --border: #d4d4d4;
  --text: #353535;
  --text-subtle: #898989;
  --on-dark: #f5f5f5;
  --on-light: #595959;
  --primary: #6486a1;
  --primary-light: #e0e9f1;
  --primary-dark: #486175;
  --on-primary: #f5f5f5;
  --accent: #de855c;
  --accent-light: #ffe1d4;
  --accent-dark: #a35c3b;
  --on-accent: #242424;
  --danger: #fb2c36;
  --danger-light: #fef2f2;
  --danger-dark: #c10007;
  --success: #008d3d;
  --success-light: #d2f2d9;
  --success-dark: #06582a;
  --warning: #ff8904;
  --warning-light: #fff7ed;
  --warning-dark: #ca3500;
  --info: #585eca;
  --info-light: #e0e5ff;
  --info-dark: #3a3f76;
  --font-display: Lato, sans-serif;
  --font-body: Comfortaa, sans-serif;
}

/* --- Theme: Original ---
   Dark mode, vivid gradients, grainy texture, editorial warmth.
   Recreates the look of the v0 standalone design.
   --------------------------------------------------------------- */
[data-theme="original"] {
  /* Dark backgrounds */
  --background: #071321;
  --surface: #0B2233;
  --surface-alt: #10344A;
  --border: rgba(255, 159, 26, 0.25);
  /* Warm light text */
  --text: #FFF8E8;
  --text-subtle: #CABF9D;
  --text-dim: #CABF9D;
  --on-dark: #FFF8E8;
  --on-light: #071321;
  /* Primary: Indigo */
  --primary: #472BFB;
  --primary-light: #2a1f6b;
  --primary-dark: #3520C5;
  --on-primary: #F8F7FF;
  /* Accent: Amber */
  --accent: #FF9F1A;
  --accent-light: #3A2E1A;
  --accent-dark: #CC6C07;
  --on-accent: #FFF8E8;
  /* Functional (shared) */
  --danger: #fb2c36;
  --danger-light: #460809;
  --danger-dark: #ff6467;
  --success: #6BE675;
  --success-light: #0f2a14;
  --success-dark: #4ade80;
  --warning: #ff8904;
  --warning-light: #3a2500;
  --warning-dark: #ffb86a;
  --info: #828dfd;
  --info-light: #1a1d3d;
  --info-dark: #a4b0ff;
  /* Typography */
  --font-display: "DM Sans", sans-serif;
  --font-body: "DM Sans", sans-serif;
  /* Extra tokens for the original aesthetic */
  --amber: #FF9F1A;
  --amber-dim: #CC6C07;
  --terracotta: #FF6F00;
  --gold: #FFD23F;
  --indigo: #472BFB;
  --cream: #FFF5D8;
  --warm-red: #D14A12;
  --sand: #EBC46A;
  --text-soft: #D8E2F2;
  --text-muted: #736A51;
  --border-dim: rgba(255, 245, 216, 0.1);
  --glow-amber: 0 0 46px rgba(255, 159, 26, 0.3);
  --glow-gold: 0 0 46px rgba(255, 210, 63, 0.24);
}