/* Variables CSS par défaut */
:root {
    --bg-color-1: #ffffff;
    --text-color-1: #000000;
    --bg-color-2: #f0f0f0;
    --text-color-2: #000000;
    --bg-color-3: #000000;
    --text-color-3: #ffffff;
    --bg-color-4: #1a1a1a;
    --text-color-4: #ffffff;

    --current-bg-color: var(--bg-color-1);
    --current-text-color: var(--text-color-1);
    --current-border-color: var(--text-color-1);
}

/* Couleur de texte par défaut (sera écrasée par JS) */
body {
    color: var(--current-text-color) !important;
    transition: color 1s ease-in-out !important;
}

/* Bordures dynamiques */
.dynamic-border-color {
    border-color: var(--current-border-color) !important;
    transition: border-color 1s ease-in-out !important;
}

/*transitions adoucies*/

/* -- Couleur de fond dynamique (containeur principal) */
div.u-body,
body,
[class*="dynamic-background-color-"] {
    transition: background-color 1.2s ease-in-out !important;
}

/* -- Couleur du texte (sera contrôlée par JS) */
body * {
    transition: color 1.2s ease-in-out !important;
}

/* -- Bordures dynamiques */
.dynamic-border-color {
    transition: border-color 1.2s ease-in-out !important;
}

/*Boutons*/
.btn{transition: color 0.2s ease-in-out !important;}