/* theme.css */ /* Font Imports - This should be in the HTML's */ /* */ :root { /* Fonts */ --font-heading: 'Cinzel', serif; --font-body: system-ui, Roboto, sans-serif; /* Core Palette - Consolidated dark background values */ --bg-dark: #102218; /* Main dark background - synced with Tailwind background-dark */ --maladum-red: #8B0000; --accent-gold: #c5a572; --accent-green: #1b5e20; --relic-bg: #EBD9BF; /* light parchment-gold blend */ /* Surface colors for layering */ --dark-bg: #102218; /* Synced with --bg-dark for consistency */ --dark-surface: #162e21; /* Synced with Tailwind surface-dark */ --dark-surface-lighter: #1a2e24; --accent-green-hover: #2e7d32; /* Text colors */ --text-primary: rgba(255, 255, 255, 0.87); --text-secondary: rgba(255, 255, 255, 0.6); --text-light: #1a202c; /* Dark text for light backgrounds like cards */ /* Other */ --parchment: #F5E6D3; --border-ornate: #28392f; /* Synced with Tailwind border colors */ } h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 { font-family: var(--font-heading); font-weight: 700; color: var(--text-primary); } body { font-family: var(--font-body); background-color: var(--dark-bg); color: var(--text-primary); margin: 0; line-height: 1.6; } /* Basic link styling to fit the theme */ a { color: var(--accent-gold); text-decoration: none; } a:hover { color: var(--maladum-red); text-decoration: underline; }