/* =========================
 Base (dark)
 ========================= */

:root {
	--bg: #0a0c10;
	--surface: #0f141b;
	--surface-2: #101820;
	--text: #e8edf2;
	--muted: #a2adba;
	--border: #1a2430;
	
	--brand: #ef233c;
	--brand-600: #da0f2a;
	--brand-300: #ff556c;

	--glow-red: 0 0 36px rgba(239,35,60,.35), 0 0 72px rgba(239,35,60,.22);
	--glow-ink: 0 0 28px rgba(0,0,0,.55), 0 0 64px rgba(0,0,0,.45);
	
	--shadow-sm: 0 6px 24px rgba(0,0,0,.35);
	--shadow-lg: 0 18px 60px rgba(0,0,0,.55);
	
    --glass: saturate(140%) blur(16px);
	--glass-bg: rgba(15,20,27,.72);
	
	--radius: 20px;
}

/* Optional alternate palettes (inherit all but brand/glow) */
[data-theme="amethyst"] {
	--brand: #a78bfa;
	--glow-red: 0 0 36px rgba(167,139,250,.28), 0 0 72px rgba(167,139,250,.18);
}
[data-theme="emerald"] {
	--brand: #10b981;
	--glow-red: 0 0 36px rgba(16,185,129,.28), 0 0 72px rgba(16,185,129,.18);
}


/* =========================
 Light mode variables
 ========================= */

[data-theme="light"] {
	--bg: #ffffff;
	--surface: rgba(255,255,255,.70);
	--surface-2: rgba(255,255,255,.82);
	--text: #0b0f14;
	--muted: #5a6572;
	--border: rgba(10,15,20,.14);
	
	/* In light theme, route "brand red" glow to neutral ink to avoid red halos */
	--glow-ink: 0 0 24px rgba(0,0,0,.28), 0 0 52px rgba(0,0,0,.22);
	--glow-red: var(--glow-ink);
	
	--shadow-sm: 0 6px 20px rgba(0,0,0,.08);
	--shadow-lg: 0 18px 64px rgba(0,0,0,.12);
	
    --glass: saturate(140%) blur(14px);
	--glass-bg: rgba(255,255,255,.62);
}

/* =========================
 Path-specific brand accents
 ========================= */

/* Everyday Path: Rich Green */
.is-path-everyday {
	--brand: #22c55e; /* brighter, richer green */
	--glow-red: 0 0 72px rgba(34,197,94,.46), 0 0 160px rgba(34,197,94,.30);
}
[data-theme="light"] .is-path-everyday {
	--glow-red: 0 0 56px rgba(34,197,94,.30), 0 0 120px rgba(34,197,94,.20);
}

/* Praxis Path: Cosmic Orange */
.is-path-praxis {
	--brand: #ff6a00;
	--glow-red: 0 0 72px rgba(255,106,0,.46), 0 0 160px rgba(255,106,0,.30);
}
[data-theme="light"] .is-path-praxis {
	--glow-red: 0 0 56px rgba(255,106,0,.30), 0 0 120px rgba(255,106,0,.20);
}

/* Alchemy Path: Gold */
.is-path-alchemy {
	--brand: #ffbf00;
	--glow-red: 0 0 72px rgba(255,191,0,.46), 0 0 160px rgba(255,191,0,.30);
}
[data-theme="light"] .is-path-alchemy {
	--glow-red: 0 0 56px rgba(255,191,0,.30), 0 0 120px rgba(255,191,0,.20);
}

/* Astrology Path: Electric Blue */
.is-path-astrology {
	--brand: #38bdf8;
	--glow-red: 0 0 72px rgba(56,189,248,.46), 0 0 160px rgba(56,189,248,.30);
}
[data-theme="light"] .is-path-astrology {
	--glow-red: 0 0 56px rgba(56,189,248,.30), 0 0 120px rgba(56,189,248,.20);
}

/* Tarot Path: Amethyst */
.is-path-tarot {
	--brand: #a78bfa;
	--glow-red: 0 0 72px rgba(167,139,250,.46), 0 0 160px rgba(167,139,250,.30);
}
[data-theme="light"] .is-path-tarot {
	--glow-red: 0 0 56px rgba(167,139,250,.30), 0 0 120px rgba(167,139,250,.20);
}

/* Per-element Path accents (for individual cards/blocks) */
.path-accent-everyday { --brand:#22c55e; --glow-red: 0 0 72px rgba(34,197,94,.46), 0 0 160px rgba(34,197,94,.30); }
.path-accent-praxis   { --brand:#ff6a00; --glow-red: 0 0 72px rgba(255,106,0,.46), 0 0 160px rgba(255,106,0,.30); }
.path-accent-alchemy  { --brand:#ffbf00; --glow-red: 0 0 72px rgba(255,191,0,.46), 0 0 160px rgba(255,191,0,.30); }
.path-accent-astrology{ --brand:#38bdf8; --glow-red: 0 0 72px rgba(56,189,248,.46), 0 0 160px rgba(56,189,248,.30); }
.path-accent-tarot    { --brand:#a78bfa; --glow-red: 0 0 72px rgba(167,139,250,.46), 0 0 160px rgba(167,139,250,.30); }
[data-theme="light"] .path-accent-everyday { --glow-red: 0 0 56px rgba(34,197,94,.30), 0 0 120px rgba(34,197,94,.20); }
[data-theme="light"] .path-accent-praxis   { --glow-red: 0 0 56px rgba(255,106,0,.30), 0 0 120px rgba(255,106,0,.20); }
[data-theme="light"] .path-accent-alchemy  { --glow-red: 0 0 56px rgba(255,191,0,.30), 0 0 120px rgba(255,191,0,.20); }
[data-theme="light"] .path-accent-astrology{ --glow-red: 0 0 56px rgba(56,189,248,.30), 0 0 120px rgba(56,189,248,.20); }
[data-theme="light"] .path-accent-tarot    { --glow-red: 0 0 56px rgba(167,139,250,.30), 0 0 120px rgba(167,139,250,.20); }
