/*
 * Jetons de conception : couleurs, espacements, rayons, typographie.
 *
 * Toutes les valeurs vivent ici, les autres feuilles n'utilisent que des
 * variables. Changer l'ambiance du carnet se fait donc depuis ce seul fichier.
 *
 * La palette est volontairement chaude — terre cuite, crème, bois — plutôt que
 * le bleu applicatif habituel : c'est un carnet de cuisine, pas un tableau de
 * bord.
 */

:root {
    /* --- Couleurs, thème clair --- */
    --fond: #faf7f2;
    --fond-doux: #f2ece2;
    --carte: #ffffff;
    --bord: #e6ded1;
    --bord-fort: #d4c8b6;

    --texte: #2a2521;
    --texte-doux: #6f6559;
    --texte-faible: #9a8f80;

    --accent: #c2562c;
    --accent-fort: #a4441f;
    --accent-doux: #fbeee7;
    --sur-accent: #ffffff;

    --succes: #2f7d4f;
    --alerte: #8a6100;
    --danger: #b3261e;

    --ombre: 0 1px 2px rgb(42 37 33 / .05), 0 4px 12px rgb(42 37 33 / .05);
    --ombre-forte: 0 2px 6px rgb(42 37 33 / .08), 0 12px 28px rgb(42 37 33 / .1);

    /* --- Espacements : progression régulière --- */
    --e1: .25rem;
    --e2: .5rem;
    --e3: .75rem;
    --e4: 1rem;
    --e5: 1.5rem;
    --e6: 2rem;
    --e7: 3rem;

    /* --- Rayons --- */
    --r-petit: 6px;
    --r: 10px;
    --r-grand: 16px;
    --r-rond: 999px;

    /* --- Typographie --- */
    --police: ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
    --police-titre: ui-serif, Georgia, "Times New Roman", serif;

    --t-petit: .8125rem;
    --t-base: 1rem;
    --t-moyen: 1.125rem;
    --t-grand: 1.375rem;
    --t-titre: 1.75rem;

    /* Cible tactile minimale : 44 px, seuil en deçà duquel un bouton devient
       pénible à viser au doigt sur téléphone. */
    --tactile: 44px;

    --largeur-max: 60rem;
}

/*
 * Thème sombre.
 *
 * Appliqué quand le système le demande, sauf si un choix explicite « clair » a
 * été enregistré. La règle séparée sur [data-theme="dark"] permet au réglage
 * manuel de l'emporter dans les deux sens.
 */
@media (prefers-color-scheme: dark) {
    :root:not([data-theme="light"]) {
        --fond: #1b1815;
        --fond-doux: #232019;
        --carte: #262220;
        --bord: #3a342d;
        --bord-fort: #4d453b;

        --texte: #f0ebe4;
        --texte-doux: #b3a999;
        --texte-faible: #8a7f70;

        --accent: #e8825a;
        --accent-fort: #f09a76;
        --accent-doux: #3a2820;
        --sur-accent: #1b1815;

        --succes: #6dbd8c;
        --alerte: #e0b05c;
        --danger: #ff8b82;

        --ombre: 0 1px 2px rgb(0 0 0 / .3), 0 4px 12px rgb(0 0 0 / .25);
        --ombre-forte: 0 2px 6px rgb(0 0 0 / .4), 0 12px 28px rgb(0 0 0 / .35);
    }
}

:root[data-theme="dark"] {
    --fond: #1b1815;
    --fond-doux: #232019;
    --carte: #262220;
    --bord: #3a342d;
    --bord-fort: #4d453b;

    --texte: #f0ebe4;
    --texte-doux: #b3a999;
    --texte-faible: #8a7f70;

    --accent: #e8825a;
    --accent-fort: #f09a76;
    --accent-doux: #3a2820;
    --sur-accent: #1b1815;

    --succes: #6dbd8c;
    --alerte: #e0b05c;
    --danger: #ff8b82;

    --ombre: 0 1px 2px rgb(0 0 0 / .3), 0 4px 12px rgb(0 0 0 / .25);
    --ombre-forte: 0 2px 6px rgb(0 0 0 / .4), 0 12px 28px rgb(0 0 0 / .35);
}