/* ==================================================================== */
/* Color themes                                                         */
/*                                                                      */
/* A theme only supplies color *roles* (--t-*). UI styles (styles.css)  */
/* decide which role paints which surface, so every theme works with    */
/* every style. Each theme ships a light and a dark palette.            */
/*                                                                      */
/* Dark palettes are selected by `.dark` on the same element (the       */
/* document) or by `data-mode="dark"` (scoped previews).                */
/*                                                                      */
/* Contrast budget (enforced by resources/js/lib/themes.test.ts):       */
/*   text, text-2 on canvas/surface      >= 7 / 4.5                     */
/*   text-3 on canvas/surface            >= 4.5                         */
/*   accent-fg on accent                 >= 4.5                         */
/*   accent on canvas/surface (as text)  >= 4.5                         */
/*   rail-fg / rail-fg-2 on rail         >= 7 / 4.5                     */
/* ==================================================================== */

/* -------------------------------------------------------------------- */
/* Mode primitives (shared by every theme)                              */
/* -------------------------------------------------------------------- */
:root,
[data-theme],
[data-mode='light'] {
    color-scheme: light;

    --m-scheme: light;
    --m-tint: 10%;
    --m-sa: 1;
    --m-highlight: rgb(255 255 255 / 0.72);
    --m-edge: rgb(255 255 255 / 0.7);
    --m-scrim: rgb(12 12 20 / 0.32);

    --success: #157a3c;
    --warning: #a35400;
    --danger: #c42b1c;
    --info: #1f5fcc;
    --on-danger: #ffffff;
}

.dark,
[data-mode='dark'] {
    color-scheme: dark;

    --m-scheme: dark;
    --m-tint: 16%;
    --m-sa: 3;
    --m-highlight: rgb(255 255 255 / 0.06);
    --m-edge: rgb(255 255 255 / 0.09);
    --m-scrim: rgb(0 0 0 / 0.62);

    --success: #4ade80;
    --warning: #fbbf24;
    --danger: #f87171;
    --info: #60a5fa;
    --on-danger: #2a0606;
}

/* -------------------------------------------------------------------- */
/* Aurora — balanced indigo and violet over cool neutrals (default)     */
/* -------------------------------------------------------------------- */
:root,
[data-theme='aurora'] {
    --t-canvas: #fcfcfd;
    --t-canvas-2: #f4f4f8;
    --t-surface: #ffffff;
    --t-raised: #ffffff;
    --t-line: #e6e5ec;
    --t-line-2: #d3d1dc;
    --t-text: #18171f;
    --t-text-2: #474557;
    --t-text-3: #676577;
    --t-accent: #5b5bd6;
    --t-accent-hover: #5050c8;
    --t-accent-active: #4646b5;
    --t-accent-fg: #ffffff;
    --t-rail: #141320;
    --t-rail-2: #252339;
    --t-rail-fg: #eeedf6;
    --t-rail-fg-2: #a3a0bd;
    --t-rail-line: #252338;
    --t-rail-accent: #9d9bfa;
    --t-rail-accent-fg: #0c0b24;
    --t-glow-a: rgb(124 106 247 / 0.24);
    --t-glow-b: rgb(56 189 248 / 0.16);
    --t-shadow: 30 27 60;
    --t-chart-2: #8b5cf6;
}

.dark[data-theme='aurora'],
[data-theme='aurora'][data-mode='dark'] {
    --t-canvas: #0e0d14;
    --t-canvas-2: #09090e;
    --t-surface: #14131c;
    --t-raised: #1b1a25;
    --t-line: #262434;
    --t-line-2: #353246;
    --t-text: #edecf4;
    --t-text-2: #bfbcd0;
    --t-text-3: #8e8aa3;
    --t-accent: #9391f8;
    --t-accent-hover: #a5a3fa;
    --t-accent-active: #7f7cf1;
    --t-accent-fg: #0c0b24;
    --t-rail: #08070d;
    --t-rail-2: #1c1b29;
    --t-rail-fg: #edecf4;
    --t-rail-fg-2: #9894ad;
    --t-rail-line: #1b1a27;
    --t-rail-accent: #9d9bfa;
    --t-rail-accent-fg: #0c0b24;
    --t-glow-a: rgb(124 106 247 / 0.2);
    --t-glow-b: rgb(56 189 248 / 0.1);
    --t-shadow: 0 0 0;
    --t-chart-2: #c4b5fd;
}

/* -------------------------------------------------------------------- */
/* Obsidian — graphite neutrals, ink as the accent                      */
/* -------------------------------------------------------------------- */
[data-theme='obsidian'] {
    --t-canvas: #ffffff;
    --t-canvas-2: #f5f5f6;
    --t-surface: #ffffff;
    --t-raised: #ffffff;
    --t-line: #e6e6e9;
    --t-line-2: #d4d4d8;
    --t-text: #0a0a0b;
    --t-text-2: #3f3f46;
    --t-text-3: #66666f;
    --t-accent: #18181b;
    --t-accent-hover: #2e2e33;
    --t-accent-active: #000000;
    --t-accent-fg: #fafafa;
    --t-rail: #0a0a0b;
    --t-rail-2: #1f1f22;
    --t-rail-fg: #ededef;
    --t-rail-fg-2: #9a9aa2;
    --t-rail-line: #222225;
    --t-rail-accent: #ffffff;
    --t-rail-accent-fg: #09090b;
    --t-glow-a: rgb(161 161 170 / 0.32);
    --t-glow-b: rgb(113 113 122 / 0.2);
    --t-shadow: 9 9 11;
    --t-chart-2: #71717a;
}

.dark[data-theme='obsidian'],
[data-theme='obsidian'][data-mode='dark'] {
    --t-canvas: #09090a;
    --t-canvas-2: #050505;
    --t-surface: #111113;
    --t-raised: #18181b;
    --t-line: #232326;
    --t-line-2: #303035;
    --t-text: #f4f4f5;
    --t-text-2: #c4c4ca;
    --t-text-3: #8c8c96;
    --t-accent: #f4f4f5;
    --t-accent-hover: #ffffff;
    --t-accent-active: #d4d4d8;
    --t-accent-fg: #09090b;
    --t-rail: #050505;
    --t-rail-2: #19191c;
    --t-rail-fg: #ededef;
    --t-rail-fg-2: #8f8f99;
    --t-rail-line: #18181b;
    --t-rail-accent: #ffffff;
    --t-rail-accent-fg: #09090b;
    --t-glow-a: rgb(161 161 170 / 0.12);
    --t-glow-b: rgb(82 82 91 / 0.18);
    --t-shadow: 0 0 0;
    --t-chart-2: #a1a1aa;
}

/* -------------------------------------------------------------------- */
/* Pearl — porcelain and silver with a steel-cyan accent                */
/* -------------------------------------------------------------------- */
[data-theme='pearl'] {
    --t-canvas: #fbfbf9;
    --t-canvas-2: #f2f2ee;
    --t-surface: #ffffff;
    --t-raised: #ffffff;
    --t-line: #e4e4de;
    --t-line-2: #d1d1c9;
    --t-text: #1a1b1d;
    --t-text-2: #46484c;
    --t-text-3: #66686d;
    --t-accent: #0f6b87;
    --t-accent-hover: #0c5f78;
    --t-accent-active: #0a5268;
    --t-accent-fg: #ffffff;
    --t-rail: #161a1d;
    --t-rail-2: #252b2f;
    --t-rail-fg: #ebeff1;
    --t-rail-fg-2: #9ea8ae;
    --t-rail-line: #262c30;
    --t-rail-accent: #67c6e0;
    --t-rail-accent-fg: #04212b;
    --t-glow-a: rgb(167 216 236 / 0.3);
    --t-glow-b: rgb(244 198 220 / 0.24);
    --t-shadow: 28 25 23;
    --t-chart-2: #64748b;
}

.dark[data-theme='pearl'],
[data-theme='pearl'][data-mode='dark'] {
    --t-canvas: #111214;
    --t-canvas-2: #0b0c0d;
    --t-surface: #17181b;
    --t-raised: #1e2023;
    --t-line: #26292d;
    --t-line-2: #34383d;
    --t-text: #eceef0;
    --t-text-2: #bec3c8;
    --t-text-3: #8d949b;
    --t-accent: #67c6e0;
    --t-accent-hover: #82d2e8;
    --t-accent-active: #4fb6d3;
    --t-accent-fg: #04212b;
    --t-rail: #0a0b0c;
    --t-rail-2: #1c1e21;
    --t-rail-fg: #eceef0;
    --t-rail-fg-2: #939aa1;
    --t-rail-line: #1c1e21;
    --t-rail-accent: #67c6e0;
    --t-rail-accent-fg: #04212b;
    --t-glow-a: rgb(103 198 224 / 0.14);
    --t-glow-b: rgb(244 198 220 / 0.08);
    --t-shadow: 0 0 0;
    --t-chart-2: #94a3b8;
}

/* -------------------------------------------------------------------- */
/* Midnight — navy-tinted slate with a cobalt accent                    */
/* -------------------------------------------------------------------- */
[data-theme='midnight'] {
    --t-canvas: #fafbfd;
    --t-canvas-2: #f0f3f8;
    --t-surface: #ffffff;
    --t-raised: #ffffff;
    --t-line: #e1e6ee;
    --t-line-2: #ccd3df;
    --t-text: #0e1525;
    --t-text-2: #3a455a;
    --t-text-3: #5b677d;
    --t-accent: #2f5bea;
    --t-accent-hover: #2850d6;
    --t-accent-active: #2246bf;
    --t-accent-fg: #ffffff;
    --t-rail: #0b1322;
    --t-rail-2: #19253d;
    --t-rail-fg: #e7ecf6;
    --t-rail-fg-2: #95a2ba;
    --t-rail-line: #1c2840;
    --t-rail-accent: #7aa2ff;
    --t-rail-accent-fg: #041029;
    --t-glow-a: rgb(47 91 234 / 0.2);
    --t-glow-b: rgb(14 165 233 / 0.16);
    --t-shadow: 15 23 42;
    --t-chart-2: #0284c7;
}

.dark[data-theme='midnight'],
[data-theme='midnight'][data-mode='dark'] {
    --t-canvas: #0a0f1c;
    --t-canvas-2: #060a14;
    --t-surface: #0f1626;
    --t-raised: #151e31;
    --t-line: #1e2840;
    --t-line-2: #2b3753;
    --t-text: #e8edf7;
    --t-text-2: #b4bfd4;
    --t-text-3: #8492ad;
    --t-accent: #7aa2ff;
    --t-accent-hover: #92b3ff;
    --t-accent-active: #6690fa;
    --t-accent-fg: #041029;
    --t-rail: #050912;
    --t-rail-2: #131d31;
    --t-rail-fg: #e8edf7;
    --t-rail-fg-2: #8895af;
    --t-rail-line: #141d30;
    --t-rail-accent: #7aa2ff;
    --t-rail-accent-fg: #041029;
    --t-glow-a: rgb(59 130 246 / 0.22);
    --t-glow-b: rgb(14 165 233 / 0.12);
    --t-shadow: 0 0 0;
    --t-chart-2: #38bdf8;
}

/* -------------------------------------------------------------------- */
/* Emerald — calm green-grey neutrals with a deep emerald accent        */
/* -------------------------------------------------------------------- */
[data-theme='emerald'] {
    --t-canvas: #fafcfb;
    --t-canvas-2: #f0f4f2;
    --t-surface: #ffffff;
    --t-raised: #ffffff;
    --t-line: #e0e7e3;
    --t-line-2: #cad5cf;
    --t-text: #0f1a15;
    --t-text-2: #3b4a43;
    --t-text-3: #5b6a63;
    --t-accent: #047857;
    --t-accent-hover: #036a4d;
    --t-accent-active: #035c43;
    --t-accent-fg: #ffffff;
    --t-rail: #0c1814;
    --t-rail-2: #182a22;
    --t-rail-fg: #e6f0eb;
    --t-rail-fg-2: #93ab9f;
    --t-rail-line: #1a2c24;
    --t-rail-accent: #34d399;
    --t-rail-accent-fg: #032a1c;
    --t-glow-a: rgb(16 185 129 / 0.2);
    --t-glow-b: rgb(45 212 191 / 0.14);
    --t-shadow: 16 32 26;
    --t-chart-2: #0d9488;
}

.dark[data-theme='emerald'],
[data-theme='emerald'][data-mode='dark'] {
    --t-canvas: #0a100e;
    --t-canvas-2: #060a09;
    --t-surface: #0f1714;
    --t-raised: #151f1b;
    --t-line: #1c2924;
    --t-line-2: #2a3a33;
    --t-text: #e6f0eb;
    --t-text-2: #b3c4bc;
    --t-text-3: #869a91;
    --t-accent: #34d399;
    --t-accent-hover: #52deaa;
    --t-accent-active: #20bf86;
    --t-accent-fg: #032a1c;
    --t-rail: #050907;
    --t-rail-2: #13201a;
    --t-rail-fg: #e6f0eb;
    --t-rail-fg-2: #8aa096;
    --t-rail-line: #12201a;
    --t-rail-accent: #34d399;
    --t-rail-accent-fg: #032a1c;
    --t-glow-a: rgb(52 211 153 / 0.14);
    --t-glow-b: rgb(45 212 191 / 0.1);
    --t-shadow: 0 0 0;
    --t-chart-2: #2dd4bf;
}

/* -------------------------------------------------------------------- */
/* Ember — warm sand neutrals with a burnt-orange accent                */
/* -------------------------------------------------------------------- */
[data-theme='ember'] {
    --t-canvas: #fcfbf9;
    --t-canvas-2: #f5f1ec;
    --t-surface: #ffffff;
    --t-raised: #ffffff;
    --t-line: #e8e2da;
    --t-line-2: #d6ccc0;
    --t-text: #1d1814;
    --t-text-2: #4b423b;
    --t-text-3: #6b6158;
    --t-accent: #c2410c;
    --t-accent-hover: #af3a0b;
    --t-accent-active: #9a330a;
    --t-accent-fg: #ffffff;
    --t-rail: #1a1411;
    --t-rail-2: #2c221d;
    --t-rail-fg: #f3ece6;
    --t-rail-fg-2: #b0a195;
    --t-rail-line: #2e241f;
    --t-rail-accent: #fb923c;
    --t-rail-accent-fg: #2a1203;
    --t-glow-a: rgb(251 146 60 / 0.22);
    --t-glow-b: rgb(250 204 21 / 0.14);
    --t-shadow: 41 28 18;
    --t-chart-2: #b45309;
}

.dark[data-theme='ember'],
[data-theme='ember'][data-mode='dark'] {
    --t-canvas: #110d0b;
    --t-canvas-2: #0b0807;
    --t-surface: #18120f;
    --t-raised: #201915;
    --t-line: #2b221c;
    --t-line-2: #3b2f27;
    --t-text: #f3ece6;
    --t-text-2: #cdbfb3;
    --t-text-3: #a08f82;
    --t-accent: #fb923c;
    --t-accent-hover: #fca35a;
    --t-accent-active: #f97f1e;
    --t-accent-fg: #2a1203;
    --t-rail: #0a0706;
    --t-rail-2: #1f1713;
    --t-rail-fg: #f3ece6;
    --t-rail-fg-2: #a69588;
    --t-rail-line: #1d1612;
    --t-rail-accent: #fb923c;
    --t-rail-accent-fg: #2a1203;
    --t-glow-a: rgb(251 146 60 / 0.14);
    --t-glow-b: rgb(250 204 21 / 0.07);
    --t-shadow: 0 0 0;
    --t-chart-2: #fbbf24;
}

/* -------------------------------------------------------------------- */
/* Rose — soft blush neutrals with a crimson-rose accent                */
/* -------------------------------------------------------------------- */
[data-theme='rose'] {
    --t-canvas: #fcfbfb;
    --t-canvas-2: #f6f0f1;
    --t-surface: #ffffff;
    --t-raised: #ffffff;
    --t-line: #eae1e3;
    --t-line-2: #d8cace;
    --t-text: #1e1417;
    --t-text-2: #4e3f44;
    --t-text-3: #6e5b61;
    --t-accent: #cc2952;
    --t-accent-hover: #b8244a;
    --t-accent-active: #a21f41;
    --t-accent-fg: #ffffff;
    --t-rail: #1a1115;
    --t-rail-2: #2c1d23;
    --t-rail-fg: #f5ebef;
    --t-rail-fg-2: #b49ca4;
    --t-rail-line: #2e1f25;
    --t-rail-accent: #fb7192;
    --t-rail-accent-fg: #2a0511;
    --t-glow-a: rgb(244 114 182 / 0.2);
    --t-glow-b: rgb(251 146 60 / 0.12);
    --t-shadow: 45 20 30;
    --t-chart-2: #a21caf;
}

.dark[data-theme='rose'],
[data-theme='rose'][data-mode='dark'] {
    --t-canvas: #110b0d;
    --t-canvas-2: #0b0708;
    --t-surface: #181013;
    --t-raised: #20161a;
    --t-line: #2d1f24;
    --t-line-2: #3e2b32;
    --t-text: #f6ecef;
    --t-text-2: #d2bec5;
    --t-text-3: #a88f98;
    --t-accent: #fb7192;
    --t-accent-hover: #fc8da7;
    --t-accent-active: #f4567d;
    --t-accent-fg: #2a0511;
    --t-rail: #0a0607;
    --t-rail-2: #1f1519;
    --t-rail-fg: #f6ecef;
    --t-rail-fg-2: #ab929b;
    --t-rail-line: #1e1318;
    --t-rail-accent: #fb7192;
    --t-rail-accent-fg: #2a0511;
    --t-glow-a: rgb(251 113 133 / 0.14);
    --t-glow-b: rgb(244 114 182 / 0.1);
    --t-shadow: 0 0 0;
    --t-chart-2: #e879f9;
}