/* ============================================
   PALETTES — 7 switchable color palettes
   Each defines light + dark mode variables.
   Default (Ash & Crimson) is in base.css :root.
   These override via [data-palette] attribute.
   ============================================ */

/* ---------- 1. Steel Blue ---------- */
[data-palette="steel-blue"] {
  --bg-primary: #F8FAFC; --bg-secondary: #FFFFFF; --bg-card: #FFFFFF;
  --text-primary: #0F172A; --text-secondary: #475569; --text-muted: #94A3B8;
  --accent: #2563EB; --accent-light: #3B82F6; --accent-cyan: #0891B2;
  --accent-gradient: linear-gradient(135deg, #2563EB, #0891B2);
  --border: #E2E8F0; --shadow: 0 1px 3px rgba(15,23,42,0.06);
  --shadow-lg: 0 10px 30px rgba(37,99,235,0.08);
  --navbar-bg: rgba(248,250,252,0.85); --navbar-shadow: 0 1px 3px rgba(15,23,42,0.06);
  --pill-bg: #EFF6FF; --pill-text: #2563EB; --input-bg: #F1F5F9;
  --timeline-line: #CBD5E1; --hero-dot: rgba(37,99,235,0.04);
  --scrollbar-track: #F1F5F9; --scrollbar-thumb: #CBD5E1;
  --footer-bg: #F1F5F9; --modal-overlay: rgba(15,23,42,0.5);
}
[data-palette="steel-blue"][data-theme="dark"] {
  --bg-primary: #0B1120; --bg-secondary: #111827; --bg-card: #162032;
  --text-primary: #E2E8F0; --text-secondary: #94A3B8; --text-muted: #64748B;
  --accent: #3B82F6; --accent-light: #60A5FA; --accent-cyan: #22D3EE;
  --accent-gradient: linear-gradient(135deg, #3B82F6, #22D3EE);
  --border: #1E293B; --shadow: 0 1px 3px rgba(0,0,0,0.4);
  --shadow-lg: 0 10px 30px rgba(59,130,246,0.08);
  --navbar-bg: rgba(11,17,32,0.9); --navbar-shadow: 0 1px 3px rgba(0,0,0,0.4);
  --pill-bg: rgba(59,130,246,0.1); --pill-text: #60A5FA; --input-bg: #162032;
  --timeline-line: #1E293B; --hero-dot: rgba(59,130,246,0.04);
  --scrollbar-track: #111827; --scrollbar-thumb: #1E293B;
  --footer-bg: #080E1C; --modal-overlay: rgba(0,0,0,0.75);
}

/* ---------- 2. Amber Gold ---------- */
[data-palette="amber-gold"] {
  --bg-primary: #FAFAF9; --bg-secondary: #FFFFFF; --bg-card: #FFFFFF;
  --text-primary: #1C1917; --text-secondary: #57534E; --text-muted: #A8A29E;
  --accent: #D97706; --accent-light: #F59E0B; --accent-cyan: #B45309;
  --accent-gradient: linear-gradient(135deg, #D97706, #9A3412);
  --border: #E7E5E4; --shadow: 0 1px 3px rgba(28,25,23,0.06);
  --shadow-lg: 0 10px 30px rgba(217,119,6,0.1);
  --navbar-bg: rgba(250,250,249,0.85); --navbar-shadow: 0 1px 3px rgba(28,25,23,0.06);
  --pill-bg: #FFFBEB; --pill-text: #B45309; --input-bg: #F5F5F4;
  --timeline-line: #D6D3D1; --hero-dot: rgba(217,119,6,0.05);
  --scrollbar-track: #F5F5F4; --scrollbar-thumb: #D6D3D1;
  --footer-bg: #F5F5F4; --modal-overlay: rgba(28,25,23,0.5);
}
[data-palette="amber-gold"][data-theme="dark"] {
  --bg-primary: #0C0A09; --bg-secondary: #1C1917; --bg-card: #292524;
  --text-primary: #E7E5E4; --text-secondary: #A8A29E; --text-muted: #78716C;
  --accent: #F59E0B; --accent-light: #FBBF24; --accent-cyan: #EA580C;
  --accent-gradient: linear-gradient(135deg, #F59E0B, #EA580C);
  --border: #292524; --shadow: 0 1px 3px rgba(0,0,0,0.5);
  --shadow-lg: 0 10px 30px rgba(245,158,11,0.06);
  --navbar-bg: rgba(12,10,9,0.92); --navbar-shadow: 0 1px 3px rgba(0,0,0,0.5);
  --pill-bg: rgba(245,158,11,0.1); --pill-text: #FBBF24; --input-bg: #292524;
  --timeline-line: #292524; --hero-dot: rgba(245,158,11,0.04);
  --scrollbar-track: #1C1917; --scrollbar-thumb: #292524;
  --footer-bg: #0A0908; --modal-overlay: rgba(0,0,0,0.8);
}

/* ---------- 3. Calibrated Paper (Indigo/Violet) ---------- */
[data-palette="calibrated-paper"] {
  --bg-primary: #FAFAFA; --bg-secondary: #FFFFFF; --bg-card: #FFFFFF;
  --text-primary: #09090B; --text-secondary: #3F3F46; --text-muted: #52525B;
  --accent: #4F46E5; --accent-light: #6366F1; --accent-cyan: #4338CA;
  --accent-gradient: linear-gradient(135deg, #4F46E5, #7C3AED);
  --border: #E4E4E7; --shadow: 0 1px 3px rgba(9,9,11,0.06);
  --shadow-lg: 0 10px 30px rgba(79,70,229,0.08);
  --navbar-bg: rgba(250,250,250,0.85); --navbar-shadow: 0 1px 3px rgba(9,9,11,0.06);
  --pill-bg: #EEF2FF; --pill-text: #4F46E5; --input-bg: #F4F4F5;
  --timeline-line: #D4D4D8; --hero-dot: rgba(79,70,229,0.04);
  --scrollbar-track: #F4F4F5; --scrollbar-thumb: #D4D4D8;
  --footer-bg: #F4F4F5; --modal-overlay: rgba(9,9,11,0.5);
}
[data-palette="calibrated-paper"][data-theme="dark"] {
  --bg-primary: #09090B; --bg-secondary: #18181B; --bg-card: #18181B;
  --text-primary: #FAFAFA; --text-secondary: #A1A1AA; --text-muted: #71717A;
  --accent: #818CF8; --accent-light: #A5B4FC; --accent-cyan: #C4B5FD;
  --accent-gradient: linear-gradient(135deg, #818CF8, #C4B5FD);
  --border: #27272A; --shadow: 0 1px 3px rgba(0,0,0,0.5);
  --shadow-lg: 0 10px 30px rgba(129,140,248,0.06);
  --navbar-bg: rgba(9,9,11,0.92); --navbar-shadow: 0 1px 3px rgba(0,0,0,0.5);
  --pill-bg: #1E1B4B; --pill-text: #A5B4FC; --input-bg: #18181B;
  --timeline-line: #27272A; --hero-dot: rgba(129,140,248,0.04);
  --scrollbar-track: #18181B; --scrollbar-thumb: #27272A;
  --footer-bg: #09090B; --modal-overlay: rgba(0,0,0,0.8);
}

/* ---------- 4. Graphite & Sage ---------- */
[data-palette="graphite-sage"] {
  --bg-primary: #F5F5F4; --bg-secondary: #FFFFFF; --bg-card: #FFFFFF;
  --text-primary: #1C1917; --text-secondary: #57534E; --text-muted: #78716C;
  --accent: #166534; --accent-light: #15803D; --accent-cyan: #14532D;
  --accent-gradient: linear-gradient(135deg, #166534, #14532D);
  --border: #E7E5E4; --shadow: 0 1px 3px rgba(28,25,23,0.06);
  --shadow-lg: 0 10px 30px rgba(22,101,52,0.08);
  --navbar-bg: rgba(245,245,244,0.85); --navbar-shadow: 0 1px 3px rgba(28,25,23,0.06);
  --pill-bg: #F0FDF4; --pill-text: #166534; --input-bg: #F5F5F4;
  --timeline-line: #D6D3D1; --hero-dot: rgba(22,101,52,0.04);
  --scrollbar-track: #F5F5F4; --scrollbar-thumb: #D6D3D1;
  --footer-bg: #F5F5F4; --modal-overlay: rgba(28,25,23,0.5);
}
[data-palette="graphite-sage"][data-theme="dark"] {
  --bg-primary: #0C0A09; --bg-secondary: #1C1917; --bg-card: #1C1917;
  --text-primary: #FAFAF9; --text-secondary: #A8A29E; --text-muted: #78716C;
  --accent: #4ADE80; --accent-light: #86EFAC; --accent-cyan: #22C55E;
  --accent-gradient: linear-gradient(135deg, #4ADE80, #22C55E);
  --border: #292524; --shadow: 0 1px 3px rgba(0,0,0,0.5);
  --shadow-lg: 0 10px 30px rgba(74,222,128,0.06);
  --navbar-bg: rgba(12,10,9,0.92); --navbar-shadow: 0 1px 3px rgba(0,0,0,0.5);
  --pill-bg: rgba(74,222,128,0.1); --pill-text: #86EFAC; --input-bg: #1C1917;
  --timeline-line: #292524; --hero-dot: rgba(74,222,128,0.04);
  --scrollbar-track: #1C1917; --scrollbar-thumb: #292524;
  --footer-bg: #0A0908; --modal-overlay: rgba(0,0,0,0.8);
}

/* ---------- 5. Ash & Crimson (default — duplicated here for palette switcher) ---------- */
[data-palette="ash-crimson"] {
  --bg-primary: #FAFAFA; --bg-secondary: #FFFFFF; --bg-card: #FFFFFF;
  --text-primary: #18181B; --text-secondary: #52525B; --text-muted: #71717A;
  --accent: #9F1239; --accent-light: #BE123C; --accent-cyan: #881337;
  --accent-gradient: linear-gradient(135deg, #9F1239, #881337);
  --border: #E4E4E7; --shadow: 0 1px 3px rgba(24,24,27,0.06);
  --shadow-lg: 0 10px 30px rgba(159,18,57,0.08);
  --navbar-bg: rgba(250,250,250,0.85); --navbar-shadow: 0 1px 3px rgba(24,24,27,0.06);
  --pill-bg: #FFF1F2; --pill-text: #9F1239; --input-bg: #F4F4F5;
  --timeline-line: #D4D4D8; --hero-dot: rgba(159,18,57,0.04);
  --scrollbar-track: #F4F4F5; --scrollbar-thumb: #D4D4D8;
  --footer-bg: #F4F4F5; --modal-overlay: rgba(24,24,27,0.5);
}
[data-palette="ash-crimson"][data-theme="dark"] {
  --bg-primary: #09090B; --bg-secondary: #18181B; --bg-card: #18181B;
  --text-primary: #FAFAFA; --text-secondary: #A1A1AA; --text-muted: #52525B;
  --accent: #FB7185; --accent-light: #FDA4AF; --accent-cyan: #F43F5E;
  --accent-gradient: linear-gradient(135deg, #FB7185, #F43F5E);
  --border: #27272A; --shadow: 0 1px 3px rgba(0,0,0,0.5);
  --shadow-lg: 0 10px 30px rgba(251,113,133,0.06);
  --navbar-bg: rgba(9,9,11,0.92); --navbar-shadow: 0 1px 3px rgba(0,0,0,0.5);
  --pill-bg: rgba(251,113,133,0.1); --pill-text: #FDA4AF; --input-bg: #18181B;
  --timeline-line: #27272A; --hero-dot: rgba(251,113,133,0.04);
  --scrollbar-track: #18181B; --scrollbar-thumb: #27272A;
  --footer-bg: #09090B; --modal-overlay: rgba(0,0,0,0.8);
}

/* ---------- 6. Carbon & Teal ---------- */
[data-palette="carbon-teal"] {
  --bg-primary: #F8FAFC; --bg-secondary: #FFFFFF; --bg-card: #FFFFFF;
  --text-primary: #0F172A; --text-secondary: #475569; --text-muted: #64748B;
  --accent: #0F766E; --accent-light: #0D9488; --accent-cyan: #115E59;
  --accent-gradient: linear-gradient(135deg, #0F766E, #115E59);
  --border: #E2E8F0; --shadow: 0 1px 3px rgba(15,23,42,0.06);
  --shadow-lg: 0 10px 30px rgba(15,118,110,0.08);
  --navbar-bg: rgba(248,250,252,0.85); --navbar-shadow: 0 1px 3px rgba(15,23,42,0.06);
  --pill-bg: #F0FDFA; --pill-text: #0F766E; --input-bg: #F1F5F9;
  --timeline-line: #CBD5E1; --hero-dot: rgba(15,118,110,0.04);
  --scrollbar-track: #F1F5F9; --scrollbar-thumb: #CBD5E1;
  --footer-bg: #F1F5F9; --modal-overlay: rgba(15,23,42,0.5);
}
[data-palette="carbon-teal"][data-theme="dark"] {
  --bg-primary: #020617; --bg-secondary: #0F172A; --bg-card: #0F172A;
  --text-primary: #F1F5F9; --text-secondary: #94A3B8; --text-muted: #475569;
  --accent: #2DD4BF; --accent-light: #5EEAD4; --accent-cyan: #14B8A6;
  --accent-gradient: linear-gradient(135deg, #2DD4BF, #14B8A6);
  --border: #1E293B; --shadow: 0 1px 3px rgba(0,0,0,0.5);
  --shadow-lg: 0 10px 30px rgba(45,212,191,0.06);
  --navbar-bg: rgba(2,6,23,0.92); --navbar-shadow: 0 1px 3px rgba(0,0,0,0.5);
  --pill-bg: rgba(45,212,191,0.1); --pill-text: #5EEAD4; --input-bg: #0F172A;
  --timeline-line: #1E293B; --hero-dot: rgba(45,212,191,0.04);
  --scrollbar-track: #0F172A; --scrollbar-thumb: #1E293B;
  --footer-bg: #020617; --modal-overlay: rgba(0,0,0,0.8);
}

/* ---------- 7. Parchment & Ochre ---------- */
[data-palette="parchment-ochre"] {
  --bg-primary: #FEFCE8; --bg-secondary: #FEFCDD; --bg-card: #FEFCDD;
  --text-primary: #1C1A10; --text-secondary: #57530E; --text-muted: #92400E;
  --accent: #854D0E; --accent-light: #A16207; --accent-cyan: #713F12;
  --accent-gradient: linear-gradient(135deg, #854D0E, #713F12);
  --border: #E9E5C8; --shadow: 0 1px 3px rgba(28,26,16,0.06);
  --shadow-lg: 0 10px 30px rgba(133,77,14,0.08);
  --navbar-bg: rgba(254,252,232,0.88); --navbar-shadow: 0 1px 3px rgba(28,26,16,0.06);
  --pill-bg: #FEF9C3; --pill-text: #854D0E; --input-bg: #FEFCE8;
  --timeline-line: #E9E5C8; --hero-dot: rgba(133,77,14,0.04);
  --scrollbar-track: #FEFCE8; --scrollbar-thumb: #E9E5C8;
  --footer-bg: #FEFCE8; --modal-overlay: rgba(28,26,16,0.5);
}
[data-palette="parchment-ochre"][data-theme="dark"] {
  --bg-primary: #1C1400; --bg-secondary: #292108; --bg-card: #292108;
  --text-primary: #FEFCE8; --text-secondary: #D5C98E; --text-muted: #854D0E;
  --accent: #EAB308; --accent-light: #FACC15; --accent-cyan: #CA8A04;
  --accent-gradient: linear-gradient(135deg, #EAB308, #CA8A04);
  --border: #3D3400; --shadow: 0 1px 3px rgba(0,0,0,0.5);
  --shadow-lg: 0 10px 30px rgba(234,179,8,0.06);
  --navbar-bg: rgba(28,20,0,0.92); --navbar-shadow: 0 1px 3px rgba(0,0,0,0.5);
  --pill-bg: rgba(234,179,8,0.1); --pill-text: #FACC15; --input-bg: #292108;
  --timeline-line: #3D3400; --hero-dot: rgba(234,179,8,0.04);
  --scrollbar-track: #292108; --scrollbar-thumb: #3D3400;
  --footer-bg: #1C1400; --modal-overlay: rgba(0,0,0,0.8);
}

/* ---------- 8. Midnight Phosphor (bonus — retro green terminal) ---------- */
[data-palette="midnight-phosphor"] {
  --bg-primary: #F5F5F4; --bg-secondary: #FFFFFF; --bg-card: #FFFFFF;
  --text-primary: #1C1917; --text-secondary: #44403C; --text-muted: #78716C;
  --accent: #15803D; --accent-light: #16A34A; --accent-cyan: #166534;
  --accent-gradient: linear-gradient(135deg, #15803D, #166534);
  --border: #E7E5E4; --shadow: 0 1px 3px rgba(28,25,23,0.06);
  --shadow-lg: 0 10px 30px rgba(21,128,61,0.08);
  --navbar-bg: rgba(245,245,244,0.85); --navbar-shadow: 0 1px 3px rgba(28,25,23,0.06);
  --pill-bg: #F0FDF4; --pill-text: #15803D; --input-bg: #F5F5F4;
  --timeline-line: #D6D3D1; --hero-dot: rgba(21,128,61,0.04);
  --scrollbar-track: #F5F5F4; --scrollbar-thumb: #D6D3D1;
  --footer-bg: #F5F5F4; --modal-overlay: rgba(28,25,23,0.5);
}
[data-palette="midnight-phosphor"][data-theme="dark"] {
  --bg-primary: #020A02; --bg-secondary: #0A150A; --bg-card: #0A150A;
  --text-primary: #DCFCE7; --text-secondary: #86EFAC; --text-muted: #4ADE80;
  --accent: #22C55E; --accent-light: #4ADE80; --accent-cyan: #16A34A;
  --accent-gradient: linear-gradient(135deg, #22C55E, #16A34A);
  --border: #14291A; --shadow: 0 1px 3px rgba(0,0,0,0.6);
  --shadow-lg: 0 10px 30px rgba(34,197,94,0.06);
  --navbar-bg: rgba(2,10,2,0.95); --navbar-shadow: 0 1px 3px rgba(0,0,0,0.6);
  --pill-bg: rgba(34,197,94,0.1); --pill-text: #4ADE80; --input-bg: #0A150A;
  --timeline-line: #14291A; --hero-dot: rgba(34,197,94,0.04);
  --scrollbar-track: #0A150A; --scrollbar-thumb: #14291A;
  --footer-bg: #020A02; --modal-overlay: rgba(0,0,0,0.85);
}

/* ---------- 9. Obsidian & Copper (bonus — oxidized metal aesthetic) ---------- */
[data-palette="obsidian-copper"] {
  --bg-primary: #FAF9F6; --bg-secondary: #FFFFFF; --bg-card: #FFFFFF;
  --text-primary: #1A1614; --text-secondary: #57504A; --text-muted: #8C8279;
  --accent: #C2410C; --accent-light: #EA580C; --accent-cyan: #9A3412;
  --accent-gradient: linear-gradient(135deg, #C2410C, #9A3412);
  --border: #E8E4DF; --shadow: 0 1px 3px rgba(26,22,20,0.06);
  --shadow-lg: 0 10px 30px rgba(194,65,12,0.08);
  --navbar-bg: rgba(250,249,246,0.85); --navbar-shadow: 0 1px 3px rgba(26,22,20,0.06);
  --pill-bg: #FFF7ED; --pill-text: #C2410C; --input-bg: #F5F4F0;
  --timeline-line: #D6D0CA; --hero-dot: rgba(194,65,12,0.04);
  --scrollbar-track: #F5F4F0; --scrollbar-thumb: #D6D0CA;
  --footer-bg: #F5F4F0; --modal-overlay: rgba(26,22,20,0.5);
}
[data-palette="obsidian-copper"][data-theme="dark"] {
  --bg-primary: #0C0907; --bg-secondary: #1A1614; --bg-card: #1A1614;
  --text-primary: #F5F0EB; --text-secondary: #B8AFA6; --text-muted: #78716C;
  --accent: #FB923C; --accent-light: #FDBA74; --accent-cyan: #F97316;
  --accent-gradient: linear-gradient(135deg, #FB923C, #F97316);
  --border: #2A2420; --shadow: 0 1px 3px rgba(0,0,0,0.5);
  --shadow-lg: 0 10px 30px rgba(251,146,60,0.06);
  --navbar-bg: rgba(12,9,7,0.92); --navbar-shadow: 0 1px 3px rgba(0,0,0,0.5);
  --pill-bg: rgba(251,146,60,0.1); --pill-text: #FDBA74; --input-bg: #1A1614;
  --timeline-line: #2A2420; --hero-dot: rgba(251,146,60,0.04);
  --scrollbar-track: #1A1614; --scrollbar-thumb: #2A2420;
  --footer-bg: #0C0907; --modal-overlay: rgba(0,0,0,0.8);
}

/* ---------- 10. Electric Violet ---------- */
[data-palette="electric-violet"] {
  --bg-primary: #FAFAFE; --bg-secondary: #FFFFFF; --bg-card: #FFFFFF;
  --text-primary: #1A1025; --text-secondary: #4C3D5E; --text-muted: #8B7FA0;
  --accent: #7C3AED; --accent-light: #8B5CF6; --accent-cyan: #6D28D9;
  --accent-gradient: linear-gradient(135deg, #7C3AED, #A855F7);
  --border: #E8E3F0; --shadow: 0 1px 3px rgba(26,16,37,0.06);
  --shadow-lg: 0 10px 30px rgba(124,58,237,0.1);
  --navbar-bg: rgba(250,250,254,0.85); --navbar-shadow: 0 1px 3px rgba(26,16,37,0.06);
  --pill-bg: #F5F3FF; --pill-text: #6D28D9; --input-bg: #F5F3FF;
  --timeline-line: #DDD6F3; --hero-dot: rgba(124,58,237,0.04);
  --scrollbar-track: #F5F3FF; --scrollbar-thumb: #DDD6F3;
  --footer-bg: #F5F3FF; --modal-overlay: rgba(26,16,37,0.5);
}
[data-palette="electric-violet"][data-theme="dark"] {
  --bg-primary: #0D0717; --bg-secondary: #150E24; --bg-card: #1C1330;
  --text-primary: #EDE9FE; --text-secondary: #A78BFA; --text-muted: #6D5A8E;
  --accent: #A855F7; --accent-light: #C084FC; --accent-cyan: #8B5CF6;
  --accent-gradient: linear-gradient(135deg, #A855F7, #C084FC);
  --border: #2A1F42; --shadow: 0 1px 3px rgba(0,0,0,0.5);
  --shadow-lg: 0 10px 30px rgba(168,85,247,0.08);
  --navbar-bg: rgba(13,7,23,0.92); --navbar-shadow: 0 1px 3px rgba(0,0,0,0.5);
  --pill-bg: rgba(168,85,247,0.12); --pill-text: #C084FC; --input-bg: #1C1330;
  --timeline-line: #2A1F42; --hero-dot: rgba(168,85,247,0.04);
  --scrollbar-track: #150E24; --scrollbar-thumb: #2A1F42;
  --footer-bg: #0A0512; --modal-overlay: rgba(0,0,0,0.85);
}