:root {
    /* Définition de la palette de couleurs */
    --primary-gradient: linear-gradient(30deg, #044B69 15%, #80d0c7 100%);
    --primary-color: #044B69; /* Le bleu foncé du dégradé */
    --primary-color-rgb: 4, 75, 105; /* La version RGB pour les transparences */
    --light-gray: #f4f7f6;
    --dark-text: #2c3e50;
    --bs-font-sans-serif: 'Poppins', sans-serif;
}

/* --- Structure de base et Footer collant --- */
html, body {
    height: 100%;
}
body {
    display: flex;
    flex-direction: column;
    background-color: var(--light-gray);
    font-family: var(--bs-font-sans-serif);
    color: var(--dark-text);
}
main {
    flex: 1 0 auto;
}
footer {
    flex-shrink: 0;
}

/* --- Barre de Navigation --- */
.navbar-custom {
    background-image: var(--primary-gradient);
    padding-top: 1rem;
    padding-bottom: 1rem;
}
.navbar-brand-custom {
    font-size: 2.5rem;
    font-weight: 900;
    color: #ffffff !important;
}
.nav-link-custom {
    font-size: 1rem; 
    font-weight: 500;
    color: rgba(255, 255, 255, 0.8) !important;
    transition: color 0.2s ease-in-out;
}
.nav-link-custom:hover {
    color: #ffffff !important;
}
.navbar-custom .btn {
    font-size: 1.1rem;
    font-weight: 500;
}

/* --- Conteneur Principal avec Effet de Lueur --- */
.form-container {
    max-width: 1140px;
    margin: auto;
    background: #fff;
    border-radius: 12px;
    border: 1px solid #dee2e6; /* Bordure de base subtile */
    overflow: hidden;
    position: relative; /* Nécessaire pour l'effet */

    /* On applique l'animation ici */
    /* animation: pulse-glow 3s infinite ease-in-out; */
}

/* --- Définition de l'animation "pulsante" améliorée --- */
@keyframes pulse-glow {
    0% {
        box-shadow: 0 0.5rem 1.5rem rgba(0,0,0,0.07), 0 0 0 0 rgba(var(--primary-color-rgb), 0.2);
    }
    50% {
        /* La lueur est maintenant plus large et plus visible */
        box-shadow: 0 0.5rem 2rem rgba(0,0,0,0.1), 0 0 35px 10px rgba(var(--primary-color-rgb), 0.5);
    }
    100% {
        box-shadow: 0 0.5rem 1.5rem rgba(0,0,0,0.07), 0 0 0 0 rgba(var(--primary-color-rgb), 0.2);
    }
}

.form-header {
    background-image: var(--primary-gradient);
    color: #fff;
    padding: 2rem;
    text-align: center;
}

.form-body, .tab-pane {
    padding: 1.5rem;
}
@media (min-width: 768px) {
    .form-body, .tab-pane {
        padding: 2rem 3rem;
    }
}

/* --- Style du focus pour les champs de formulaire --- */
.form-control:focus,
.form-select:focus {
    border-color: var(--primary-color);
    box-shadow: 0 0 0 0.25rem rgba(var(--primary-color-rgb), 0.25);
}

/* --- Améliorations pour la page de détail --- */
.details-header {
    background-color: var(--light-gray);
    border-radius: .5rem;
}
.nav-tabs .nav-link {
    color: var(--dark-text);
    font-weight: 500;
}
.nav-tabs .nav-link.active {
    color: var(--primary-color);
    border-color: #dee2e6 #dee2e6 #fff;
} 

/* --- Style pour Choices.js --- */
.choices__inner {
    background-color: #fff;
    border-radius: .375rem;
    border: 1px solid #ced4da;
    padding: .275rem .75rem;
    font-size: 1rem;
}
.is-focused .choices__inner {
    border-color: var(--primary-color) !important;
    box-shadow: 0 0 0 0.25rem rgba(var(--primary-color-rgb), 0.25) !important;
}
.choices__list--multiple .choices__item {
    background-color: var(--primary-color);
    border-color: var(--primary-color);
    border-radius: .375rem;
    font-weight: 500;
}
.choices__list--multiple .choices__item .choices__button {
    border-left: 1px solid rgba(255, 255, 255, 0.5);
}