/* ==========================================================================
   WellWave — Color System  ·  palette: wellwave-clinical-blue
   --------------------------------------------------------------------------
   Light = clean clinical paper. Dark = "Teal Clínico True Dark" (OLED-deep).
   Every color is exposed twice: hex (--x) and space-separated RGB (--x-rgb)
   so it composes with `rgb(var(--x-rgb) / <alpha>)`. Semantic aliases
   (--text-*, --surface-*, --action-*) sit on top of the raw ramps.
   ========================================================================== */

:root {
  /* ── Brand ramps ─────────────────────────────────────────────── */
  /* Primary — Clinical Blue (action / focus) */
  --ww-primary-50: #e6f1fe;
  --ww-primary-100: #cfe4fd;
  --ww-primary-200: #a3cbfb;
  --ww-primary-300: #6ba8f8;
  --ww-primary-400: #2f86f2;
  --ww-primary-500: #0070eb;
  --ww-primary-600: #005bc4;
  --ww-primary-700: #0048a3;
  --ww-primary-800: #073b82;
  --ww-primary-900: #0b3267;
  --ww-primary-950: #072043;

  /* Cyan / Aqua — vital-sign signal */
  --ww-cyan-300: #5fcce8;
  --ww-cyan-400: #22b4d8;
  --ww-cyan-500: #0f9cc4;
  --ww-cyan-600: #0c80a4;
  --ww-cyan-700: #0a6786;

  /* Green — success / goal achieved */
  --ww-green-300: #72c99b;
  --ww-green-400: #4cb37e;
  --ww-green-500: #2e9e6b;
  --ww-green-600: #24855a;
  --ww-green-700: #1c6b49;

  /* Sky / azure — secondary persona accent */
  --ww-azure-300: #94bbee;
  --ww-azure-400: #6b9ce3;
  --ww-azure-500: #4f86d6;
  --ww-azure-600: #3d6fc0;
  --ww-azure-700: #3059a0;

  /* Neutral slate (clinical greys, faint teal cast) */
  --ww-neutral-50: #f4f7f8;
  --ww-neutral-100: #e7eeef;
  --ww-neutral-200: #d4e0e2;
  --ww-neutral-300: #bccccf;
  --ww-neutral-400: #9daeb2;
  --ww-neutral-500: #7e9094;
  --ww-neutral-600: #647579;
  --ww-neutral-700: #4d5c5f;
  --ww-neutral-800: #394548;
  --ww-neutral-900: #283133;
  --ww-neutral-950: #18201f;

  /* ── Liquid-Glass accent tints (hero washes) ────────────────── */
  --ww-tint-aqua: #5fcce8;
  --ww-tint-violet: #94bbee;
  --ww-tint-rose: #e78189;
  --ww-tint-amber: #e7b264;
  --ww-tint-lime: #72c99b;
  --ww-tint-aqua-rgb: 95 204 232; /* @kind color */
  --ww-tint-violet-rgb: 148 187 238; /* @kind color */
  --ww-tint-rose-rgb: 231 129 137; /* @kind color */
  --ww-tint-amber-rgb: 231 178 100; /* @kind color */
  --ww-tint-lime-rgb: 114 201 155; /* @kind color */

  /* ── Mode-stable anchors (never flip with theme) ───────────── */
  --ww-on-media: #ffffff;
  --ww-on-media-rgb: 255 255 255; /* @kind color */
  --ww-scrim: #000000;
  --ww-scrim-rgb: 0 0 0; /* @kind color */
  --ww-ink: #0f172a;          /* deep navy — glass shadow base */
  --ww-ink-rgb: 15 23 42; /* @kind color */
  --ww-graphite: #1d1d1f;     /* Apple graphite — dark glass base */
  --ww-graphite-rgb: 29 29 31; /* @kind color */

  /* ── Surfaces (LIGHT) ────────────────────────────────────────── */
  --ww-surface-canvas: #ffffff;
  --ww-surface-page: #f6fafb;
  --ww-surface-base: #ffffff;
  --ww-surface-muted: #eef4f5;
  --ww-surface-elevated: #eef4f5;
  --ww-surface-inverse: #14272c;
  --ww-surface-void: #000000;
  --ww-surface-canvas-rgb: 255 255 255; /* @kind color */
  --ww-surface-page-rgb: 246 250 251; /* @kind color */
  --ww-surface-base-rgb: 255 255 255; /* @kind color */
  --ww-surface-muted-rgb: 238 244 245; /* @kind color */
  --ww-surface-void-rgb: 0 0 0; /* @kind color */

  /* ── Text (LIGHT) ────────────────────────────────────────────── */
  --ww-text-primary: #14272c;   /* 17:1 on white */
  --ww-text-strong: #14272c;
  --ww-text-title: #0f5fb8;      /* clinical-blue headings */
  --ww-text-secondary: #44565b;  /* 7.4:1 */
  --ww-text-muted: #64747a;      /* 4.8:1 — true AA */
  --ww-text-disabled: #a2b0b4;
  --ww-text-inverse: #ffffff;
  --ww-text-primary-rgb: 20 39 44; /* @kind color */
  --ww-text-secondary-rgb: 68 86 91; /* @kind color */
  --ww-text-muted-rgb: 100 116 122; /* @kind color */
  --ww-text-title-rgb: 15 95 184; /* @kind color */

  /* ── Action / link / focus (LIGHT) ──────────────────────────── */
  --ww-action-primary: #0070eb;
  --ww-action-primary-hover: #005bc4;
  --ww-action-primary-active: #0048a3;
  --ww-action-primary-foreground: #ffffff;
  --ww-action-primary-rgb: 0 112 235; /* @kind color */
  --ww-link: #0070eb;
  --ww-link-hover: #005bc4;
  --ww-link-on-dark: #94bbee;
  --ww-focus-ring: #0070eb;
  --ww-focus-ring-rgb: 0 112 235; /* @kind color */

  /* ── Status (LIGHT) ──────────────────────────────────────────── */
  --ww-status-success: #2e9e6b;
  --ww-status-warning: #e0913a;
  --ww-status-danger: #d64550;
  --ww-status-critical: #bc2f3a;
  --ww-status-info: #1488b8;
  --ww-status-success-rgb: 46 158 107; /* @kind color */
  --ww-status-warning-rgb: 224 145 58; /* @kind color */
  --ww-status-danger-rgb: 214 69 80; /* @kind color */
  --ww-status-critical-rgb: 188 47 58; /* @kind color */
  --ww-status-info-rgb: 20 136 184; /* @kind color */

  /* ── Medical semantics ──────────────────────────────────────── */
  --ww-red-flag: #d64550;          /* auto-detected clinical red flag */
  --ww-evidence: #e0913a;          /* EBM / evidence badge */
  --ww-prob-low: #6ba8f8;
  --ww-prob-high: #2e9e6b;
  --ww-tuss-liberar: #2e9e6b;      /* TUSS: release */
  --ww-tuss-auditoria: #e0913a;    /* TUSS: audit */

  /* ── Brand gradients ────────────────────────────────────────── */
  --gradient-brand-hero: linear-gradient(
    100deg, #0a4db0 0%, #1366c9 28%, #1e8edd 52%, #16c0e8 78%, #1f9fb0 100%); /* @kind color */
  --gradient-cta: linear-gradient(135deg, #0070eb 0%, #16c0e8 100%); /* @kind color */
  --gradient-wordmark: linear-gradient(
    110deg, #0a4db0 0%, #1366c9 26%, #1e8edd 52%, #16bfe6 80%, #1f9fb0 100%); /* @kind color */
  --gradient-medical: linear-gradient(135deg, #0070eb 0%, #0f9cc4 100%); /* @kind color */
  --gradient-premium: linear-gradient(135deg, #1e3a68 0%, #4f86d6 50%, #3d6fc0 100%); /* @kind color */
  --gradient-glow-ring: radial-gradient(
    circle, rgb(0 112 235 / 0.12) 0%, rgb(0 112 235 / 0.08) 50%, transparent 74%); /* @kind color */

  /* ── Semantic aliases (un-prefixed) ─────────────────────────── */
  --surface-page: var(--ww-surface-page);
  --surface-canvas: var(--ww-surface-canvas);
  --surface-card: var(--ww-surface-base);
  --surface-muted: var(--ww-surface-muted);
  --text-primary: var(--ww-text-primary);
  --text-title: var(--ww-text-title);
  --text-secondary: var(--ww-text-secondary);
  --text-muted: var(--ww-text-muted);
  --action-primary: var(--ww-action-primary);
  --link: var(--ww-link);
  --focus-ring: var(--ww-focus-ring);
}

/* ============================================================
   DARK — "Teal Clínico True Dark"
   L0 #0e1a1c page · L1 #14262a card · L2 #1b3034 elevated
   ============================================================ */
:root[data-theme='dark'],
:root.dark {
  --ww-surface-canvas: #14262a;
  --ww-surface-page: #0e1a1c;
  --ww-surface-base: #14262a;
  --ww-surface-muted: #1b3034;
  --ww-surface-elevated: #1b3034;
  --ww-surface-inverse: #eaf4f4;
  --ww-surface-void: #000000;
  --ww-surface-canvas-rgb: 20 38 42; /* @kind color */
  --ww-surface-page-rgb: 14 26 28; /* @kind color */
  --ww-surface-base-rgb: 20 38 42; /* @kind color */
  --ww-surface-muted-rgb: 27 48 52; /* @kind color */

  --ww-text-primary: #eaf4f4;
  --ww-text-strong: #eaf4f4;
  --ww-text-title: #45cfd6;       /* bright clinical teal */
  --ww-text-secondary: #b6c9cc;
  --ww-text-muted: #8aa0a3;
  --ww-text-disabled: #61757a;
  --ww-text-inverse: #14262a;
  --ww-text-primary-rgb: 234 244 244; /* @kind color */
  --ww-text-secondary-rgb: 182 201 204; /* @kind color */
  --ww-text-muted-rgb: 138 160 163; /* @kind color */
  --ww-text-title-rgb: 69 207 214; /* @kind color */

  --ww-action-primary: #34c0e4;
  --ww-action-primary-hover: #5ad0ec;
  --ww-action-primary-active: #8adef0;
  --ww-action-primary-foreground: #04181b;
  --ww-action-primary-rgb: 52 192 228; /* @kind color */
  --ww-link: #4da0d8;
  --ww-link-hover: #5ad0ec;
  --ww-focus-ring: #34c0e4;
  --ww-focus-ring-rgb: 52 192 228; /* @kind color */

  /* Status — boosted for WCAG AA on dark */
  --ww-status-success: #4cb88a;
  --ww-status-warning: #e0a85a;
  --ww-status-danger: #e2727b;
  --ww-status-critical: #e2727b;
  --ww-status-info: #45a6c8;
  --ww-status-success-rgb: 76 184 138; /* @kind color */
  --ww-status-warning-rgb: 224 168 90; /* @kind color */
  --ww-status-danger-rgb: 226 114 123; /* @kind color */
  --ww-status-critical-rgb: 226 114 123; /* @kind color */
  --ww-status-info-rgb: 69 166 200; /* @kind color */

  --gradient-cta: linear-gradient(135deg, #1e8edd 0%, #34c0e4 100%); /* @kind color */
  --gradient-wordmark: linear-gradient(
    120deg, #bfd7f6 0%, #94bbee 22%, #94bbee 44%, #5fcce8 68%, #5fcce8 100%); /* @kind color */
}
