/* ============================================
   SOLANDA UI — Tema por defecto

   El nombre viene del Barrio Solanda (Quito,
   Ecuador): un proyecto urbanístico planificado
   en 1984 que creció desbordando sus propios
   límites, ganando identidad con el tiempo —
   como todo buen sistema de diseño adoptado
   de verdad.

   La paleta se extrae de la materialidad del
   barrio, no de su concepto:
   · Ladrillo terracota — color definitorio
   · Concreto andino — grises estructurales
   · Muros encalados — fondos cálidos y claros
   · Amanecer quiteño — dorados de acento
   · Vegetación de montaña — verde de estado
   · Noche de humo y neón — modo oscuro
   ============================================ */

/* ── Light ─────────────────────────────────── */
/* Día solandeño: muros cremosos, ladrillo visto,
   sol andino. Estructurado pero vivo.            */
:root {
  --sl-theme-name: 'solanda';
  --sl-theme-mode: 'light';

  /* Blanco cremoso cálido — muros encalados        L=95% */
  --sl-hsl-background: 35 30% 95%;
  /* Concreto oscuro — ratio ~15:1 sobre background */
  --sl-hsl-foreground: 220 15% 12%;
  /* Crema más densa — superficie elevada           L=90% */
  --sl-hsl-card: 35 22% 90%;
  --sl-hsl-popover: 35 30% 95%;

  /* Ladrillo terracota — color definitorio del Quito popular */
  --sl-hsl-primary: 14 52% 43%;
  --sl-hsl-primary-foreground: 0 0% 100%;

  /* Arena / cemento — paso claro entre card y borde L=84% */
  --sl-hsl-secondary: 35 16% 84%;
  --sl-hsl-secondary-foreground: 35 20% 22%;

  /* Concreto gris frío — fondos apagados           L=88% */
  --sl-hsl-muted: 220 8% 88%;
  /* ratio ~5:1 sobre background, ~4.4:1 sobre muted */
  --sl-hsl-muted-foreground: 220 7% 40%;

  /* Lavanda mural urbano — accent vibrante, complemento del terracota */
  --sl-hsl-accent: 255 38% 55%;
  --sl-hsl-accent-foreground: 0 0% 100%;

  /* Rojo ladrillo — destructivo */
  --sl-hsl-destructive: 4 66% 46%;
  --sl-hsl-destructive-foreground: 0 0% 100%;

  /* Bordes — claramente visibles sobre todas las superficies L=80% */
  --sl-hsl-border: 35 18% 80%;
  /* Fondo de input — crema casi blanca, claramente editable */
  --sl-hsl-input: 35 30% 97%;
  --sl-hsl-ring: 14 52% 43%;

  /* Verde vegetación andina de montaña */
  --sl-hsl-success: 128 38% 36%;
  /* Naranja del atardecer quiteño */
  --sl-hsl-warning: 28 80% 52%;
  /* Azul cielo andino despejado */
  --sl-hsl-info: 207 42% 52%;
  /* Teja/cerámica — naranja terracota caliente */
  --sl-hsl-accent-coral: 18 60% 56%;
  /* Mural urbano — lavanda suave */
  --sl-hsl-accent-lavender: 255 38% 63%;

  --sl-bg-body: hsl(var(--sl-hsl-background));
  --sl-bg-surface: hsl(var(--sl-hsl-card));
  --sl-text-primary: hsl(var(--sl-hsl-foreground));
  --sl-text-secondary: hsl(var(--sl-hsl-muted-foreground));
  --sl-text-muted: hsl(var(--sl-hsl-muted));
  --sl-border-base: hsl(var(--sl-hsl-border));
  --sl-bg-input: hsl(var(--sl-hsl-input));
}

/* ── Dark ──────────────────────────────────── */
/* Noche solandeña: cielo azulado cubierto de
   humo de fritanga, luces de sodio y neon.
   El ladrillo brilla bajo la luz artificial.   */
.dark,
.theme-solanda.dark {
  --sl-theme-mode: 'dark';

  /* Azul ahumado nocturno — no negro puro           L=10% */
  --sl-hsl-background: 215 18% 10%;
  /* Blanco ámbar — luz de sodio callejera   ratio ~13:1 */
  --sl-hsl-foreground: 40 14% 90%;
  /* Superficie elevada                              L=15% */
  --sl-hsl-card: 215 16% 15%;
  --sl-hsl-popover: 215 18% 10%;

  /* Ladrillo bajo luz nocturna — cálido pero apagado */
  --sl-hsl-primary: 16 42% 54%;
  --sl-hsl-primary-foreground: 0 0% 100%;

  /* Paso intermedio entre muted y border            L=25% */
  --sl-hsl-secondary: 215 14% 25%;
  --sl-hsl-secondary-foreground: 215 10% 76%;

  /* Fondo apagado — paso nítido sobre card          L=20% */
  --sl-hsl-muted: 215 12% 20%;
  /* ratio ~5:1 sobre background */
  --sl-hsl-muted-foreground: 215 8% 55%;

  /* Lavanda mural urbano — complemento del terracota nocturno */
  --sl-hsl-accent: 255 42% 65%;
  --sl-hsl-accent-foreground: 215 18% 10%;

  --sl-hsl-destructive: 4 55% 38%;
  --sl-hsl-destructive-foreground: 0 0% 96%;

  /* Bordes claramente sobre secondary               L=30% */
  --sl-hsl-border: 215 12% 30%;
  /* Fondo de input — hundido bajo la card, claramente editable */
  --sl-hsl-input: 215 18% 11%;
  --sl-hsl-ring: 16 42% 54%;

  --sl-hsl-success: 128 35% 46%;
  --sl-hsl-warning: 28 78% 55%;
  --sl-hsl-info: 207 48% 58%;
  --sl-hsl-accent-coral: 18 55% 65%;
  --sl-hsl-accent-lavender: 255 42% 70%;
}

@media (prefers-color-scheme: dark) {
  :root:not(.theme-social-neutral):not(.theme-catppuccin):not(.theme-gruvbox):not(.theme-tokyo-night) {
    --sl-theme-auto: 'dark';
  }
}

@media (prefers-color-scheme: light) {
  :root:not(.theme-social-neutral):not(.theme-catppuccin):not(.theme-gruvbox):not(.theme-tokyo-night) {
    --sl-theme-auto: 'light';
  }
}
