/* ── css/variables.css ── */
:root {
    /* Typographie */
    --font-display: 'Playfair Display', Georgia, serif;
    --font-body: 'DM Sans', system-ui, sans-serif;

    /* Couleurs — mode clair */
    --bg-page: #F7F5F0;
    --bg-surface: #FFFFFF;
    --bg-subtle: #F0EDE6;
    --bg-muted: #E8E4DC;

    --text-primary: #1A1916;
    --text-secondary: #6B6760;
    --text-tertiary: #9E9B96;

    --border-light: rgba(26, 25, 22, 0.08);
    --border-medium: rgba(26, 25, 22, 0.14);

    --accent: #4A3F8F;
    /* violet profond */
    --accent-light: #EAE8F7;
    --accent-mid: #9490C4;

    --danger: #A83232;
    --danger-light: #F7EBEB;

    --gold: #B8860B;
    --silver: #7A7A7A;
    --bronze: #8C5A2A;

    /* Rayons */
    --radius-sm: 6px;
    --radius-md: 10px;
    --radius-lg: 16px;
    --radius-full: 999px;

    /* Ombres */
    --shadow-card: 0 1px 3px rgba(0, 0, 0, .06), 0 4px 16px rgba(0, 0, 0, .04);
    --shadow-hover: 0 2px 8px rgba(0, 0, 0, .08), 0 8px 24px rgba(0, 0, 0, .06);

    /* Transitions */
    --transition: 0.18s ease;
}

/* ── Mode sombre ── */
@media (prefers-color-scheme: dark) {
    :root {
        --bg-page: #161512;
        --bg-surface: #1F1E1A;
        --bg-subtle: #272520;
        --bg-muted: #302E29;

        --text-primary: #F0EDE6;
        --text-secondary: #9E9B96;
        --text-tertiary: #6B6760;

        --border-light: rgba(240, 237, 230, 0.07);
        --border-medium: rgba(240, 237, 230, 0.12);

        --accent: #9490C4;
        --accent-light: #2A2740;
        --accent-mid: #6B67A8;

        --danger: #C46060;
        --danger-light: #2E1A1A;
    }
}