/* Renovierungshelfer (next) — design tokens.
 *
 * Every colour a component uses comes from here. Components never name a
 * literal colour and never branch on the theme: the three blocks below swap
 * the token values, and everything follows.
 *
 *   :root                                   light (default)
 *   @media dark + :root:not([data-theme=light])  system dark, unless the user chose light
 *   :root[data-theme="dark"]                chosen dark, whatever the system says
 *
 * The choice itself (System / Hell / Dunkel) lives per device in localStorage
 * (`rh:theme`, js/theme.js) — it is a property of the screen, not of the
 * renovation, so it is never synced.
 */

:root {
  color-scheme: light;

  /* Grounds and surfaces */
  --bg: #f4f6f5;
  --surface: #ffffff;
  --surface-sunken: #eef2f1;
  --surface-raised: #ffffff;
  --scrim: rgb(12 20 19 / 0.4);

  /* Ink */
  --ink: #131b1a;
  --ink-2: #56645f;
  --ink-3: #8e9b98;
  --ink-inverse: #ffffff;

  /* Lines */
  --line: #e3e9e7;
  --line-strong: #cbd5d2;

  /* Brand */
  --accent: #0d9488;
  --accent-ink: #0b6f66;
  --accent-wash: #e3f4f1;
  --accent-soft: #9ed8d0;

  /* Measure lifecycle — one colour per board column */
  --status-idea: #8a9896;
  --status-offers: #4b6bdb;
  --status-planned: #0d9488;
  --status-work: #c98a12;
  --status-done: #2f9a5a;

  /* Semantic */
  --danger: #d14b2e;
  --danger-wash: #fbe9e4;
  --warning: #9a6a0c;
  --warning-wash: #fbf2df;
  --info: #3b5fc7;
  --info-wash: #eaeffc;
  --success: #2f9a5a;
  --success-wash: #e4f4ea;

  /* Primary action: ink on light, inverted on dark */
  --primary-bg: #131b1a;
  --primary-ink: #ffffff;

  /* Elevation — only for things that float */
  --shadow-card: 0 1px 2px rgb(20 40 36 / 0.07);
  --shadow-float: 0 10px 30px -10px rgb(10 30 28 / 0.35);

  /* Type */
  --font: 'Public Sans', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  --fs-xs: 0.75rem;     /* 12 */
  --fs-sm: 0.8125rem;   /* 13 */
  --fs-base: 1rem;      /* 16 — inputs never smaller (iOS zoom) */
  --fs-md: 0.9375rem;   /* 15 */
  --fs-lg: 1.125rem;    /* 18 */
  --fs-xl: 1.5rem;      /* 24 */
  --fs-2xl: 1.875rem;   /* 30 */

  /* Space */
  --sp-1: 0.25rem;
  --sp-2: 0.5rem;
  --sp-3: 0.75rem;
  --sp-4: 1rem;
  --sp-5: 1.25rem;
  --sp-6: 1.5rem;
  --sp-8: 2rem;

  /* Shape */
  --r-sm: 8px;
  --r-md: 12px;
  --r-lg: 16px;
  --r-xl: 22px;
  --r-pill: 999px;

  /* Layout */
  --gutter: 1rem;
  --content-max: 42rem;
  --tabbar-h: 64px;
  --touch: 44px;

  --ease: cubic-bezier(0.2, 0.8, 0.2, 1);

  /* Plan drawings: shared/surface-engine/renderer.js reads these (planPaper())
     for the canvas editor and every static plan preview. */
  --plan-ground: #f8faf9;
  --plan-grid-minor: #e3e9e7;
  --plan-grid-major: #cbd5d2;
  --plan-axis: #8e9b98;
  --plan-label: #8e9b98;
  --plan-chrome: #ffffff;
  --plan-halo: rgba(255, 255, 255, 0.9);
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    color-scheme: dark;
    --bg: #0b1110;
    --surface: #131b1a;
    --surface-sunken: #0f1615;
    --surface-raised: #1a2422;
    --scrim: rgb(0 0 0 / 0.55);
    --ink: #e4ecea;
    --ink-2: #9aaaa6;
    --ink-3: #6a7a77;
    --ink-inverse: #0b1110;
    --line: #223030;
    --line-strong: #2f403d;
    --accent: #2bb9a9;
    --accent-ink: #5fd3c4;
    --accent-wash: #133330;
    --accent-soft: #1f5e57;
    --status-idea: #7d8d8a;
    --status-offers: #7f9bf0;
    --status-planned: #2bb9a9;
    --status-work: #e0a93a;
    --status-done: #4cc07c;
    --danger: #f07c5e;
    --danger-wash: #3a1f18;
    --warning: #e0a93a;
    --warning-wash: #33270f;
    --info: #7f9bf0;
    --info-wash: #1c2544;
    --success: #4cc07c;
    --success-wash: #173222;
    --primary-bg: #e4ecea;
    --primary-ink: #0b1110;
    --shadow-card: 0 1px 2px rgb(0 0 0 / 0.4);
    --shadow-float: 0 12px 32px -10px rgb(0 0 0 / 0.7);
    --plan-ground: #0f1615;
    --plan-grid-minor: #1a2524;
    --plan-grid-major: #263533;
    --plan-axis: #46585f;
    --plan-label: #74868c;
    --plan-chrome: #e4ecea;
    --plan-halo: rgba(11, 17, 16, 0.9);
  }
}

:root[data-theme="dark"] {
  color-scheme: dark;
  --bg: #0b1110;
  --surface: #131b1a;
  --surface-sunken: #0f1615;
  --surface-raised: #1a2422;
  --scrim: rgb(0 0 0 / 0.55);
  --ink: #e4ecea;
  --ink-2: #9aaaa6;
  --ink-3: #6a7a77;
  --ink-inverse: #0b1110;
  --line: #223030;
  --line-strong: #2f403d;
  --accent: #2bb9a9;
  --accent-ink: #5fd3c4;
  --accent-wash: #133330;
  --accent-soft: #1f5e57;
  --status-idea: #7d8d8a;
  --status-offers: #7f9bf0;
  --status-planned: #2bb9a9;
  --status-work: #e0a93a;
  --status-done: #4cc07c;
  --danger: #f07c5e;
  --danger-wash: #3a1f18;
  --warning: #e0a93a;
  --warning-wash: #33270f;
  --info: #7f9bf0;
  --info-wash: #1c2544;
  --success: #4cc07c;
  --success-wash: #173222;
  --primary-bg: #e4ecea;
  --primary-ink: #0b1110;
  --shadow-card: 0 1px 2px rgb(0 0 0 / 0.4);
  --shadow-float: 0 12px 32px -10px rgb(0 0 0 / 0.7);
  --plan-ground: #0f1615;
  --plan-grid-minor: #1a2524;
  --plan-grid-major: #263533;
  --plan-axis: #46585f;
  --plan-label: #74868c;
  --plan-chrome: #e4ecea;
  --plan-halo: rgba(11, 17, 16, 0.9);
}
