/* Spark Colour Token System
 * Unified colour palette for Care Companion UI
 * Matches Spark's soft, airy, and low-contrast design language
 * 
 * NOTE: This file now maps Spark-specific tokens to the unified theme tokens
 * defined in theme-tokens.css. All base colors come from the unified system.
 */

:root {
  /* Surfaces - mapped to unified tokens */
  --surface-background: var(--surface);
  --surface-background-subtle: var(--surface-subtle);
  --surface-border: var(--border-light);
  
  /* Brand accent - using unified accent with Spark-specific variations */
  --brand-accent: var(--accent);
  --brand-accent-soft: var(--accent-soft);
  --brand-accent-border: var(--accent-border);

  /* Chat bubbles - light mode specific */
  --bubble-user: rgba(74, 116, 249, 0.12);
  --bubble-coach: rgba(0,0,0,0.03);

  /* Chip backgrounds - light mode specific */
  --chip-background: rgba(0,0,0,0.03);
  --chip-border: rgba(0,0,0,0.05);

  /* Risk levels (pastel tones) - light mode */
  --risk-low-bg: #E8F7E5;
  --risk-low-border: #C4E5BF;
  --risk-low-text: #2e7a4f;

  --risk-medium-bg: #FFF6D9;
  --risk-medium-border: #F2E2A4;
  --risk-medium-text: #9d6b28;

  --risk-high-bg: #FDEAEA;
  --risk-high-border: #F4BFBF;
  --risk-high-text: #b83a3a;
}

body[data-theme="dark"],
[data-theme="dark"] {
  /* Surfaces - inherit from unified tokens */
  --surface-background: var(--surface);
  --surface-background-subtle: var(--surface-subtle);
  --surface-border: var(--border-hover);

  /* Chat bubbles - dark mode specific */
  --bubble-user: rgba(106, 163, 255, 0.25);
  --bubble-coach: rgba(255,255,255,0.08);

  /* Chip backgrounds - dark mode specific */
  --chip-background: rgba(255,255,255,0.10);
  --chip-border: rgba(255,255,255,0.20);

  /* Risk pastels tuned for dark mode */
  --risk-low-bg: rgba(150, 220, 150, 0.25);
  --risk-low-border: rgba(150,220,150,0.45);
  --risk-low-text: #7de3b8;

  --risk-medium-bg: rgba(240, 220, 150, 0.25);
  --risk-medium-border: rgba(240,220,150,0.45);
  --risk-medium-text: #ffd98e;

  --risk-high-bg: rgba(240, 150, 150, 0.25);
  --risk-high-border: rgba(240,150,150,0.45);
  --risk-high-text: #ff9d9d;
}