/* --- Identité Financialys et surcharge des variables Bootstrap --- */
:root {
    --financialys-navy: #0d1b3d;
    --financialys-teal: #118c7e;
    --financialys-gold: #d4af37;
    --financialys-surface: #f2f4f7;
    --financialys-white: #ffffff;

    --color-primary: var(--financialys-navy);
    --color-secondary: var(--financialys-teal);
    --color-accent: var(--financialys-gold);
    --color-background: var(--financialys-surface);
    --color-text: var(--financialys-navy);

    --bs-primary: var(--color-primary);
    --bs-primary-rgb: 13, 27, 61;
    --bs-link-color-rgb: var(--bs-primary-rgb);
}

/* --- Styles généraux et conteneur --- */
body {
    background-color: var(--color-background);
    color: var(--color-text);
}

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

.form-wrapper {
    background-color: var(--financialys-white);
    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(--color-primary);
    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(--color-secondary);
    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 var(--color-secondary);
  border-radius:.5rem;
  background:var(--color-secondary);            /* 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:var(--financialys-white);
  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:var(--color-background);
}
.btn-group .btn:hover,
.btn-group input:focus-visible + .btn{
  background:var(--color-background);
}

/* sélection ------------------------------------------------------------ */
.btn-grid input[type=radio]:checked + .btn{
  background:var(--color-primary);
  color:var(--financialys-white);
}
.btn-group input[type=radio]:checked + .btn{
  background:var(--color-primary);
  color:var(--financialys-white);
}

/* Les composants Bootstrap porteurs de marque suivent la palette Financialys. */
.btn-primary {
  --bs-btn-bg: var(--color-primary);
  --bs-btn-border-color: var(--color-primary);
  --bs-btn-hover-bg: var(--color-secondary);
  --bs-btn-hover-border-color: var(--color-secondary);
  --bs-btn-active-bg: var(--color-primary);
  --bs-btn-active-border-color: var(--color-primary);
}

.btn-outline-primary {
  --bs-btn-color: var(--color-primary);
  --bs-btn-border-color: var(--color-secondary);
  --bs-btn-hover-bg: var(--color-primary);
  --bs-btn-hover-border-color: var(--color-primary);
}

.form-control:focus,
.form-select:focus,
.form-check-input:focus {
  border-color: var(--color-secondary);
  box-shadow: 0 0 0 .25rem rgba(17, 140, 126, .2);
}

.form-check-input:checked {
  background-color: var(--color-primary);
  border-color: var(--color-primary);
}

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