/* ============================================================
   Bienvenu — Design system
   Variables CSS + reset minimal
   Thème méditerranéen par défaut
   ============================================================ */

:root {
    /* Palette principale */
    --cream:       #f5efe6;
    --ivory:       #faf6ef;
    --terracotta:  #c8593a;
    --olive:       #4a5d3a;
    --olive-deep:  #2f3d24;
    --charcoal:    #2a2520;
    --sand:        #d9c9a9;

    /* Typographies */
    --font-serif: 'Fraunces', Georgia, serif;
    --font-sans:  'Manrope', system-ui, -apple-system, sans-serif;

    /* Espacement */
    --space-xs:  0.25rem;
    --space-sm:  0.5rem;
    --space-md:  1rem;
    --space-lg:  1.5rem;
    --space-xl:  2rem;
    --space-2xl: 3rem;

    /* Rayons */
    --radius-sm:   6px;
    --radius-md:   12px;
    --radius-lg:   20px;
    --radius-full: 9999px;

    /* Ombres */
    --shadow-sm: 0 1px 3px rgba(42, 37, 32, .08);
    --shadow-md: 0 4px 12px rgba(42, 37, 32, .12);
    --shadow-lg: 0 8px 24px rgba(42, 37, 32, .16);

    /* Tokens sémantiques (overridés par les thèmes) */
    --color-bg:            var(--ivory);
    --color-surface:       #fff;
    --color-primary:       var(--terracotta);
    --color-primary-dark:  #a04428;
    --color-primary-light: #e8b4a0;
    --color-text:          var(--charcoal);
    --color-muted:         #6b6055;
    --color-border:        var(--sand);
    --color-accent:        var(--olive);
    --color-accent-dark:   var(--olive-deep);
}

/* ── Thèmes ────────────────────────────────────────────────── */
[data-theme="cotier"] {
    --color-primary:       #2a7a8c;
    --color-primary-dark:  #1d5e6d;
    --color-primary-light: #8ecfd9;
    --color-accent:        #4a8a7a;
    --color-accent-dark:   #2d6a5a;
    --color-bg:            #f0f7f9;
}
[data-theme="montagne"] {
    --color-primary:       #5a6e4a;
    --color-primary-dark:  #3d4f32;
    --color-primary-light: #b8c9a8;
    --color-accent:        #8a6a4a;
    --color-accent-dark:   #6b4e32;
    --color-bg:            #f2f0eb;
}
[data-theme="minimal"] {
    --color-primary:       #1a1a1a;
    --color-primary-dark:  #000000;
    --color-primary-light: #999999;
    --color-accent:        #555555;
    --color-accent-dark:   #333333;
    --color-bg:            #fafafa;
}
[data-theme="bord_de_mer"] {
    --color-primary:       #1e3a5f;
    --color-primary-dark:  #0f2a4a;
    --color-primary-light: #7ba7d4;
    --color-accent:        #c8a87a;
    --color-accent-dark:   #9a7850;
    --color-bg:            #f5f2ec;
}
[data-theme="toscane"] {
    --color-primary:       #c47c3a;
    --color-primary-dark:  #9a5c24;
    --color-primary-light: #e8c4a0;
    --color-accent:        #6b8a5a;
    --color-accent-dark:   #4a6a3a;
    --color-bg:            #faf4e8;
}
[data-theme="nordique"] {
    --color-primary:       #4a6a8a;
    --color-primary-dark:  #2d4f6d;
    --color-primary-light: #a8c4d8;
    --color-accent:        #8a7a6a;
    --color-accent-dark:   #6a5a4a;
    --color-bg:            #f4f6f8;
}
[data-theme="automne"] {
    --color-primary:       #8b3a3a;
    --color-primary-dark:  #6a2525;
    --color-primary-light: #d4a0a0;
    --color-accent:        #c4944a;
    --color-accent-dark:   #9a6a24;
    --color-bg:            #faf2ec;
}

/* ── Reset minimal ─────────────────────────────────────────── */
*, *::before, *::after {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

html {
    font-size: 16px;
    -webkit-text-size-adjust: 100%;
    scroll-behavior: smooth;
}

body {
    font-family: var(--font-sans);
    background-color: var(--color-bg);
    color: var(--color-text);
    line-height: 1.6;
    min-height: 100dvh;
}

img, video {
    max-width: 100%;
    display: block;
}

a { color: inherit; }

button {
    cursor: pointer;
    border: none;
    background: none;
    font: inherit;
}

/* ── Utilitaires de base ────────────────────────────────────── */
.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}