/* ==============================================================
 * THEMES — add or edit themes here, then add to THEMES array in JS
 * ============================================================== */

:root, [data-theme="dark"] {
  color-scheme: dark;
  --bg-surface:   #0e1016;
  --bg-card:      #191c26;
  /* Inset/deep surface used by .lot-row (position accordion), .admin-detail-row
     (admin accordion), badges, chips, inputs, progress bars and the soft small
     buttons. Lifted from the original #111318 — that was ~8 darker than --bg-card
     in every channel, which read harsh inside the cards. Now derived from the
     card colour so it stays in lockstep, just enough delta to read as inset. */
  --bg-deep:      color-mix(in srgb, var(--bg-card) 70%, var(--bg-surface) 30%);
  --bg-hover:     #1e2130;
  --border:       #1e3248;
  --text-primary: #e4eaf2;
  --text-sub:     #8a9ab0;
  --text-muted:   #454e60;
  --text-dim:     #333b4a;
  --accent:       #8ab8d8;
  --accent-soft:  #a8c8e8;
  --gain:         #34d399;
  --loss:         #f87171;
  --warn:         #fb923c;
  --chart-total:  #8ab8d8;
  --chart-stock:  #60a5fa;
  --chart-crypto: #a78bfa;
  --scrollbar:    #383c52;
  /* design tokens */
  --radius-card:        12px;
  --radius-sm:          6px;
  --radius-xs:          4px;
  --radius-tiny:        2px;
  --shadow-dropdown:    0 8px 24px rgba(0,0,0,0.18);
  --card-shadow:        none;
  --card-shadow-hover:  0 4px 24px rgba(0,0,0,0.5), inset 0 1px 0 rgba(255,255,255,0.03);
  --header-bg:          rgba(25,28,38,0.90);
  --header-blur:        blur(16px);
  --body-font: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Cascadia Code", monospace;
  /* card border accent gradients */
  --_sg: linear-gradient(to bottom, rgba(138,184,216,0.61) 0%, rgba(138,184,216,0.09) 35%, transparent 55%);
  --_cg: linear-gradient(transparent, transparent);
  /* Z-index scale — structural, not per-theme */
  --z-navrow:    90;   /* tab row — above page content, below the sticky header */
  --z-header:    100;  /* sticky banners + header — below tooltips/dropdowns/overlays */
  --z-tooltip:   120;
  --z-dropdown:  200;
  --z-overlay:   998;
  --z-modal:     1200;
  --z-toploader: 9999;
  --z-skiplink:  10000;
  /* confirm must render above all content modals (admin 9997, account 9998) */
  --z-confirm:   10001;
  /* secondary modal layer — above z-overlay (998), below z-modal (1200) */
  --z-sym-tx-bg: 1100;
  --z-sym-tx:    1101;
}

/* Midnight — GitHub Dark: flat, precise, developer-cold */
[data-theme="midnight"] {
  color-scheme: dark;
  --bg-surface:   #010409;
  --bg-card:      #0d1117;
  --bg-deep:      #080c12;
  --bg-hover:     #161b22;
  --border:       #21262d;
  --text-primary: #e6edf3;
  --text-sub:     #7d8590;
  --text-muted:   #484f58;
  --text-dim:     #2d333b;
  --accent:       #2f81f7;
  --accent-soft:  #58a6ff;
  --gain:         #3fb950;
  --loss:         #f85149;
  --warn:         #e3b341;
  --chart-total:  #f0883e;
  --chart-stock:  #39c5cf;
  --chart-crypto: #d2a8ff;
  --scrollbar:    #21262d;
  /* design tokens — flat, GitHub-grade */
  --radius-card:        6px;
  --radius-sm:          6px;
  --radius-xs:          4px;
  --radius-tiny:        2px;
  --shadow-dropdown:    0 8px 24px rgba(0,0,0,0.18);
  --card-shadow:        none;
  --card-shadow-hover:  0 8px 24px rgba(1,4,9,0.8);
  --header-bg:          rgba(13,17,23,0.95);
  --header-blur:        blur(12px);
  --body-font: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Cascadia Code", monospace;
  /* card border accent gradients — summary only; content cards have no gradient */
  --_sg: linear-gradient(to bottom, rgba(47,129,247,0.61) 0%, rgba(47,129,247,0.09) 35%, transparent 55%);
  --_cg: linear-gradient(transparent, transparent);
}

/* Light — fintech app: borderless cards, pure shadow, sans-serif, open */
[data-theme="light"] {
  color-scheme: light;
  --bg-surface:   #f0f2f5;
  --bg-card:      #ffffff;
  --bg-deep:      #e8ebf0;
  --bg-hover:     #eaecf2;
  --border:       #dde1ea;
  --text-primary: #0d1117;
  --text-sub:     #4a5568;
  --text-muted:   #8a96a8;
  --text-dim:     #c8d0dc;
  --accent:       #2563eb;
  --accent-soft:  #3b82f6;
  --gain:         #16a34a;
  --loss:         #dc2626;
  --warn:         #d97706;
  --chart-total:  #ea580c;
  --chart-stock:  #0891b2;
  --chart-crypto: #9333ea;
  --scrollbar:    #c8d0dc;
  /* design tokens — open, fintech-grade */
  --radius-card:        14px;
  --radius-sm:          8px;
  --radius-xs:          4px;
  --radius-tiny:        2px;
  --shadow-dropdown:    0 8px 24px rgba(0,0,0,0.12);
  --card-shadow:        0 1px 3px rgba(0,0,0,0.05), 0 6px 18px rgba(0,0,0,0.04);
  --card-shadow-hover:  0 4px 12px rgba(0,0,0,0.08), 0 16px 40px rgba(0,0,0,0.07);
  --header-bg:          rgba(240,242,245,0.90);
  --header-blur:        blur(20px);
  --body-font: -apple-system, BlinkMacSystemFont, "Inter", "Segoe UI", system-ui, sans-serif;
  /* card border accent gradients — same gradient for both groups */
  --_sg: linear-gradient(to right, rgba(37,99,235,0.44) 0%, rgba(59,130,246,0.28) 50%, rgba(37,99,235,0.44) 100%);
  --_cg: linear-gradient(to right, rgba(37,99,235,0.44) 0%, rgba(59,130,246,0.28) 50%, rgba(37,99,235,0.44) 100%);
}

/* AMOLED — void terminal: zero radius, neon data, hairline borders */
[data-theme="amoled"] {
  color-scheme: dark;
  --bg-surface:   #000000;
  --bg-card:      #080808;
  --bg-deep:      #000000;
  --bg-hover:     #0f0f0f;
  --border:       #1e1e1e;
  --text-primary: #f0f0f0;
  --text-sub:     #6a6a6a;
  --text-muted:   #333333;
  --text-dim:     #222222;
  --accent:       #e2e2e2;
  --accent-soft:  #a8a8a8;
  --gain:         #00e676;
  --loss:         #ff1744;
  --warn:         #ffd600;
  --chart-total:  #e2e2e2;
  --chart-stock:  #00e5ff;
  --chart-crypto: #d500f9;
  --scrollbar:    #1e1e1e;
  /* design tokens — sharp, void, clinical */
  --radius-card:        0px;
  --radius-sm:          0px;
  --radius-xs:          0px;
  --radius-tiny:        0px;
  --shadow-dropdown:    none;
  --card-shadow:        none;
  --card-shadow-hover:  none;
  --header-bg:          rgba(0,0,0,0.98);
  --header-blur:        blur(0px);
  --body-font: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Cascadia Code", monospace;
}


/* Soft — modern SaaS (Linear / Notion / Vercel DNA): pill UI, gradient flair, sans-serif */
[data-theme="soft"] {
  color-scheme: light;
  --bg-surface:   #f4f4f6;
  --bg-card:      #ffffff;
  --bg-deep:      #eaeaec;
  --bg-hover:     #ededf0;
  --border:       #e2e2e8;
  --text-primary: #18181b;
  --text-sub:     #71717a;
  --text-muted:   #a1a1aa;
  --text-dim:     #d4d4d8;
  --accent:       #6366f1;
  --accent-soft:  #818cf8;
  --gain:         #059669;
  --loss:         #e11d48;
  --warn:         #d97706;
  --chart-total:  #6366f1;
  --chart-stock:  #0ea5e9;
  --chart-crypto: #a855f7;
  --scrollbar:    #d4d4d8;
  /* design tokens — full pill UI, airy, product-grade */
  --radius-card:        18px;
  --radius-sm:          999px;
  --radius-xs:          4px;
  --radius-tiny:        2px;
  --shadow-dropdown:    0 8px 24px rgba(0,0,0,0.10);
  --card-shadow:        0 1px 3px rgba(0,0,0,0.05), 0 8px 24px rgba(0,0,0,0.05);
  --card-shadow-hover:  0 4px 8px rgba(0,0,0,0.04), 0 20px 48px rgba(0,0,0,0.09);
  --header-bg:          rgba(244,244,246,0.85);
  --header-blur:        blur(28px);
  --body-font: -apple-system, BlinkMacSystemFont, "Inter", "Segoe UI", system-ui, sans-serif;
  /* card border accent gradients */
  --_sg: linear-gradient(to bottom, rgba(99,102,241,0.82) 0%, rgba(129,140,248,0.38) 50%, transparent 100%);
  --_cg: linear-gradient(to bottom, rgba(99,102,241,0.50) 0%, rgba(129,140,248,0.18) 50%, transparent 100%);
}
/* Aurora — glassmorphism: frosted cards, northern-lights gradient body, violet accent */
[data-theme="aurora"] {
  color-scheme: dark;
  --bg-surface:   #0c0d1a;
  --bg-card:      rgba(255,255,255,0.046);
  --bg-deep:      rgba(0,0,0,0.22);
  --bg-hover:     rgba(255,255,255,0.075);
  --border:       rgba(255,255,255,0.09);
  --text-primary: #eef0ff;
  --text-sub:     #8590cc;
  --text-muted:   #3d4478;
  --text-dim:     #22284e;
  --accent:       #a78bfa;
  --accent-soft:  #c4b5fd;
  --gain:         #34d399;
  --loss:         #fb7185;
  --warn:         #fb923c;
  --chart-total:  #a78bfa;
  --chart-stock:  #38bdf8;
  --chart-crypto: #f472b6;
  --scrollbar:    #252c5e;
  /* design tokens — glass, luminous, floaty */
  --radius-card:        14px;
  --radius-sm:          8px;
  --radius-xs:          4px;
  --radius-tiny:        2px;
  --shadow-dropdown:    0 8px 24px rgba(0,0,0,0.35);
  --card-shadow:        0 4px 24px rgba(0,0,0,0.4);
  --card-shadow-hover:  0 12px 48px rgba(0,0,0,0.5), 0 0 0 1px rgba(167,139,250,0.22);
  --header-bg:          rgba(12,13,26,0.62);
  --header-blur:        blur(28px);
  --body-font: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Cascadia Code", monospace;
}

/* Glass — Apple Liquid Glass: near-transparent lens, prismatic edges, corner refraction */
[data-theme="glass"] {
  color-scheme: light;
  --bg-surface:   #c7dcf7;
  --bg-card:      rgba(255,255,255,0.28);
  --bg-deep:      rgba(255,255,255,0.32);
  --bg-hover:     rgba(255,255,255,0.42);
  --border:       rgba(255,255,255,0.55);
  --text-primary: #162438;
  --text-sub:     #2e4460;
  --text-muted:   #6882a0;
  --text-dim:     #a8c0d8;
  --accent:       #007aff;
  --accent-soft:  #409cff;
  --gain:         #34c759;
  --loss:         #ff3b30;
  --warn:         #ff9500;
  --chart-total:  #007aff;
  --chart-stock:  #5ac8fa;
  --chart-crypto: #af52de;
  --scrollbar:    rgba(0,0,0,0.14);
  /* design tokens — liquid glass, Apple-grade */
  --radius-card:        16px;
  --radius-sm:          10px;
  --radius-xs:          4px;
  --radius-tiny:        2px;
  --shadow-dropdown:    0 8px 32px rgba(31,38,135,0.14);
  --card-shadow:        inset 0 1.5px 0 rgba(255,255,255,0.92), 0 8px 40px rgba(31,38,135,0.14), 0 2px 8px rgba(0,0,0,0.07);
  --card-shadow-hover:  inset 0 1.5px 0 rgba(255,255,255,0.98), 0 12px 48px rgba(31,38,135,0.20), 0 4px 12px rgba(0,0,0,0.09);
  --header-bg:          rgba(214,232,248,0.55);
  --header-blur:        blur(3px) saturate(200%);
  --body-font: -apple-system, "SF Pro Display", "SF Pro Text", BlinkMacSystemFont, system-ui, sans-serif;
}

/* Valence — clean grey: neutral surfaces, charcoal accent, no color tints */
[data-theme="valence"] {
  color-scheme: light;
  --bg-surface:         #f1f5f9;
  --bg-card:            #fafbfc;
  --bg-deep:            #e2e8f0;
  --bg-hover:           #e8edf4;
  --border:             #cbd5e1;
  --text-primary:       #0f172a;
  --text-sub:           #334155;
  --text-muted:         #64748b;
  --text-dim:           #94a3b8;
  --accent:             #3a5a90;  /* was #415c7f — more blue */
  --accent-soft:        #5578ae;  /* was #5a7599 */
  --brand:              #3a5a90;  /* was #415c7f */
  --gain:               #1aab55;
  --loss:               #d93535;
  --warn:               #c07a00;
  --chart-total:        #7a9cc4;
  --chart-stock:        #2563eb;
  --chart-crypto:       #7c3aed;
  --alloc-stock:        #2563eb;
  --alloc-etf:          #0891b2;
  --alloc-crypto:       #7c3aed;
  --scrollbar:          #d8d8d8;
  --radius-card:        12px;
  --radius-sm:          6px;
  --radius-xs:          4px;
  --radius-tiny:        2px;
  --shadow-dropdown:    0 8px 24px rgba(0,0,0,0.12);
  --card-shadow:        0 1px 2px rgba(0,0,0,0.05), 0 4px 18px rgba(0,0,0,0.06);
  --card-shadow-hover:  0 6px 28px rgba(0,0,0,0.10), 0 2px 8px rgba(0,0,0,0.05);
  --header-bg:          rgba(255,255,255,0.96);
  --header-blur:        blur(20px);
  --body-font: "DM Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", system-ui, sans-serif;
  /* card border accent gradients */
  --_sg: linear-gradient(to bottom, rgba(58,90,144,0.82) 0%, rgba(58,90,144,0.38) 50%, transparent 100%);
  --_cg: linear-gradient(to bottom, rgba(58,90,144,0.50) 0%, rgba(58,90,144,0.18) 50%, transparent 100%);
}

/* Shadow — carved void: absolute black, ash text, cards sunken into nothingness */
[data-theme="shadow"] {
  color-scheme: dark;
  --bg-surface:   #000000;
  --bg-card:      #060606;
  --bg-deep:      #000000;
  --bg-hover:     #161616;
  --border:       #1e1e1e;
  --text-primary: #b8b8b8;
  --text-sub:     #6a6a6a;
  --text-muted:   #424242;
  --text-dim:     #2c2c2c;
  --accent:       #383838;
  --accent-soft:  #505050;
  --gain:         #38a05c;
  --loss:         #a83434;
  --warn:         #926218;
  --chart-total:  #989898;
  --chart-stock:  #7890a0;
  --chart-crypto: #7a6a8e;
  --scrollbar:    #1c1c1c;
  /* design tokens — carved pit: deep inset, near-invisible hairline rim */
  --radius-card:        8px;
  --radius-sm:          4px;
  --radius-xs:          3px;
  --radius-tiny:        2px;
  --shadow-dropdown:    0 8px 48px rgba(0,0,0,0.99);
  --card-shadow:        inset 0 2px 28px rgba(0,0,0,0.94),
                        inset 0 0 72px rgba(0,0,0,0.72);
  --card-shadow-hover:  inset 0 4px 36px rgba(0,0,0,0.96),
                        inset 0 0 88px rgba(0,0,0,0.78);
  --header-bg:          rgba(0,0,0,1);
  --header-blur:        none;
  --body-font: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Cascadia Code", monospace;
}