/* ===========================================================================
   Remdingo themes
   ---------------------------------------------------------------------------
   A theme is a set of seeds. Everything else is generated by tokens.css.

   Two exceptions carry pins as well as seeds: Midnight and Daylight are the
   dark and light looks the app had before the token system, and their pins hold
   the exact colours it used to hardcode. That is what made the refactor a
   no-op. Every theme added since is seeds only - which is also what proves the
   generator works, because those themes have nothing else to fall back on.

   Adding a theme:
     1. Add a `:root[data-theme="<slug>"]` block with the nine seeds.
     2. If it is a light theme, add its slug to the light-family selector below.
     3. Add it to THEMES in theme.js so it appears in the Appearance gallery.
   Nothing else. No pins, and no per-component CSS.
   =========================================================================== */

/* ---------------------------------------------------------------------------
   Light-family wiring.
   Layer 2 in tokens.css is wired for a dark theme. These are the roles that
   genuinely invert - "raised" moves toward white, tints get weaker because they
   sit on a pale ground, shadows get much softer. Every light theme shares this;
   only the seeds differ.
   --------------------------------------------------------------------------- */
:root[data-theme="daylight"],
:root[data-theme="sepia"],
:root[data-theme="solarized-light"],
:root[data-theme="paper"] {
    color-scheme: light;

    /* Raised surfaces move toward white, not toward ink. */
    --rd-neutral-elevate: var(--rd-neutral-recess);

    /* A light theme needs a big push to reach white and a small one to show a
       border; a dark theme is the other way round. */
    --rd-rung-200-mix: 60%;
    --rd-rung-250-mix: 25%;
    --rd-rung-300-mix: 85%;
    --rd-rung-350-mix: 3%;
    --rd-rung-400-mix: 12%;
    --rd-rung-450-mix: 22%;

    /* Surfaces that pick a different rung on a pale ground. */
    --rd-popover: var(--rd-neutral-300);
    --rd-drawer: var(--rd-neutral-300);
    --rd-surface-quiet: var(--rd-neutral-100);
    --rd-list-row: var(--rd-neutral-100);
    --rd-note-row: var(--rd-neutral-50);
    --rd-field: var(--rd-neutral-300);
    --rd-field-sunken: var(--rd-neutral-100);
    --rd-field-inline: var(--rd-neutral-300);
    --rd-field-inline-focus: var(--rd-neutral-350);
    --rd-surface-veiled: color-mix(in srgb, var(--rd-neutral-100) var(--rd-veil-alpha), transparent);
    --rd-integration-card: var(--rd-neutral-300);
    --rd-integration-inner: var(--rd-neutral-100);
    --rd-integration-chip: var(--rd-neutral-350);
    --rd-canvas-vignette: transparent;

    --rd-border-inset: var(--rd-neutral-400);
    --rd-border-soft: var(--rd-neutral-400);
    --rd-border-softest: var(--rd-neutral-350);
    --rd-row-outline: color-mix(in oklab, var(--rd-accent) 28%, var(--rd-neutral-recess));
    --rd-meta-separator: var(--rd-neutral-450);

    --rd-text-glyph-chrome: var(--rd-neutral-600);

    /* Translucent selection reads as mud on a pale ground, so light themes
       mix into the surface instead of into transparency. */
    --rd-row-hover: var(--rd-neutral-100);
    --rd-selected-surface: color-mix(in oklab, var(--rd-accent) 8%, var(--rd-neutral-recess));
    --rd-nav-selected: color-mix(in oklab, var(--rd-accent) 18%, var(--rd-neutral-recess));
    --rd-neutral-action-hover: color-mix(in oklab, var(--rd-accent) 18%, var(--rd-neutral-recess));
    --rd-pill-selected: color-mix(in oklab, var(--rd-success-500) 6%, var(--rd-neutral-recess));
    --rd-pill-selected-fg: var(--rd-success-800);

    --rd-control: var(--rd-neutral-350);
    --rd-control-hover: var(--rd-neutral-400);
    --rd-chip-neutral: var(--rd-neutral-350);
    --rd-meter-track: var(--rd-neutral-350);
    --rd-scrollbar-thumb: var(--rd-neutral-450);
    --rd-scrollbar-thumb-hover: var(--rd-neutral-500);

    /* A tag chip floats on nothing in the dark; on a pale ground it needs a
       surface under it or the tint washes out. */
    --rd-tag-ground: var(--rd-surface);
    --rd-tag-fill-mix: 22%;
    --rd-tag-border-mix: 45%;
    --rd-tag-text-mix: 55%;
    --rd-tag-hover-mix: 34%;
    --rd-tag-contrast-floor: 22%;

    /* A mid orange has too little contrast against a pale row to be read as a
       number at this size. */
    --rd-count-outstanding: #ea580c;

    --rd-section-icon-mindmap: var(--rd-violet);
    --rd-brand-linear-fg: color-mix(in oklab, var(--rd-brand-linear) 70%, var(--rd-accent-shade));

    /* Every tint and shadow, weaker. */
    --rd-veil-8-alpha: 5%;
    --rd-wash-chip-alpha: 2%;
    --rd-soft-alpha: 8%;
    --rd-medium-alpha: 10%;
    --rd-firm-alpha: 20%;
    --rd-glow-alpha: 20%;
    --rd-accent-border-alpha: 30%;
    --rd-grad-from-alpha: 10%;
    --rd-grad-to-alpha: 5%;
    --rd-grad-from-hover-alpha: 15%;
    --rd-grad-to-hover-alpha: 8%;
    --rd-lift-2-alpha: 3%;
    --rd-lift-6-alpha: 8%;
    --rd-danger-10-alpha: 8%;
    --rd-danger-15-alpha: 12%;
    --rd-danger-border-alpha: 30%;
    --rd-warning-tint-alpha: 20%;
    --rd-violet-tint-alpha: 12%;
    --rd-linear-chip-alpha: 15%;
    --rd-linear-btn-alpha: 10%;
    --rd-shadow-rest-alpha: 6%;
    --rd-shadow-raised-alpha: 8%;
    --rd-shadow-overlay-alpha: 12%;
    --rd-shadow-modal-alpha: 15%;
    --rd-scrim-alpha: 30%;
    --rd-map-fill-alpha: 10%;
    --rd-map-line-alpha: 30%;
    --rd-dim-opacity: 0.55;
    --rd-drag-source-opacity: 0.45;
}

@supports not (color: oklch(from #000 l c h)) {
    :root[data-theme="daylight"],
    :root[data-theme="sepia"],
    :root[data-theme="solarized-light"],
    :root[data-theme="paper"] {
        --rd-text-on-accent: #ffffff;
    }
}

/* ===========================================================================
   Midnight - the original dark theme, pinned to the exact colours the app
   hardcoded before tokens existed. Switching to the token system changed no
   pixels here. Editing any seed in the Appearance page drops the pins and the
   ramp regenerates.
   =========================================================================== */
/* `:not([data-theme])` rather than a bare `:root`: a bare :root would still
   match when data-theme is "slate", and since these pins are more specific than
   nothing, every generated theme would quietly inherit Midnight's ramp. */
:root:not([data-theme]),
:root[data-theme="midnight"] {
    --rd-neutral-ground: #16162a;
    --rd-neutral-ink: #e0e0e0;
    --rd-neutral-recess: #12121f;
    --rd-accent: #7fdbda;
    --rd-accent-shade: var(--rd-accent);
    --rd-success: #a8f0dc;
    --rd-danger: #f0a6a6;
    --rd-warning: #f0d6a0;
    --rd-violet: #f0a6ca;

    --rd-neutral-0-pin: #12121f;
    --rd-neutral-50-pin: #14142a;
    --rd-neutral-100-pin: #151528;
    --rd-neutral-150-pin: #16162a;
    --rd-neutral-200-pin: #1a1a2e;
    --rd-neutral-250-pin: #1a1a30;
    --rd-neutral-300-pin: #1e1e3a;
    --rd-neutral-350-pin: #252542;
    --rd-neutral-400-pin: #2a2a4a;
    --rd-neutral-450-pin: #3a3a5a;
    --rd-neutral-500-pin: #5a5a7a;
    --rd-neutral-550-pin: #6a6a8a;
    --rd-neutral-600-pin: #7a7a9a;
    --rd-neutral-650-pin: #8888aa;
    --rd-neutral-700-pin: #b0b0cc;
    --rd-neutral-750-pin: #b8c4e0;
    --rd-neutral-800-pin: #c0c0d8;
    --rd-neutral-850-pin: #d0d0e0;
    --rd-neutral-900-pin: #e0e0e0;
    --rd-neutral-925-pin: #e0e0e0;
    --rd-neutral-950-pin: #e0e0e0;

    --rd-success-surface-pin: #1e4a3d;
    --rd-success-surface-hover-pin: #2a5f4f;
    --rd-danger-surface-pin: #4a2a2a;
    --rd-defer-surface-pin: #1e3a5f;
    --rd-defer-surface-hover-pin: #2a4a7f;
    --rd-success-400-pin: #34d399;
    --rd-success-500-pin: #22c55e;
    --rd-success-600-pin: #16a34a;
    --rd-danger-400-pin: #f87171;
    --rd-warning-icon-pin: #fbbf24;
    --rd-brand-sky-hover-pin: #8bc9de;
    --rd-brand-mauve-hover-pin: #d4a5d9;
    --rd-avatar-idle-pin: #475569;
    --rd-state-progress-icon-pin: #60a5fa;
    --rd-state-review-icon-pin: #c084fc;
    --rd-state-done-icon-pin: #4ade80;
    --rd-state-todo-icon-pin: #fbbf24;
    --rd-state-neutral-icon-pin: #94a3b8;
    --rd-brand-linear-fg-pin: #8b8fef;
}

/* ===========================================================================
   Daylight - the original light theme, likewise pinned exactly.
   =========================================================================== */
:root[data-theme="daylight"] {
    --rd-neutral-ground: #f5f5f7;
    --rd-neutral-ink: #111827;
    --rd-neutral-recess: #ffffff;
    --rd-accent: #3b82f6;
    --rd-accent-shade: #0b1a3a;
    --rd-success: #059669;
    --rd-danger: #dc2626;
    --rd-warning: #f59e0b;
    --rd-violet: #7c3aed;
    --rd-accent-data: #0d9488;

    --rd-neutral-0-pin: #ffffff;
    --rd-neutral-50-pin: #fafafa;
    --rd-neutral-100-pin: #f9fafb;
    --rd-neutral-150-pin: #f5f5f7;
    --rd-neutral-200-pin: #ffffff;
    --rd-neutral-250-pin: #f0f0f2;
    --rd-neutral-300-pin: #ffffff;
    --rd-neutral-350-pin: #f3f4f6;
    --rd-neutral-400-pin: #e5e7eb;
    --rd-neutral-450-pin: #d1d5db;
    --rd-neutral-500-pin: #9ca3af;
    --rd-neutral-550-pin: #9ca3af;
    --rd-neutral-600-pin: #9ca3af;
    --rd-neutral-650-pin: #6b7280;
    --rd-neutral-700-pin: #6b7280;
    --rd-neutral-750-pin: #4b5563;
    --rd-neutral-800-pin: #4b5563;
    --rd-neutral-850-pin: #4b5563;
    --rd-neutral-900-pin: #374151;
    --rd-neutral-925-pin: #1f2937;
    --rd-neutral-950-pin: #111827;

    --rd-accent-600-pin: #2563eb;
    --rd-accent-700-pin: #1d4ed8;
    --rd-accent-800-pin: #1e40af;
    --rd-success-surface-pin: #dcfce7;
    --rd-success-surface-hover-pin: #bbf7d0;
    --rd-danger-surface-pin: #fee2e2;
    --rd-defer-surface-pin: #dbeafe;
    --rd-defer-surface-hover-pin: #bfdbfe;
    --rd-success-400-pin: #34d399;
    --rd-success-500-pin: #22c55e;
    --rd-success-600-pin: #16a34a;
    --rd-success-800-pin: #166534;
    --rd-success-850-pin: #15803d;
    --rd-danger-400-pin: #f87171;
    --rd-warning-icon-pin: #fbbf24;
    --rd-brand-sky-hover-pin: #8bc9de;
    --rd-brand-mauve-hover-pin: #d4a5d9;
    --rd-avatar-idle-pin: #475569;
    --rd-state-progress-icon-pin: #60a5fa;
    --rd-state-review-icon-pin: #c084fc;
    --rd-state-done-icon-pin: #4ade80;
    --rd-state-todo-icon-pin: #fbbf24;
    --rd-state-neutral-icon-pin: #94a3b8;

    /* The six mind-map hues are chosen for contrast against the ground they sit
       on, so they are re-picked rather than generated. */
    --rd-map-1: #3b82f6;
    --rd-map-2: #a855f7;
    --rd-map-3: #22c55e;
    --rd-map-4: #f97316;
    --rd-map-5: #ec4899;
    --rd-map-6: #0ea5e9;

    --rd-meta-project: #0e7490;
    --rd-meta-parent: #7c3aed;
    --rd-meta-cycle: #be185d;
    --rd-link-issue: #4338ca;
    --rd-count-zero: #ea580c;
}

/* ===========================================================================
   Generated themes. Seeds only - everything else comes out of the ramp.
   =========================================================================== */

/* Slate - cool neutral greys, indigo accent. */
:root[data-theme="slate"] {
    --rd-neutral-ground: #0f172a;
    --rd-neutral-ink: #e2e8f0;
    --rd-neutral-recess: #020617;
    --rd-accent: #818cf8;
    --rd-accent-shade: #1e1b4b;
    --rd-success: #34d399;
    --rd-danger: #fb7185;
    --rd-warning: #fbbf24;
    --rd-violet: #c084fc;
    --rd-map-1: #818cf8;
    --rd-map-2: #f472b6;
    --rd-map-3: #34d399;
    --rd-map-4: #fbbf24;
    --rd-map-5: #22d3ee;
    --rd-map-6: #c084fc;
}

/* Nord - the arctic palette, muted and low-contrast by design. */
:root[data-theme="nord"] {
    --rd-neutral-ground: #2e3440;
    --rd-neutral-ink: #eceff4;
    --rd-neutral-recess: #242933;
    --rd-accent: #88c0d0;
    --rd-accent-shade: #2e3440;
    --rd-success: #a3be8c;
    --rd-danger: #bf616a;
    --rd-warning: #ebcb8b;
    --rd-violet: #b48ead;
    --rd-accent-data: #8fbcbb;
    --rd-map-1: #88c0d0;
    --rd-map-2: #b48ead;
    --rd-map-3: #a3be8c;
    --rd-map-4: #ebcb8b;
    --rd-map-5: #d08770;
    --rd-map-6: #81a1c1;
}

/* Gruvbox - warm, high-chroma retro dark. */
:root[data-theme="gruvbox"] {
    --rd-neutral-ground: #282828;
    --rd-neutral-ink: #ebdbb2;
    --rd-neutral-recess: #1d2021;
    --rd-accent: #83a598;
    --rd-accent-shade: #1d2021;
    --rd-success: #b8bb26;
    --rd-danger: #fb4934;
    --rd-warning: #fabd2f;
    --rd-violet: #d3869b;
    --rd-accent-data: #8ec07c;
    --rd-map-1: #83a598;
    --rd-map-2: #d3869b;
    --rd-map-3: #b8bb26;
    --rd-map-4: #fabd2f;
    --rd-map-5: #fe8019;
    --rd-map-6: #8ec07c;
}

/* Forest - deep green, mint accent. */
:root[data-theme="forest"] {
    --rd-neutral-ground: #10201a;
    --rd-neutral-ink: #d7e8dd;
    --rd-neutral-recess: #0a1611;
    --rd-accent: #6ee7b7;
    --rd-accent-shade: #052e21;
    --rd-success: #a7f3d0;
    --rd-danger: #fca5a5;
    --rd-warning: #fcd34d;
    --rd-violet: #f0abfc;
    --rd-map-1: #6ee7b7;
    --rd-map-2: #f0abfc;
    --rd-map-3: #bef264;
    --rd-map-4: #fcd34d;
    --rd-map-5: #fda4af;
    --rd-map-6: #7dd3fc;
}

/* Obsidian - maximum-contrast dark. Ground and recess are both pure black, so
   the surface rungs separate on ink alone. */
:root[data-theme="obsidian"] {
    --rd-neutral-ground: #000000;
    --rd-neutral-ink: #ffffff;
    --rd-neutral-recess: #000000;
    --rd-accent: #00e5ff;
    --rd-accent-shade: #003b44;
    --rd-success: #00e676;
    --rd-danger: #ff5252;
    --rd-warning: #ffd740;
    --rd-violet: #e040fb;
    --rd-rung-200-mix: 7%;
    --rd-rung-250-mix: 10%;
    --rd-rung-300-mix: 13%;
    --rd-rung-350-mix: 20%;
    --rd-rung-400-mix: 34%;
    --rd-rung-450-mix: 46%;
    --rd-map-1: #00e5ff;
    --rd-map-2: #e040fb;
    --rd-map-3: #00e676;
    --rd-map-4: #ffd740;
    --rd-map-5: #ff6e40;
    --rd-map-6: #40c4ff;
}

/* Sepia - warm paper, teal accent. */
:root[data-theme="sepia"] {
    --rd-neutral-ground: #f2e8d5;
    --rd-neutral-ink: #3b2f2a;
    --rd-neutral-recess: #fdf8ee;
    --rd-accent: #0f766e;
    --rd-accent-shade: #14201f;
    --rd-success: #4d7c0f;
    --rd-danger: #b91c1c;
    --rd-warning: #b45309;
    --rd-violet: #7e22ce;
    --rd-map-1: #0f766e;
    --rd-map-2: #7e22ce;
    --rd-map-3: #4d7c0f;
    --rd-map-4: #b45309;
    --rd-map-5: #be185d;
    --rd-map-6: #1d4ed8;
}

/* Solarized Light - Ethan Schoonover's palette, ported to the seed set. */
:root[data-theme="solarized-light"] {
    --rd-neutral-ground: #fdf6e3;
    --rd-neutral-ink: #073642;
    --rd-neutral-recess: #fffcf2;
    --rd-accent: #268bd2;
    --rd-accent-shade: #002b36;
    --rd-success: #859900;
    --rd-danger: #dc322f;
    --rd-warning: #b58900;
    --rd-violet: #6c71c4;
    --rd-accent-data: #2aa198;
    --rd-map-1: #268bd2;
    --rd-map-2: #6c71c4;
    --rd-map-3: #859900;
    --rd-map-4: #b58900;
    --rd-map-5: #d33682;
    --rd-map-6: #2aa198;
}

/* Paper - maximum-contrast light. Like Obsidian, ground and recess coincide,
   so the boundary rungs have to work harder. */
:root[data-theme="paper"] {
    --rd-neutral-ground: #ffffff;
    --rd-neutral-ink: #000000;
    --rd-neutral-recess: #ffffff;
    --rd-accent: #0b57d0;
    --rd-accent-shade: #001a41;
    --rd-success: #036b28;
    --rd-danger: #b3261e;
    --rd-warning: #7a5900;
    --rd-violet: #6b21a8;
    --rd-rung-200-mix: 0%;
    --rd-rung-250-mix: 0%;
    --rd-rung-300-mix: 0%;
    --rd-rung-350-mix: 7%;
    --rd-rung-400-mix: 26%;
    --rd-rung-450-mix: 42%;
    --rd-map-1: #0b57d0;
    --rd-map-2: #6b21a8;
    --rd-map-3: #036b28;
    --rd-map-4: #7a5900;
    --rd-map-5: #a3004c;
    --rd-map-6: #00629e;
}

/* ===========================================================================
   Unpinning.
   The moment someone edits a seed, that seed's whole ramp has to stop reading
   the pinned literals or nothing would visibly change. `initial` makes a custom
   property guaranteed-invalid, so every `var(--x-pin, <generated>)` falls
   through to the generated value.

   Which ramps are live is carried in `data-custom` on <html> as a space-
   separated list of seed names, written by the server at render time and by
   theme.js while the Appearance page is open. The map from seed to name lives
   in ONE place - PIN_FAMILIES in services/theme_settings.py - and both writers
   read it from there.

   These blocks must stay LAST in this file: they tie on specificity with the
   theme blocks above, so they win only by coming after them.
   =========================================================================== */

:root[data-custom~="neutral"] {
    --rd-neutral-0-pin: initial;
    --rd-neutral-50-pin: initial;
    --rd-neutral-100-pin: initial;
    --rd-neutral-150-pin: initial;
    --rd-neutral-200-pin: initial;
    --rd-neutral-250-pin: initial;
    --rd-neutral-300-pin: initial;
    --rd-neutral-350-pin: initial;
    --rd-neutral-400-pin: initial;
    --rd-neutral-450-pin: initial;
    --rd-neutral-500-pin: initial;
    --rd-neutral-550-pin: initial;
    --rd-neutral-600-pin: initial;
    --rd-neutral-650-pin: initial;
    --rd-neutral-700-pin: initial;
    --rd-neutral-750-pin: initial;
    --rd-neutral-800-pin: initial;
    --rd-neutral-850-pin: initial;
    --rd-neutral-900-pin: initial;
    --rd-neutral-925-pin: initial;
    --rd-neutral-950-pin: initial;
    /* These three mix a seed into a neutral rung, so they move with the ramp. */
    --rd-success-surface-pin: initial;
    --rd-success-surface-hover-pin: initial;
    --rd-danger-surface-pin: initial;
    --rd-defer-surface-pin: initial;
    --rd-defer-surface-hover-pin: initial;
    --rd-avatar-idle-pin: initial;
}

:root[data-custom~="accent"] {
    --rd-accent-400-pin: initial;
    --rd-accent-600-pin: initial;
    --rd-accent-700-pin: initial;
    --rd-accent-800-pin: initial;
    --rd-defer-surface-pin: initial;
    --rd-defer-surface-hover-pin: initial;
}

:root[data-custom~="success"] {
    --rd-success-300-pin: initial;
    --rd-success-400-pin: initial;
    --rd-success-500-pin: initial;
    --rd-success-600-pin: initial;
    --rd-success-800-pin: initial;
    --rd-success-850-pin: initial;
    --rd-success-surface-pin: initial;
    --rd-success-surface-hover-pin: initial;
}

:root[data-custom~="danger"] {
    --rd-danger-400-pin: initial;
    --rd-danger-surface-pin: initial;
}

:root[data-custom~="warning"] { --rd-warning-icon-pin: initial; }
:root[data-custom~="violet"]  { --rd-violet-solid-pin: initial; }

:root[data-custom~="state-progress"] { --rd-state-progress-icon-pin: initial; }
:root[data-custom~="state-review"]   { --rd-state-review-icon-pin: initial; }
:root[data-custom~="state-done"]     { --rd-state-done-icon-pin: initial; }
:root[data-custom~="state-todo"]     { --rd-state-todo-icon-pin: initial; }
:root[data-custom~="state-neutral"]  {
    --rd-state-neutral-icon-pin: initial;
    --rd-avatar-idle-pin: initial;
}

:root[data-custom~="brand-sky"]   { --rd-brand-sky-hover-pin: initial; }
:root[data-custom~="brand-mauve"] { --rd-brand-mauve-hover-pin: initial; }