/*
  Tokens de diseño de Yaruki.
  Fuente: plan-landing-yaruki.md, sección 1 (tomados literal de
  asistente-android ui/theme/Color.kt). No cambiar un valor acá sin
  cambiarlo también en la app o documentar por qué divergen.

  Modo claro por defecto; modo oscuro por prefers-color-scheme.
  BRAND_NAME ("Yaruki") vive sólo en el HTML de cada página, no acá.
*/

:root {
  /* Color — modo claro */
  --color-bg: #faf7f2;
  --color-bg-elevated: #ffffff;
  --color-text: #221f1b;
  --color-text-secondary: #6b6459;
  --color-accent: #6c5ce0;
  --color-accent-soft: #ece9fb;
  --color-success: #3fa66b;
  --color-warning: #e8a33d;
  --color-danger: #e15252;
  --color-border: #ece6dd;
  --color-border-card: #ddd4c7;
  --color-success-bg: #dcf2e4;
  --color-warning-bg: #fbead1;
  --color-danger-bg: #fbdede;

  /* Texto sobre el acento (botones primarios): siempre claro en los dos temas */
  --color-on-accent: #ffffff;

  /* Tipografía */
  --font-display: "Baloo 2", "Baloo 2 Fallback", ui-rounded, system-ui, sans-serif;
  --font-body: "Manrope", "Manrope Fallback", system-ui, -apple-system, sans-serif;

  /* Escala tipográfica (base 17px, proporción ~1.2) */
  --text-sm: 0.875rem;
  --text-base: 1.0625rem;
  --text-md: 1.25rem;
  --text-lg: 1.6rem;
  --text-xl: 2.1rem;
  --text-2xl: 2.8rem;

  /* Espaciado */
  --space-1: 0.5rem;
  --space-2: 0.875rem;
  --space-3: 1.5rem;
  --space-4: 2.25rem;
  --space-5: 3.5rem;
  --space-6: 5.5rem;

  /* Forma */
  --radius-sm: 10px;
  --radius-md: 18px;
  --radius-lg: 28px;
  --radius-pill: 999px;

  /* Medida de línea para texto largo (legales) */
  --measure: 38rem;

  /* Transición suave de tema (ver plan, 4.0) */
  --theme-transition: 200ms ease;
}

@media (prefers-color-scheme: dark) {
  :root {
    --color-bg: #151322;
    --color-bg-elevated: #1e1b30;
    --color-text: #f1effb;
    --color-text-secondary: #a59fc2;
    --color-accent: #8b7cf0;
    --color-accent-soft: #332c57;
    --color-success: #4fbe82;
    --color-warning: #f0b65b;
    --color-danger: #f17272;
    --color-border: #332e4a;
    --color-border-card: #332e4a;
    --color-success-bg: #1f3b2c;
    --color-warning-bg: #3d3120;
    --color-danger-bg: #3d2323;
  }
}