/* public/assets/css/jetons.css - jetons de la charte DATIVO (déclinaison de dativo.fr, assets/css/tokens.css).
 * Toute couleur, rayon ou ombre de l'application vient d'ici. L'encre est l'Emerald 900 (la couleur
 * #1F3D33 n'est pas employée, consigne du projet). Mêmes valeurs que src/Socle/Charte.php. */
/* Polices de la charte, servies par l'application (fichiers récupérés à la construction de l'image). */
@font-face { font-family: 'DM Sans'; font-weight: 400; font-display: swap; src: url('/assets/polices/dm-sans-400.woff2') format('woff2'); }
@font-face { font-family: 'DM Sans'; font-weight: 500; font-display: swap; src: url('/assets/polices/dm-sans-500.woff2') format('woff2'); }
@font-face { font-family: 'DM Sans'; font-weight: 700; font-display: swap; src: url('/assets/polices/dm-sans-700.woff2') format('woff2'); }
@font-face { font-family: 'Bricolage Grotesque'; font-weight: 600; font-display: swap; src: url('/assets/polices/bricolage-grotesque-600.woff2') format('woff2'); }
@font-face { font-family: 'Bricolage Grotesque'; font-weight: 700; font-display: swap; src: url('/assets/polices/bricolage-grotesque-700.woff2') format('woff2'); }

:root {
    --emerald-900: #193828;
    --emerald-800: #264C38;
    --emerald-700: #37664D;
    --emerald-500: #4E7F65;
    --emerald-100: #CAEBD9;
    --emerald-50:  #E4F7ED;
    --primaire: var(--emerald-500);
    --primaire-survol: var(--emerald-700);
    --encre: var(--emerald-900);
    --tender: #157F77;
    --mint: #B7DDD2;
    --dew: #DCF1E0;
    --terra-cta: #BC5A0A;
    --blanc: #FFFFFF;
    --fond: #F3F6F4;
    --gris-100: #F3F4F6;
    --gris-200: #E5E7EB;
    --gris-500: #6B7280;
    --gris-600: #4B5563;
    --succes: #047857;
    --erreur: #B91C1C;
    --alerte: #B45309;

    --police-titres: 'Bricolage Grotesque', system-ui, sans-serif;
    --police-texte: 'DM Sans', system-ui, sans-serif;
    --police-code: ui-monospace, 'SFMono-Regular', Menlo, monospace;

    --rayon-sm: 6px;
    --rayon-md: 10px;
    --rayon-lg: 16px;
    --rayon-xl: 24px;

    --ombre-sm: 0 1px 2px rgba(25, 56, 40, 0.06);
    --ombre-md: 0 4px 12px rgba(25, 56, 40, 0.08);

    --espace-1: 0.25rem;
    --espace-2: 0.5rem;
    --espace-3: 0.75rem;
    --espace-4: 1rem;
    --espace-6: 1.5rem;
    --espace-8: 2rem;
    --espace-12: 3rem;

    --largeur-conteneur: 1120px;
}