/* Dark Luxe - Leisenbao
 *
 * IMPORTANT: the selector is `html:root` (specificity 0,1,1), NOT `:root` (0,1,0).
 * site.css declares the same variables on `:root` and is loaded AFTER theme.css,
 * so a plain `:root` here would be silently overridden and the theme would appear
 * to do nothing. `html:root` outranks it without touching the stylesheet load
 * order, which means light themes keep their existing behaviour byte-for-byte.
 */
html:root {
    --primary: #d4a853;
    --primary-hover: #c49640;
    --primary-dark: #a97c33;
    --bg: #0f172a;
    --bg-alt: #1e293b;
    --text: #f1f5f9;
    --text-light: #94a3b8;
    --text-muted: #64748b;
    --accent: #d4a853;
    --border: #334155;
    --shadow: 0 4px 20px rgba(0,0,0,0.3);
    --radius: 8px;
    --hero-bg: linear-gradient(135deg, #0f172a, #1e293b);
    --hero-text: #f1f5f9;
    --card-bg: #1e293b;
    --card-hover: translateY(-6px);
    --footer-bg: #020617;
    --footer-text: #64748b;
    --btn-radius: 4px;
    --section-spacing: 80px;
}