/* --- Surcharge des variables de couleur Bootstrap --- */
:root {
    --primary-blue: #0067b8;
    --dark-blue: #004a87;   /* H2 */
    --light-blue: #5da9e9; /* H3 */
    
    --bs-primary: var(--primary-blue);
    --bs-primary-rgb: 0, 103, 184;
    --bs-link-color-rgb: var(--bs-primary-rgb);
}

/* --- Styles généraux et conteneur --- */
body {
    background-color: #f0f2f5; /* Un gris plus doux */
}

.form-container-wrapper {
    max-width: 900px !important;
    margin: 2.5rem auto; /* Ajoute de l'espace en haut et en bas */
}

.form-wrapper {
    background-color: #ffffff;
    padding: 3rem; /* Augmente l'espacement intérieur */
    border-radius: 1rem; /* Angles plus arrondis */
    box-shadow: 0 8px 30px rgba(0, 0, 0, 0.12); /* Ombre plus prononcée */
}

@media (max-width: 768px) {
    .form-wrapper {
        padding: 1.5rem;
    }
}

/* --- Styles des titres --- */
h1 {
    font-size: 1.75rem;
    font-weight: 600;
}
.section-title { /* H2 */
    font-size: 1.6rem;
    font-weight: 600;
    color: var(--dark-blue);
    text-align: center;
    margin-bottom: 2rem;
    padding-top: 2.5rem;
    /* border-top: 1px solid #dee2e6; */
}
.form-section:first-child .section-title {
    border-top: none;
    padding-top: 0;
}
.column-title { /* H3 */
    font-size: 1.25rem;
    font-weight: 600;
    color: var(--light-blue);
    text-align: center;
    margin-bottom: 1.5rem;
}

/* --- Correction pour les boutons radio verticaux --- */
.btn-group-vertical {
    border-radius: var(--bs-border-radius); /* Assure que le conteneur a des bords arrondis */
}
.btn-group-vertical > .btn {
    position: relative;
}
/* Retire les arrondis du haut pour tous les boutons sauf le premier */
.btn-group-vertical > .btn:not(:first-child) {
    border-top-left-radius: 0;
    border-top-right-radius: 0;
}
/* Retire les arrondis du bas pour tous les boutons sauf le dernier */
.btn-group-vertical > .btn:not(:last-child) {
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
}
/* Superpose les bordures pour qu'elles fusionnent */
.btn-group-vertical > .btn + .btn {
    margin-top: -1px;
}

/* --- Style de la liste de documents --- */
.document-list { 
    list-style-type: '✓ '; 
    padding-left: 1.5em; 
    margin: 0;
}
.document-list li { 
    margin-bottom: 0.5rem; 
}

/* --- Style pour les messages d'erreur de champ --- */
.invalid-feedback {
    display: block; /* Bootstrap le cache par défaut, on le force à s'afficher */
    width: 100%;
    margin-top: .25rem;
    font-size: .875em;
    color: var(--bs-danger);
}

/* ====================================================================== */
/*  Grille pour groupes de boutons radio                                  */
/*  – coins extérieurs arrondis                                           */
/*  – filet bleu 1 px partout (extérieur + séparation interne)            */
/*  – fonctionne desktop & mobile                                         */
/* ====================================================================== */

.btn-grid{
  /* --- neutralise Bootstrap (.btn-group) ------------------------------ */
  display:grid !important;                      /* flex -> grid             */
  flex-wrap:unset !important;
  /* --- grille --------------------------------------------------------- */
  grid-template-columns:repeat(auto-fit,minmax(130px,1fr));
  gap:1px;                                      /* trait interne             */
  /* --- cadre extérieur ------------------------------------------------ */
  border:1px solid #0d6efd;
  border-radius:.5rem;
  background:#0d6efd;                           /* couleur des filets        */
  overflow:hidden;                              /* applique le rayon         */
  position:relative;                            /* isolement z-index         */
}

@media (max-width:768px){
  .btn-grid{
    grid-template-columns:repeat(2,1fr) !important;  /* 2 colonnes fixes mob. */
  }
}

/* ---------------------------------------------------------------------- */
/*  Suppression TOTALE des bordures/marges Bootstrap sur les boutons      */
/* ---------------------------------------------------------------------- */
.btn-grid .btn{
  /* bordure Bootstrap → supprimée pour éviter doublons                */
  border:none !important;
  margin:0 !important;                     /* .btn + .btn margin-left:-1px  */
  border-radius:0 !important;              /* coins internes carrés         */

  /* — aspect ----------------------------------------------------------- */
  width:100%;
  background:#fff;
  line-height:1.3;
  padding:.6rem .75rem;
  /* font-weight:500; */
  transition:background .2s ease,color .2s ease;

  /* LIGNES AJOUTÉES POUR L'ALIGNEMENT VERTICAL */
  display: flex;
  align-items: center;
  justify-content: center;
}

/* survol / focus ------------------------------------------------------- */
.btn-grid .btn:hover,
.btn-grid input:focus-visible + .btn{
  background:#f4f8ff;
}

/* sélection ------------------------------------------------------------ */
.btn-grid input[type=radio]:checked + .btn{
  background:#0d6efd;
  color:#fff;
}

/* cache les vrais <input> --------------------------------------------- */
.btn-grid input[type=radio]{
  display:none;
}