/* =============================================================================
   LOC RÉACTION S.A.S — Version 2
   Espace client, onglet Compte : profil, lieux, proches, solde, parrainage
   et codes promo, compte professionnel, aide et support, langue, déconnexion
   ============================================================================= */
.entete-bloc { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.entete-bloc h2 { margin: 0; }

/* Libellé au-dessus de la valeur (téléphone étroit) */
.lignes-client { margin: 0; display: grid; gap: 4px; }
.lignes-client dt { color: var(--gris); font-size: 14px; margin-top: 6px; }
.lignes-client dd { margin: 0; font-weight: 500; overflow-wrap: anywhere; }

.formulaire-client { display: grid; gap: 12px; }
.formulaire-client .champ { display: grid; gap: 6px; }
.actions-client { display: flex; flex-wrap: wrap; gap: 10px; }
.actions-client .bouton { flex: 1 1 140px; }
/* Boutons aux libellés longs (« Nouvelle demande ») : l'un sous l'autre sur un
   téléphone, côte à côte quand la place le permet */
.actions-client.actions-larges .bouton { flex-basis: 200px; }

/* Lieux : domicile, travail */
.lieux-client { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.lieu-client { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px; align-items: center; padding: 12px 0; border-top: 1px solid var(--trait); }
.lieu-client:first-child { border-top: none; }
.lieu-texte { display: grid; gap: 2px; min-width: 0; }
.lieu-type { font-weight: 600; }
.lieu-adresse { overflow-wrap: anywhere; }
.lieu-precision { color: var(--gris); font-size: 14px; }
.lieu-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; }
.formulaire-lieu { padding: 14px; border-radius: var(--rayon-champ); background: var(--bitume); }
.formulaire-lieu h3 { margin: 0; font-size: 18px; font-weight: 700; }
.bouton-retirer { color: var(--rouge); }

/* Proches : nom, téléphone, lien ; actions dessous (Commander, Modifier, Retirer) */
.proche-client { grid-template-columns: minmax(0, 1fr); gap: 4px; }
.proche-client .lieu-actions { justify-content: flex-start; gap: 4px 6px; margin-left: -8px; }

/* Sous-titre dans un bloc (« Derniers mouvements », « Codes promo ») */
.sous-titre-compte { margin: 6px 0 0; font-size: 18px; font-weight: 700; }

/* Mon solde */
.solde-montant { margin: 0; font: 700 34px/1.1 var(--police-titre); letter-spacing: 0.01em; }

/* Mouvements du solde, remises des codes promo */
.mouvements-client { list-style: none; margin: 0; padding: 0; display: grid; }
.mouvement-client { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 10px; align-items: start; padding: 10px 0; border-top: 1px solid var(--trait); }
.mouvement-client:first-child { border-top: none; padding-top: 2px; }
.mouvement-texte { display: grid; gap: 2px; min-width: 0; }
.mouvement-motif { font-weight: 600; overflow-wrap: anywhere; }
.mouvement-date { color: var(--gris); font-size: 14px; }
.mouvement-course { justify-self: start; font-size: 14px; color: var(--nuit-2); }
.mouvement-montant { font-weight: 700; white-space: nowrap; }
.mouvement-client[data-sens='credit'] .mouvement-montant { color: var(--vert); }

/* Code de parrainage : grand, espacé, facile à dicter */
.code-parrainage { display: grid; gap: 2px; justify-items: start; padding: 12px 14px; border-radius: var(--rayon-champ); background: var(--bitume); }
.code-parrainage-libelle { color: var(--gris); font-size: 14px; }
.code-parrainage-valeur { font: 700 28px/1.2 var(--police-titre); letter-spacing: 0.12em; }
.code-parrain-client { display: grid; gap: 6px; }
.code-parrain-client label { font-weight: 600; }
.ligne-code { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px; }
.ligne-code .saisie { text-transform: uppercase; letter-spacing: 0.08em; }

/* Compte professionnel : un encadré par compte */
.comptes-pro-client { display: grid; gap: 10px; }
.comptes-pro-client:empty { display: none; }
.compte-pro-client { display: grid; gap: 8px; padding: 14px; border-radius: var(--rayon-champ); background: var(--bitume); }
.compte-pro-nom { margin: 0; font-size: 19px; font-weight: 700; overflow-wrap: anywhere; }
.pastille-statut-pro { flex: 0 0 auto; padding: 2px 10px; border-radius: 999px; font-weight: 600; font-size: 13px; background: #DDF3E5; color: var(--vert); }
.pastille-statut-pro[data-statut='suspendu'] { background: #FBE3E1; color: var(--rouge); }
.pro-utiliser { margin: 0; }
.pro-courses { display: grid; gap: 6px; padding-top: 6px; border-top: 1px solid var(--trait); }
.pro-courses-titre { margin: 4px 0 0; font-size: 16px; font-weight: 700; }
.pro-courses .mouvement-course { padding: 0; min-height: 32px; justify-content: flex-start; }
.mouvement-client[data-statut='annulee'] .mouvement-montant { color: var(--gris); }
.pro-sans-compte { display: grid; gap: 12px; justify-items: start; }
.pro-sans-compte[hidden] { display: none; }

/* Langue */
.choix-langue { border: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px 20px; }