/**
 * Orsozox Liquid Glass — design tokens.
 *
 * A single source of truth for colour, blur, radius, elevation and motion.
 * Every other stylesheet consumes these variables, so retheming the whole
 * site is a one-file change.
 *
 * Colour direction: a warm, liturgical palette. Gold reads as precious and
 * matches the gold-on-dark iconography used across the site, so it carries
 * the accents, while a deep midnight blue carries the dark surfaces and the
 * ambient light behind the glass.
 *
 * @package Orsozox_Core
 */

:root {
	/* ---- Brand: liturgical gold ---- */
	--orsz-accent: #c9992f;
	--orsz-accent-alt: #e8c766;
	--orsz-accent-deep: #8a6a1a;

	/* Deep base used by dark surfaces and by gradients. */
	--orsz-ink-deep: #0b1220;
	--orsz-ink-deep-2: #16203a;

	/* Glass surface recipe. `--orsz-glass-blur` is overridden from PHP. */
	--orsz-glass-blur: 18px;
	--orsz-glass-saturate: 180%;

	/* ---- Light mode: warm ivory glass ---- */
	--orsz-glass-bg: rgba(255, 253, 247, 0.68);
	--orsz-glass-bg-strong: rgba(255, 254, 250, 0.88);
	--orsz-glass-bg-weak: rgba(255, 251, 243, 0.46);
	--orsz-glass-border: rgba(201, 153, 47, 0.30);
	--orsz-glass-edge: rgba(255, 255, 255, 0.95);
	--orsz-glass-shadow: 0 12px 34px -14px rgba(58, 44, 12, 0.26);
	--orsz-glass-shadow-lg: 0 30px 70px -26px rgba(58, 44, 12, 0.34);
	--orsz-glass-inner: inset 0 1px 0 rgba(255, 255, 255, 0.88);

	/* ---- Ink ---- */
	--orsz-ink: #1a1710;
	--orsz-ink-soft: #524c3c;
	--orsz-ink-mute: #857d6b;

	/* ---- Shapes ---- */
	--orsz-radius-xs: 10px;
	--orsz-radius-sm: 14px;
	--orsz-radius: 20px;
	--orsz-radius-lg: 28px;
	--orsz-radius-pill: 999px;

	/* ---- Motion ---- */
	--orsz-ease: cubic-bezier(0.22, 0.61, 0.36, 1);
	--orsz-ease-out: cubic-bezier(0.16, 1, 0.3, 1);
	--orsz-ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1);
	--orsz-dur-fast: 180ms;
	--orsz-dur: 320ms;
	--orsz-dur-slow: 620ms;

	/* ---- Ambient light behind the glass ---- */
	--orsz-aurora-1: rgba(201, 153, 47, 0.26);
	--orsz-aurora-2: rgba(232, 199, 102, 0.22);
	--orsz-aurora-3: rgba(96, 124, 186, 0.18);

	/* ---- Floating motes (the warm dust in the reference art) ---- */
	--orsz-mote: rgba(201, 153, 47, 0.70);
	--orsz-mote-opacity: 0.0;

	/* ---- Page backdrop ---- */
	--orsz-page-bg: #faf7f0;
}

/* ============================================================
   DARK MODE — deep midnight with gold light
   ============================================================ */

[data-orsz-theme="dark"] {
	--orsz-glass-bg: rgba(22, 32, 58, 0.58);
	--orsz-glass-bg-strong: rgba(20, 29, 52, 0.82);
	--orsz-glass-bg-weak: rgba(28, 39, 68, 0.38);
	--orsz-glass-border: rgba(232, 199, 102, 0.26);
	--orsz-glass-edge: rgba(232, 199, 102, 0.50);
	--orsz-glass-shadow: 0 14px 38px -14px rgba(0, 0, 0, 0.68);
	--orsz-glass-shadow-lg: 0 34px 78px -26px rgba(0, 0, 0, 0.76);
	--orsz-glass-inner: inset 0 1px 0 rgba(232, 199, 102, 0.18);

	--orsz-ink: #f3eee2;
	--orsz-ink-soft: #c3bdae;
	--orsz-ink-mute: #948d7e;

	--orsz-aurora-1: rgba(201, 153, 47, 0.34);
	--orsz-aurora-2: rgba(232, 199, 102, 0.24);
	--orsz-aurora-3: rgba(96, 124, 186, 0.26);

	--orsz-mote: rgba(240, 214, 140, 0.85);
	--orsz-mote-opacity: 0.75;

	--orsz-page-bg: #0b1220;
}

/* ---------- Fallback: browsers without backdrop-filter ---------- */
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
	:root {
		--orsz-glass-bg: rgba(255, 253, 247, 0.95);
		--orsz-glass-bg-strong: rgba(255, 254, 250, 0.98);
		--orsz-glass-bg-weak: rgba(255, 251, 243, 0.90);
	}
	[data-orsz-theme="dark"] {
		--orsz-glass-bg: rgba(22, 32, 58, 0.96);
		--orsz-glass-bg-strong: rgba(20, 29, 52, 0.98);
		--orsz-glass-bg-weak: rgba(28, 39, 68, 0.92);
	}
}

/* ---------- Honour reduced-motion ---------- */
@media (prefers-reduced-motion: reduce) {
	:root {
		--orsz-dur-fast: 1ms;
		--orsz-dur: 1ms;
		--orsz-dur-slow: 1ms;
	}
}