/* =============================================================
 * Dev Portal — Design Tokens (SMUI Nord)
 * Nord palette, HSL triplets. Dark: Polar Night | Light: Snow Storm
 * Font: JetBrains Mono
 * ============================================================= */

@import url('https://fonts.googleapis.com/css2?family=JetBrains+Mono:ital,wght@0,300;0,400;0,500;0,600;0,700;1,400&display=swap');

/* ── Light mode (default) — Nord Snow Storm ─────────────────── */
:root {
  --background:           218 27% 94%;
  --foreground:           220 16% 22%;
  --card:                 218 27% 89%;
  --card-foreground:      220 16% 22%;
  --popover:              218 27% 89%;
  --popover-foreground:   220 16% 22%;
  --primary:              213 32% 40%;
  --primary-foreground:   0 0% 100%;
  --secondary:            219 28% 84%;
  --secondary-foreground: 220 16% 22%;
  --muted:                219 28% 84%;
  --muted-foreground:     220 17% 28%;
  --accent:               213 20% 86%;
  --accent-foreground:    213 32% 40%;
  --destructive:          355 55% 45%;
  --destructive-foreground: 0 0% 100%;
  --border:               219 18% 72%;
  --input:                219 18% 72%;
  --ring:                 213 32% 40%;
  --radius:               0rem;

  --smui-frost-1: 176 30% 35%;
  --smui-frost-2: 193 40% 38%;
  --smui-frost-3: 210 34% 40%;
  --smui-frost-4: 213 32% 36%;

  --smui-red:    355 55% 44%;
  --smui-orange:  14 55% 44%;
  --smui-yellow:  40 70% 34%;
  --smui-green:   92 35% 34%;
  --smui-purple: 311 28% 40%;

  --smui-surface-0: 218 27% 94%;
  --smui-surface-1: 218 27% 89%;
  --smui-surface-2: 219 28% 84%;
  --smui-surface-3: 219 20% 76%;

  --smui-border-hover: 220 17% 50%;

  --font-sans: 'JetBrains Mono', ui-monospace, SFMono-Regular, monospace;
  --font-mono: 'JetBrains Mono', ui-monospace, SFMono-Regular, monospace;
}

/* ── Dark mode — Nord Polar Night ───────────────────────────── */
.dark {
  --background:           213 16% 12%;
  --foreground:           213 27% 88%;
  --card:                 217 16% 15.5%;
  --card-foreground:      213 27% 88%;
  --popover:              217 16% 15.5%;
  --popover-foreground:   213 27% 88%;
  --primary:              193 44% 67%;
  --primary-foreground:   213 16% 12%;
  --secondary:            216 15% 19%;
  --secondary-foreground: 213 27% 88%;
  --muted:                216 15% 19%;
  --muted-foreground:     213 14% 65%;
  --accent:               193 10% 16%;
  --accent-foreground:    193 44% 67%;
  --destructive:          355 52% 65%;
  --destructive-foreground: 219 28% 94%;
  --border:               217 17% 28%;
  --input:                217 17% 28%;
  --ring:                 193 44% 67%;
  --radius:               0rem;

  --smui-frost-1: 176 25% 65%;
  --smui-frost-2: 193 44% 67%;
  --smui-frost-3: 210 34% 63%;
  --smui-frost-4: 213 32% 52%;

  --smui-red:    355 52% 64%;
  --smui-orange:  14 51% 63%;
  --smui-yellow:  40 71% 73%;
  --smui-green:   92 28% 65%;
  --smui-purple: 311 24% 63%;

  --smui-surface-0: 213 16% 12%;
  --smui-surface-1: 217 16% 15.5%;
  --smui-surface-2: 216 15% 19%;
  --smui-surface-3: 215 14% 22%;

  --smui-border-hover: 216 12% 37%;
}