:root {
    --primary_color_dark: #f1bf6f;
    --acces_rapide: #f1bf6f;
    --link_color: #f1bf6f;
    --alert_background_color: #f0be6b;
    --main_menu_color: #373737;
    --search_bar_background_color: #eeeded;
    --search_bar_button_color: #f1bf6f;
    --a-la-une_background_color: #f1bf6f;
    --title_section_color: #faf7f2;
    --taxo_tag_color: #373737;
    --taxo_tag_bgcolor: #eeeded;
    --footer_color : #373737;
    --section_color: color-mix(in srgb, var(--primary_color_dark), white 90%);
    --card_color: color-mix(in srgb, var(--primary_color_dark), white 95%);
    --focus-color: #0872f69e;
    --color_neutre: #e3e1e1;
    --text_color: #373737;
    --text_on_dark_color: #ffffff;
}

.primary-color-dark {
    color: var(--primary_color_dark);
}

.accent-color {
    color: var(--accent_color);
}

.text-color {
    color: var(--text_color);
}

.text-on-dark-color {
    color: var(--text_on_dark_color);
}

.section-color {
    color: var(--primary_color_dark);
    background-color: var(--section_color);
}

.link-color {
    color: var(--link_color);
}

.primary-background-color {
    background-color: var(--primary_color_dark);
}

.neutre-background-color {
    background-color: color-mix(in srgb, var(--color_neutre), white 40%);
}

.custom-background-color {
    /* Permet de créer un background custom pour les sections (entre autre) */
    /* Ajouter "--cbc: maCouleur" dans l'attribut "style"  */
    background-color: var(--cbc);
}

.gradient-background-color {
    background: radial-gradient(40% 10% at 50% 0%, color-mix(in srgb, var(--color_neutre), white 40%) 0%, transparent 100%)
}
