/* ============================================================
   EREUNA — Design Tokens
   Dark Academia: profundo, refinado, cálido
   ============================================================ */

:root {
  /* --- Tipografía --- */
  --font-display: 'Cormorant Garamond', Georgia, serif;
  --font-body: 'DM Sans', system-ui, sans-serif;
  --font-mono: 'DM Mono', monospace;

  --text-xs:   0.75rem;
  --text-sm:   0.875rem;
  --text-base: 1rem;
  --text-lg:   1.125rem;
  --text-xl:   1.25rem;
  --text-2xl:  1.5rem;
  --text-3xl:  2rem;
  --text-4xl:  2.75rem;
  --text-5xl:  3.75rem;

  /* --- Espaciado --- */
  --space-1:  0.25rem;
  --space-2:  0.5rem;
  --space-3:  0.75rem;
  --space-4:  1rem;
  --space-5:  1.25rem;
  --space-6:  1.5rem;
  --space-8:  2rem;
  --space-10: 2.5rem;
  --space-12: 3rem;
  --space-16: 4rem;
  --space-20: 5rem;

  /* --- Bordes y radio --- */
  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-lg: 14px;
  --radius-xl: 20px;
  --radius-full: 9999px;

  /* --- Transiciones --- */
  --transition-fast:   150ms ease;
  --transition-base:   250ms ease;
  --transition-slow:   400ms ease;
  --transition-theme:  500ms cubic-bezier(0.4, 0, 0.2, 1);
}

/* ============================================================
   MODO OSCURO (default)
   ============================================================ */
[data-theme="dark"] {
  /* Fondos */
  --bg-base:      #0f1117;
  --bg-surface:   #161b27;
  --bg-elevated:  #1e2535;
  --bg-hover:     #252d40;
  --bg-overlay:   rgba(0, 0, 0, 0.6);

  /* Texto */
  --text-primary:   #e8e0d0;
  --text-secondary: #9a9080;
  --text-muted:     #5a5548;
  --text-inverse:   #0f1117;

  /* Acento — ámbar/dorado */
  --accent:         #c9943a;
  --accent-light:   #e8b356;
  --accent-dark:    #9e7228;
  --accent-subtle:  rgba(201, 148, 58, 0.12);

  /* Bordes */
  --border:         rgba(232, 224, 208, 0.08);
  --border-accent:  rgba(201, 148, 58, 0.3);

  /* Estados */
  --error:          #e05252;
  --error-subtle:   rgba(224, 82, 82, 0.12);
  --success:        #5cb88a;
  --success-subtle: rgba(92, 184, 138, 0.12);
  --warning:        #e0a552;

  /* Sombras */
  --shadow-sm:  0 1px 3px rgba(0,0,0,0.4);
  --shadow-md:  0 4px 16px rgba(0,0,0,0.5);
  --shadow-lg:  0 12px 40px rgba(0,0,0,0.6);
  --shadow-accent: 0 0 20px rgba(201, 148, 58, 0.2);

  /* Noise texture */
  --noise-opacity: 0.035;
}

/* ============================================================
   MODO CLARO
   ============================================================ */
[data-theme="light"] {
  --bg-base:      #f5f0e8;
  --bg-surface:   #faf7f2;
  --bg-elevated:  #ffffff;
  --bg-hover:     #ede8df;
  --bg-overlay:   rgba(0, 0, 0, 0.3);

  --text-primary:   #1a1510;
  --text-secondary: #5a5040;
  --text-muted:     #a09080;
  --text-inverse:   #faf7f2;

  --accent:         #a07020;
  --accent-light:   #c9943a;
  --accent-dark:    #7a5418;
  --accent-subtle:  rgba(160, 112, 32, 0.1);

  --border:         rgba(26, 21, 16, 0.1);
  --border-accent:  rgba(160, 112, 32, 0.3);

  --error:          #c0392b;
  --error-subtle:   rgba(192, 57, 43, 0.1);
  --success:        #27ae60;
  --success-subtle: rgba(39, 174, 96, 0.1);
  --warning:        #d68910;

  --shadow-sm:  0 1px 3px rgba(0,0,0,0.08);
  --shadow-md:  0 4px 16px rgba(0,0,0,0.1);
  --shadow-lg:  0 12px 40px rgba(0,0,0,0.15);
  --shadow-accent: 0 0 20px rgba(160, 112, 32, 0.15);

  --noise-opacity: 0.02;
}