/* =====================================================================
   Monlot — identité visuelle
   Chargée APRÈS socle.css (composants partagés avec DIGI-PND : volets,
   formulaires, DataTables, toasts). Ici : les couleurs, la typographie,
   la mise en page du back-office, de l'espace client et des pages publiques.
   Principes : papier chaud, filets fins, coins de 4 px, chiffres en serif ;
   la couleur vive est réservée aux actions et aux signaux.
   ===================================================================== */

:root {
    --m-encre: #17201c;
    --m-texte: #3a423e;
    --m-gris: #6c736e;
    --m-gris-clair: #a4aaa5;
    --m-bordure: #e3e0d8;
    --m-filet-fort: #17201c;
    --m-fond: #f5f3ee;
    --m-surface: #ffffff;
    --m-vert: #1f4d3e;          /* actions principales, liens */
    --m-vert-fonce: #153a2e;
    --m-vert-vif: #2f7a5f;      /* jauges, sélection */
    --m-vert-pale: #e9f1ec;
    --m-orange: #b5532c;        /* terre cuite : accent rare (compteurs, chiffre à surveiller) */
    --m-terre-pale: #f6e9e1;
    --m-menu-fond: #ffffff;
    --m-ok: #2e7d4f;      --m-ok-pale: #e8f3ec;
    --m-attention: #a85d12; --m-attention-pale: #fbf1e3;
    --m-alerte: #b42318;  --m-alerte-pale: #fbeceb;
    --m-info: #24548f;    --m-info-pale: #eaf0f8;
    --m-ombre: none;
    --m-ombre-survol: 0 1px 0 rgba(0,0,0,.02);
    --m-rayon: 4px;
    --m-menu-l: 248px;
    --m-barre-h: 60px;
    --m-police: 'Source Sans 3', 'Segoe UI', system-ui, -apple-system, sans-serif;
    --m-titre: 'Fraunces', Georgia, 'Times New Roman', serif;
}

body.immobi { background: var(--m-fond); color: var(--m-texte); font-size: 15px; }
a { color: var(--m-vert); }
:focus-visible { outline: 2px solid var(--m-vert-vif); outline-offset: 2px; }
.serif { font-family: var(--m-titre); }
.num, .chiffre { font-variant-numeric: tabular-nums; }

/* ---------- Menu latéral clair ---------- */
/* Le menu lit ses couleurs dans des variables : clair par défaut, coloré ou sombre selon les paramètres de la structure (App\Support\Theme) */
:root {
    --m-menu-texte: var(--m-texte); --m-menu-titre: var(--m-encre); --m-menu-doux: var(--m-gris); --m-menu-groupe: var(--m-gris-clair);
    --m-menu-filet: var(--m-bordure); --m-menu-survol: var(--m-fond); --m-menu-actif: var(--m-vert); --m-menu-actif-texte: #fff;
    --m-menu-marque: var(--m-vert); --m-menu-marque-texte: #fff;
}
.m-menu { top: 0; background: var(--m-menu-fond); color: var(--m-menu-texte); border-right: 1px solid var(--m-menu-filet); }
.m-marque { border-bottom: 1px solid var(--m-menu-filet); gap: 12px; }
.m-marque .x-monogramme { width: 34px; height: 34px; border-radius: 4px; background: var(--m-menu-marque); color: var(--m-menu-marque-texte); display: flex; align-items: center; justify-content: center; font-family: var(--m-titre); font-weight: 600; font-size: 15px; flex-shrink: 0; overflow: hidden; }
.m-marque .x-monogramme img { width: 100%; height: 100%; object-fit: cover; }
.m-marque strong { color: var(--m-menu-titre); font-family: var(--m-titre); font-size: 16px; letter-spacing: 0; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 160px; }
.m-marque small { color: var(--m-menu-doux); }
.m-nav-groupe { color: var(--m-menu-groupe); letter-spacing: 1px; font-size: 10.5px; padding: 18px 12px 6px; }
.m-nav a { color: var(--m-menu-texte); border-radius: 4px; padding: 8px 12px; font-size: 14.5px; }
.m-nav a i { color: var(--m-menu-doux); }
.m-nav a:hover { background: var(--m-menu-survol); color: var(--m-menu-titre); }
.m-nav a.actif { background: var(--m-menu-actif); color: var(--m-menu-actif-texte); font-weight: 600; }
.m-nav a.actif i { color: var(--m-menu-actif-texte); opacity: .85; }
.m-compteur { background: var(--m-orange); border-radius: 4px; }
.m-nav a.actif .m-compteur { background: var(--m-menu-actif-texte); color: var(--m-menu-actif); }
.m-menu-pied { border-top: 1px solid var(--m-menu-filet); color: var(--m-menu-doux); }
.m-menu-pied a { color: var(--m-menu-doux); }
body.menu-reduit .m-nav-groupe { background: var(--m-menu-filet); }

/* ---------- Barre du haut ---------- */
.m-barre { top: 0; border-bottom: 1px solid var(--m-bordure); }
.m-page { padding-top: calc(var(--m-barre-h) + 28px); }
.m-initiales { background: var(--m-vert); border-radius: 50%; }
.m-recherche input { background: var(--m-fond); border-color: transparent; }
.m-recherche input:focus { border-color: var(--m-vert); }
.x-structure-nom { display: flex; flex-direction: column; line-height: 1.15; min-width: 0; }
.x-structure-nom small { font-size: 11.5px; color: var(--m-gris); text-transform: uppercase; letter-spacing: .8px; }
.x-structure-nom strong { font-size: 14.5px; color: var(--m-encre); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.x-assistance { display: inline-flex; align-items: center; gap: 8px; padding: 4px 10px; border: 1px dashed var(--m-orange); color: var(--m-orange); border-radius: 4px; font-size: 13px; font-weight: 600; }
.x-assistance a { color: var(--m-orange); }

/* ---------- En-tête de page ---------- */
.m-entete h1 { font-family: var(--m-titre); font-weight: 500; font-size: 30px; letter-spacing: -.4px; color: var(--m-encre); }
.m-entete p { font-size: 15px; }
.m-ariane { text-transform: uppercase; letter-spacing: .8px; font-size: 11.5px; }

/* ---------- Boutons : 4 px, jamais de pilule ---------- */
.m-btn { border-radius: 4px; font-weight: 600; height: 38px; }
.m-btn-principal { background: var(--m-vert); }
.m-btn-principal:hover { background: var(--m-vert-fonce); }
.m-btn-secondaire { border-color: #cfcbc1; }
.m-btn-secondaire:hover { border-color: var(--m-encre); }
.m-btn-texte { background: none; border: none; color: var(--m-vert); font-weight: 600; padding: 0; height: auto; text-decoration: underline; text-underline-offset: 3px; cursor: pointer; font: inherit; }
.x-lien-fleche { color: var(--m-vert); font-weight: 600; text-decoration: none; white-space: nowrap; }
.x-lien-fleche::after { content: ' →'; }
.x-lien-fleche:hover { text-decoration: underline; text-underline-offset: 3px; }

/* ---------- Blocs : filet fin, pas d'ombre ---------- */
.m-bloc { border-radius: 4px; box-shadow: none; }
.m-bloc-entete { padding: 16px 20px 12px; align-items: baseline; }
.m-bloc-entete h2 { font-family: var(--m-titre); font-size: 18px; font-weight: 500; letter-spacing: -.2px; }
.m-bloc-entete .m-source { font-size: 13px; }
.m-bloc-corps { padding: 18px 20px; }

/* ---------- Statuts : point de couleur + texte, sans fond ---------- */
.m-statut { background: none !important; padding: 0; border-radius: 0; font-weight: 600; font-size: 13.5px; color: var(--m-encre); gap: 7px; }
.m-statut::before { content: ''; width: 8px; height: 8px; border-radius: 50%; background: var(--m-gris-clair); flex-shrink: 0; }
.m-statut.ok::before { background: var(--m-ok); }
.m-statut.attention::before { background: #d4881c; }
.m-statut.alerte::before { background: var(--m-alerte); }
.m-statut.alerte { color: var(--m-alerte); }
.m-statut.info::before { background: var(--m-info); }
.m-statut.neutre { color: var(--m-gris); }

/* ---------- Chiffres clés : un bandeau, des filets, des chiffres en serif ---------- */
.x-kpis { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); background: var(--m-surface); border: 1px solid var(--m-bordure); border-top: 2px solid var(--m-filet-fort); border-radius: 0 0 4px 4px; margin-bottom: 24px; }
.x-kpi { padding: 18px 20px 16px; border-left: 1px solid var(--m-bordure); min-width: 0; }
.x-kpi:first-child { border-left: none; }
.x-kpi-libelle { font-size: 12px; text-transform: uppercase; letter-spacing: .9px; color: var(--m-gris); font-weight: 600; }
.x-kpi-valeur { font-family: var(--m-titre); font-size: 34px; font-weight: 500; color: var(--m-encre); line-height: 1.1; margin: 8px 0 6px; letter-spacing: -.8px; font-variant-numeric: tabular-nums; white-space: nowrap; }
.x-kpi-valeur small { font-family: var(--m-police); font-size: 15px; font-weight: 600; color: var(--m-gris); letter-spacing: 0; margin-left: 2px; }
.x-kpi-detail { font-size: 13.5px; color: var(--m-gris); }
.x-kpi-detail b { color: var(--m-encre); font-weight: 600; }
.x-kpi.alerte .x-kpi-valeur { color: var(--m-alerte); }
.x-kpi.terre .x-kpi-valeur { color: var(--m-orange); }
.x-tendance { font-weight: 700; }
.x-tendance.hausse { color: var(--m-ok); }
.x-tendance.baisse { color: var(--m-alerte); }
.x-jauge { height: 4px; background: #ebe8e0; margin-top: 12px; position: relative; }
.x-jauge span { position: absolute; left: 0; top: 0; bottom: 0; background: var(--m-vert-vif); }
.x-kpis.cinq { grid-template-columns: repeat(5, minmax(0, 1fr)); }

/* ---------- Accueil du tableau de bord ---------- */
.x-salut { display: flex; justify-content: space-between; align-items: flex-end; gap: 20px; flex-wrap: wrap; margin-bottom: 22px; }
.x-salut h1 { margin: 0; font-family: var(--m-titre); font-weight: 400; font-size: 34px; letter-spacing: -.6px; color: var(--m-encre); line-height: 1.15; }
.x-salut h1 em { font-style: normal; font-weight: 600; }
.x-salut p { margin: 6px 0 0; color: var(--m-gris); font-size: 15px; }
.x-date { font-size: 12px; text-transform: uppercase; letter-spacing: 1px; color: var(--m-gris); margin-bottom: 6px; }

/* Lignes « libellé à gauche, nombre à droite », filet entre les lignes */
.x-lignes { list-style: none; margin: 0; padding: 0; }
.x-lignes li { display: flex; align-items: baseline; justify-content: space-between; gap: 14px; padding: 11px 0; border-top: 1px solid var(--m-bordure); font-size: 14.5px; }
.x-lignes li:first-child { border-top: none; padding-top: 0; }
.x-lignes li > span:first-child { color: var(--m-texte); min-width: 0; }
.x-lignes li small { display: block; color: var(--m-gris); font-size: 12.5px; }
.x-lignes li b { font-family: var(--m-titre); font-size: 19px; font-weight: 500; color: var(--m-encre); font-variant-numeric: tabular-nums; white-space: nowrap; }
.x-lignes li b.alerte { color: var(--m-alerte); }
.x-lignes li a { color: inherit; text-decoration: none; }
.x-lignes li a:hover b, .x-lignes li a:hover span { color: var(--m-vert); }

/* Barres de commercialisation par projet */
.x-commerce { display: flex; flex-direction: column; gap: 16px; }
.x-commerce-ligne { display: grid; grid-template-columns: minmax(0, 200px) minmax(0, 1fr) 64px; gap: 14px; align-items: center; }
.x-commerce-nom { font-size: 14.5px; color: var(--m-encre); font-weight: 600; line-height: 1.25; min-width: 0; }
.x-commerce-nom small { display: block; font-weight: 400; color: var(--m-gris); font-size: 12.5px; }
.x-commerce-piste { display: flex; height: 14px; background: #ebe8e0; overflow: hidden; }
.x-commerce-piste span { height: 100%; }
.x-commerce-piste .vendu { background: var(--m-vert); }
.x-commerce-piste .reserve { background: #8fb8a4; }
.x-commerce-piste .bloque { background: #cfcbc1; }
.x-commerce-taux { font-family: var(--m-titre); font-size: 18px; color: var(--m-encre); text-align: right; font-variant-numeric: tabular-nums; }
.x-legende { display: flex; flex-wrap: wrap; gap: 16px; font-size: 13px; color: var(--m-gris); margin-top: 16px; }
.x-legende span { display: inline-flex; align-items: center; gap: 6px; }
.x-legende i { width: 12px; height: 10px; display: inline-block; }

/* Graphique */
.x-graphique { position: relative; height: 280px; }
.x-graphique.bas { height: 220px; }

/* Listes d'activité (paiements, visites) */
.x-activite { list-style: none; margin: 0; padding: 0; }
.x-activite li { display: grid; grid-template-columns: 52px minmax(0, 1fr) auto; gap: 14px; align-items: center; padding: 12px 20px; border-top: 1px solid var(--m-bordure); }
.x-activite li:first-child { border-top: none; }
.x-jour { text-align: center; line-height: 1; }
.x-jour b { display: block; font-family: var(--m-titre); font-size: 22px; font-weight: 500; color: var(--m-encre); }
.x-jour small { font-size: 11px; text-transform: uppercase; letter-spacing: .8px; color: var(--m-gris); }
.x-activite strong { display: block; color: var(--m-encre); font-weight: 600; font-size: 14.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.x-activite span { font-size: 13px; color: var(--m-gris); }
.x-activite .x-montant { font-family: var(--m-titre); font-size: 17px; color: var(--m-encre); text-align: right; white-space: nowrap; }
.x-vide { padding: 28px 20px; text-align: center; color: var(--m-gris); font-size: 14px; }
.x-vide strong { display: block; font-family: var(--m-titre); font-weight: 500; font-size: 18px; color: var(--m-encre); margin-bottom: 4px; }

/* ---------- Tableaux ---------- */
.m-table th { background: transparent; text-transform: uppercase; letter-spacing: .7px; font-size: 11.5px; color: var(--m-gris); border-bottom: 1px solid var(--m-encre); }
.m-table td { font-size: 14.5px; }
.m-table tbody tr:hover td { background: #faf9f6; }
.m-table .x-montant { font-family: var(--m-titre); font-size: 16px; color: var(--m-encre); white-space: nowrap; }
.m-code { font-weight: 600; font-size: 13px; letter-spacing: .3px; color: var(--m-gris); }
.x-cellule-titre strong { display: block; color: var(--m-encre); font-weight: 600; }
.x-cellule-titre small { display: block; color: var(--m-gris); font-size: 12.5px; }

/* ---------- Onglets de liste (compteurs) ---------- */
.m-onglets a.actif { color: var(--m-encre); border-bottom-color: var(--m-encre); }
.m-onglets a span { font-variant-numeric: tabular-nums; }

/* ---------- Fiche détail ---------- */
.x-fiche-entete { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 20px; align-items: end; padding-bottom: 20px; margin-bottom: 24px; border-bottom: 1px solid var(--m-bordure); }
.x-fiche-entete h1 { margin: 4px 0 0; font-family: var(--m-titre); font-size: 32px; font-weight: 500; letter-spacing: -.5px; color: var(--m-encre); line-height: 1.15; }
.x-fiche-entete .x-sur { font-size: 12px; text-transform: uppercase; letter-spacing: 1px; color: var(--m-gris); font-weight: 600; }
.x-meta { display: flex; flex-wrap: wrap; gap: 6px 22px; margin-top: 10px; font-size: 14px; color: var(--m-gris); }
.x-meta span { display: inline-flex; align-items: center; gap: 6px; }
.x-meta i { font-size: 16px; }
.x-def { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 0; margin: 0; font-size: 14.5px; }
.x-def dt { color: var(--m-gris); padding: 9px 0; border-top: 1px solid var(--m-bordure); }
.x-def dd { margin: 0; padding: 9px 0; border-top: 1px solid var(--m-bordure); text-align: right; color: var(--m-encre); font-weight: 600; font-variant-numeric: tabular-nums; }
.x-def dt:first-of-type, .x-def dt:first-of-type + dd { border-top: none; }

/* Plan des lots : une case par lot, couleur = statut */
.x-plan { display: flex; flex-direction: column; gap: 18px; }
.x-ilot h3 { margin: 0 0 8px; font-size: 12px; text-transform: uppercase; letter-spacing: .9px; color: var(--m-gris); font-weight: 600; display: flex; gap: 10px; }
.x-ilot h3 span { color: var(--m-gris-clair); font-weight: 400; }
.x-cases { display: grid; grid-template-columns: repeat(auto-fill, minmax(64px, 1fr)); gap: 4px; }
.x-case { border: 1px solid var(--m-bordure); padding: 6px 7px 5px; font-size: 12px; line-height: 1.2; cursor: pointer; background: #fff; text-align: left; font: inherit; }
.x-case b { display: block; font-size: 13.5px; color: var(--m-encre); font-variant-numeric: tabular-nums; }
.x-case small { color: var(--m-gris); font-size: 11px; }
.x-case.disponible { background: #fff; border-color: #b9d3c5; }
.x-case.disponible b { color: var(--m-vert); }
.x-case.reserve { background: #fbf1e3; border-color: #ecd0a6; }
.x-case.vendu { background: var(--m-vert); border-color: var(--m-vert); }
.x-case.vendu b, .x-case.vendu small { color: #fff; }
.x-case.bloque { background: repeating-linear-gradient(45deg, #f1efe9, #f1efe9 4px, #e6e3db 4px, #e6e3db 8px); }
.x-case:hover { outline: 2px solid var(--m-encre); outline-offset: -1px; }

/* Échéancier */
.x-echeancier td { font-variant-numeric: tabular-nums; }
.x-echeancier tr.retard td { background: #fdf6f5; }
.x-progression { display: flex; align-items: center; gap: 12px; }
.x-progression .x-jauge { flex: 1; margin: 0; height: 6px; }
.x-progression b { font-family: var(--m-titre); font-size: 16px; color: var(--m-encre); }

/* Choix dans un formulaire (radios en ligne) */
.x-choix { display: flex; flex-wrap: wrap; gap: 8px; }
.x-choix label { display: inline-flex; align-items: center; gap: 8px; padding: 8px 12px; border: 1px solid #cfcbc1; border-radius: 4px; cursor: pointer; font-size: 14px; font-weight: 600; color: var(--m-encre); margin: 0; }
.x-choix input { accent-color: var(--m-vert); }
.x-choix label:has(input:checked) { border-color: var(--m-vert); background: var(--m-vert-pale); }
.x-recap { background: var(--m-fond); padding: 14px 16px; border-radius: 4px; }
.x-encart { border: 1px solid var(--m-bordure); border-left: none; padding: 14px 16px; background: #fbfaf7; font-size: 14px; }

/* =====================================================================
   PAGES PUBLIQUES ET CONNEXION
   ===================================================================== */
body.x-public { background: var(--m-fond); margin: 0; font-family: var(--m-police); color: var(--m-texte); -webkit-font-smoothing: antialiased; }
.x-public-barre { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 18px clamp(16px, 4vw, 56px); border-bottom: 1px solid var(--m-bordure); background: var(--m-fond); position: sticky; top: 0; z-index: 10; }
.x-logo { display: inline-flex; align-items: center; gap: 10px; text-decoration: none; color: var(--m-encre); }
.x-logo b { font-family: var(--m-titre); font-size: 22px; font-weight: 600; letter-spacing: -.3px; }
.x-logo i { width: 30px; height: 30px; background: var(--m-vert); display: inline-flex; align-items: center; justify-content: center; color: #fff; font-style: normal; font-family: var(--m-titre); font-weight: 600; border-radius: 4px; }
.x-public-barre nav { display: flex; align-items: center; gap: 18px; }
.x-public-barre nav a:not(.m-btn) { color: var(--m-encre); text-decoration: none; font-weight: 600; font-size: 14.5px; }

.x-hero { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); gap: clamp(24px, 5vw, 72px); padding: clamp(40px, 7vw, 96px) clamp(16px, 4vw, 56px) clamp(32px, 5vw, 64px); max-width: 1320px; margin: 0 auto; align-items: center; }
.x-hero h1 { font-family: var(--m-titre); font-weight: 400; font-size: clamp(38px, 5.4vw, 68px); line-height: 1.04; letter-spacing: -1.6px; color: var(--m-encre); margin: 0; }
.x-hero h1 em { font-style: italic; color: var(--m-vert); }
.x-hero p.x-chapeau { font-size: clamp(16px, 1.5vw, 19px); line-height: 1.55; color: var(--m-texte); margin: 22px 0 30px; max-width: 560px; }
.x-hero .m-actions { gap: 12px; }
.x-hero .m-btn { height: 46px; padding: 0 20px; font-size: 15.5px; }
.x-sur-titre { font-size: 12px; text-transform: uppercase; letter-spacing: 1.4px; color: var(--m-orange); font-weight: 700; margin-bottom: 18px; }

.x-apercu { background: var(--m-surface); border: 1px solid var(--m-bordure); border-top: 2px solid var(--m-encre); padding: 22px 24px; }
.x-apercu h3 { margin: 0 0 4px; font-family: var(--m-titre); font-weight: 500; font-size: 18px; color: var(--m-encre); }
.x-apercu > small { color: var(--m-gris); font-size: 13px; }
.x-apercu-chiffres { display: grid; grid-template-columns: 1fr 1fr; margin: 18px 0; border-top: 1px solid var(--m-bordure); }
.x-apercu-chiffres div { padding: 14px 0 12px; border-bottom: 1px solid var(--m-bordure); }
.x-apercu-chiffres div:nth-child(odd) { padding-right: 14px; border-right: 1px solid var(--m-bordure); }
.x-apercu-chiffres div:nth-child(even) { padding-left: 16px; }
.x-apercu-chiffres small { display: block; font-size: 11.5px; text-transform: uppercase; letter-spacing: .8px; color: var(--m-gris); font-weight: 600; }
.x-apercu-chiffres b { font-family: var(--m-titre); font-weight: 500; font-size: 26px; color: var(--m-encre); letter-spacing: -.5px; }

.x-bandeau { border-top: 1px solid var(--m-bordure); padding: clamp(36px, 5vw, 64px) clamp(16px, 4vw, 56px); max-width: 1320px; margin: 0 auto; }
.x-bandeau h2 { font-family: var(--m-titre); font-weight: 400; font-size: clamp(26px, 3vw, 38px); letter-spacing: -.6px; color: var(--m-encre); margin: 0 0 28px; max-width: 760px; line-height: 1.15; }
.x-colonnes { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0; border-top: 1px solid var(--m-encre); }
.x-colonnes article { padding: 22px 24px 8px 0; }
.x-colonnes article + article { padding-left: 24px; border-left: 1px solid var(--m-bordure); }
.x-colonnes .x-num { font-family: var(--m-titre); font-size: 15px; color: var(--m-orange); font-weight: 600; }
.x-colonnes h3 { font-family: var(--m-titre); font-size: 21px; font-weight: 500; color: var(--m-encre); margin: 8px 0 8px; }
.x-colonnes p { margin: 0 0 12px; line-height: 1.55; font-size: 15px; }
.x-pied-public { padding: 26px clamp(16px, 4vw, 56px); border-top: 1px solid var(--m-bordure); font-size: 13.5px; color: var(--m-gris); display: flex; justify-content: space-between; flex-wrap: wrap; gap: 12px; }

/* Connexion / inscription : panneau éditorial + formulaire */
.x-auth { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); min-height: 100vh; }
.x-auth-panneau { background: var(--m-vert); color: #e8efe9; padding: clamp(28px, 4vw, 56px); display: flex; flex-direction: column; justify-content: space-between; gap: 32px; }
.x-auth-panneau .x-logo { color: #fff; }
.x-auth-panneau .x-logo i { background: #fff; color: var(--m-vert); }
.x-auth-panneau blockquote { margin: 0; font-family: var(--m-titre); font-weight: 400; font-size: clamp(26px, 2.8vw, 40px); line-height: 1.15; letter-spacing: -.6px; color: #fff; max-width: 520px; }
.x-auth-panneau ul { list-style: none; margin: 0; padding: 0; border-top: 1px solid rgba(255,255,255,.2); max-width: 520px; }
.x-auth-panneau li { display: flex; justify-content: space-between; gap: 16px; padding: 12px 0; border-bottom: 1px solid rgba(255,255,255,.2); font-size: 14.5px; }
.x-auth-panneau li b { font-family: var(--m-titre); font-weight: 500; color: #fff; }
.x-auth-forme { display: flex; align-items: center; justify-content: center; padding: clamp(24px, 5vw, 64px) 20px; background: var(--m-fond); }
.x-auth-boite { width: 100%; max-width: 440px; }
.x-auth-boite.large { max-width: 620px; }
.x-auth-boite h1 { font-family: var(--m-titre); font-weight: 500; font-size: 32px; letter-spacing: -.5px; color: var(--m-encre); margin: 0 0 6px; }
.x-auth-boite > p { color: var(--m-gris); margin: 0 0 26px; }
.x-auth-boite .m-champ { margin-bottom: 16px; }
.x-auth-boite .m-input, .x-auth-boite select.m-input { height: 44px; font-size: 15.5px; }
.x-auth-boite .m-btn { height: 46px; width: 100%; justify-content: center; font-size: 15.5px; }
.x-auth-pied { margin-top: 22px; padding-top: 18px; border-top: 1px solid var(--m-bordure); font-size: 14px; color: var(--m-gris); }
.x-etapes-form { display: flex; gap: 0; margin-bottom: 22px; border-bottom: 1px solid var(--m-bordure); }
.x-etapes-form span { padding: 0 0 10px; margin-right: 22px; font-size: 13px; font-weight: 600; color: var(--m-gris-clair); border-bottom: 2px solid transparent; margin-bottom: -1px; }
.x-etapes-form span.actif { color: var(--m-encre); border-bottom-color: var(--m-encre); }
.x-sous-titre-form { font-family: var(--m-titre); font-size: 17px; font-weight: 500; color: var(--m-encre); margin: 6px 0 12px; }
.x-alerte-form { padding: 12px 14px; border: 1px solid #efc9c5; background: var(--m-alerte-pale); color: #7a1b14; border-radius: 4px; margin-bottom: 16px; font-size: 14px; }
.x-ok-form { padding: 12px 14px; border: 1px solid #bfdcc9; background: var(--m-ok-pale); color: #1d4d31; border-radius: 4px; margin-bottom: 16px; font-size: 14px; }
.m-input { display: block; width: 100%; height: 40px; padding: 0 12px; border: 1px solid #cfcbc1; border-radius: 4px; background: #fff; font: inherit; font-size: 15px; color: var(--m-encre); }
select.m-input { padding-right: 32px; }
.m-champ label { font-size: 13.5px; }
.m-champ .m-aide { font-size: 12.5px; }

/* Catalogue public d'une structure */
.x-cat-entete { max-width: 1240px; margin: 0 auto; padding: clamp(32px, 5vw, 64px) clamp(16px, 4vw, 40px) 24px; }
.x-cat-entete h1 { font-family: var(--m-titre); font-weight: 400; font-size: clamp(34px, 4.5vw, 56px); letter-spacing: -1.2px; color: var(--m-encre); margin: 0 0 12px; line-height: 1.05; }
.x-cat-entete p { max-width: 720px; font-size: 17px; line-height: 1.55; margin: 0; }
.x-cat-grille { max-width: 1240px; margin: 0 auto; padding: 8px clamp(16px, 4vw, 40px) 64px; display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: 24px; }
.x-projet-carte { background: var(--m-surface); border: 1px solid var(--m-bordure); display: flex; flex-direction: column; text-decoration: none; color: inherit; }
.x-projet-visuel { aspect-ratio: 16 / 9; background: #dfe7e1; position: relative; overflow: hidden; }
.x-projet-visuel img { width: 100%; height: 100%; object-fit: cover; display: block; }
.x-projet-visuel .x-plan-mini { position: absolute; inset: 14px; display: grid; grid-template-columns: repeat(12, 1fr); gap: 3px; align-content: center; }
.x-projet-visuel .x-plan-mini i { aspect-ratio: 1; background: rgba(31, 77, 62, .18); }
.x-projet-visuel .x-plan-mini i.v { background: var(--m-vert); }
.x-projet-visuel .x-plan-mini i.r { background: #d9b37e; }
.x-projet-corps { padding: 18px 20px 20px; display: flex; flex-direction: column; gap: 8px; flex: 1; }
.x-projet-corps h2 { font-family: var(--m-titre); font-weight: 500; font-size: 22px; margin: 0; color: var(--m-encre); letter-spacing: -.3px; }
.x-projet-corps .x-lieu { font-size: 14px; color: var(--m-gris); }
.x-projet-chiffres { display: flex; gap: 0; margin-top: auto; border-top: 1px solid var(--m-bordure); padding-top: 12px; }
.x-projet-chiffres div { flex: 1; }
.x-projet-chiffres div + div { border-left: 1px solid var(--m-bordure); padding-left: 14px; }
.x-projet-chiffres small { display: block; font-size: 11px; text-transform: uppercase; letter-spacing: .8px; color: var(--m-gris); font-weight: 600; }
.x-projet-chiffres b { font-family: var(--m-titre); font-weight: 500; font-size: 19px; color: var(--m-encre); }

/* =====================================================================
   ESPACE CLIENT : léger, une action par écran, téléphone d'abord
   ===================================================================== */
body.x-client { background: var(--m-fond); margin: 0; font-family: var(--m-police); color: var(--m-texte); -webkit-font-smoothing: antialiased; }
.c-entete { position: sticky; top: 0; z-index: 30; background: var(--m-surface); border-bottom: 1px solid var(--m-bordure); }
.c-entete-int { max-width: 1120px; margin: 0 auto; padding: 0 20px; height: 64px; display: flex; align-items: center; gap: 22px; }
.c-entete nav { display: flex; gap: 4px; margin-left: 12px; }
.c-entete nav a { color: var(--m-texte); text-decoration: none; font-weight: 600; font-size: 14.5px; padding: 8px 12px; border-radius: 4px; }
.c-entete nav a:hover { background: var(--m-fond); color: var(--m-encre); }
.c-entete nav a.actif { color: var(--m-encre); box-shadow: inset 0 -2px 0 var(--m-encre); border-radius: 0; }
.c-droite { margin-left: auto; display: flex; align-items: center; gap: 10px; }
.c-structure { display: flex; align-items: center; gap: 10px; padding: 6px 10px 6px 6px; border: 1px solid var(--m-bordure); border-radius: 4px; background: #fff; font: inherit; cursor: pointer; min-width: 0; }
.c-structure .x-monogramme { width: 28px; height: 28px; border-radius: 4px; background: var(--m-vert); color: #fff; display: inline-flex; align-items: center; justify-content: center; font-family: var(--m-titre); font-weight: 600; font-size: 13px; }
.c-structure span { font-size: 13.5px; font-weight: 600; color: var(--m-encre); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 180px; }
.c-page { max-width: 1120px; margin: 0 auto; padding: 32px 20px 96px; }
.c-titre { font-family: var(--m-titre); font-weight: 400; font-size: clamp(28px, 4vw, 40px); letter-spacing: -.8px; color: var(--m-encre); margin: 0 0 6px; line-height: 1.1; }
.c-sous { color: var(--m-gris); margin: 0 0 26px; font-size: 15.5px; }

.c-solde { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr); background: var(--m-surface); border: 1px solid var(--m-bordure); border-top: 2px solid var(--m-encre); margin-bottom: 24px; }
.c-solde-principal { padding: 26px 28px; }
.c-solde-principal small { font-size: 12px; text-transform: uppercase; letter-spacing: 1px; color: var(--m-gris); font-weight: 700; }
.c-solde-principal .c-gros { font-family: var(--m-titre); font-size: clamp(40px, 6vw, 60px); font-weight: 400; letter-spacing: -1.6px; color: var(--m-encre); line-height: 1.05; margin: 10px 0 14px; font-variant-numeric: tabular-nums; }
.c-solde-principal .c-gros small { font-family: var(--m-police); font-size: 18px; letter-spacing: 0; color: var(--m-gris); text-transform: none; font-weight: 600; }
.c-solde-cote { border-left: 1px solid var(--m-bordure); padding: 26px 28px; display: flex; flex-direction: column; gap: 14px; justify-content: center; }
.c-prochaine small { font-size: 12px; text-transform: uppercase; letter-spacing: 1px; color: var(--m-gris); font-weight: 700; }
.c-prochaine b { display: block; font-family: var(--m-titre); font-size: 28px; font-weight: 500; color: var(--m-encre); margin: 6px 0 2px; }
.c-prochaine span { color: var(--m-gris); font-size: 14px; }
.c-prochaine.retard b, .c-prochaine.retard span { color: var(--m-alerte); }

.c-grille { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); gap: 24px; }
.c-section-titre { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; margin: 0 0 12px; padding-bottom: 10px; border-bottom: 1px solid var(--m-encre); }
.c-section-titre h2 { margin: 0; font-family: var(--m-titre); font-weight: 500; font-size: 21px; color: var(--m-encre); letter-spacing: -.3px; }
.c-bien { display: grid; grid-template-columns: 76px minmax(0, 1fr) auto; gap: 16px; align-items: center; padding: 16px 0; border-bottom: 1px solid var(--m-bordure); text-decoration: none; color: inherit; }
.c-bien-num { width: 76px; height: 64px; background: var(--m-vert); color: #fff; display: flex; flex-direction: column; justify-content: center; align-items: center; line-height: 1.1; }
.c-bien-num small { font-size: 10.5px; text-transform: uppercase; letter-spacing: .8px; opacity: .8; }
.c-bien-num b { font-family: var(--m-titre); font-size: 22px; font-weight: 500; }
.c-bien strong { display: block; font-size: 16px; color: var(--m-encre); }
.c-bien span { font-size: 13.5px; color: var(--m-gris); }
.c-bien .x-jauge { margin-top: 8px; max-width: 280px; }
.c-bien-droite { text-align: right; }
.c-bien-droite b { display: block; font-family: var(--m-titre); font-size: 19px; color: var(--m-encre); font-weight: 500; }
.c-bien:hover strong { color: var(--m-vert); }
.c-carte { background: var(--m-surface); border: 1px solid var(--m-bordure); padding: 20px 22px; margin-bottom: 20px; }
.c-nav-mobile { display: none; }

@media (max-width: 1100px) {
    .x-kpis, .x-kpis.cinq { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .x-kpi:nth-child(odd) { border-left: none; }
    .x-kpi:nth-child(n+3) { border-top: 1px solid var(--m-bordure); }
    .x-hero { grid-template-columns: minmax(0, 1fr); }
    .x-colonnes { grid-template-columns: minmax(0, 1fr); }
    .x-colonnes article + article { padding-left: 0; border-left: none; border-top: 1px solid var(--m-bordure); }
}
@media (max-width: 860px) {
    .x-auth { grid-template-columns: minmax(0, 1fr); }
    .x-auth-panneau { padding: 22px 20px; gap: 18px; }
    .x-auth-panneau blockquote { font-size: 24px; }
    .x-auth-panneau ul { display: none; }
    .c-entete nav { display: none; }
    .c-nav-mobile { display: grid; grid-auto-flow: column; grid-auto-columns: 1fr; position: fixed; left: 0; right: 0; bottom: 0; z-index: 30; background: var(--m-surface); border-top: 1px solid var(--m-bordure); padding: 6px 4px calc(6px + env(safe-area-inset-bottom)); }
    .c-nav-mobile a { display: flex; flex-direction: column; align-items: center; gap: 2px; text-decoration: none; color: var(--m-gris); font-size: 11.5px; font-weight: 600; padding: 4px 0; }
    .c-nav-mobile a i { font-size: 22px; }
    .c-nav-mobile a.actif { color: var(--m-encre); }
    .c-solde { grid-template-columns: minmax(0, 1fr); }
    .c-solde-cote { border-left: none; border-top: 1px solid var(--m-bordure); }
    .c-grille { grid-template-columns: minmax(0, 1fr); }
    .c-structure span { max-width: 120px; }
}
@media (max-width: 640px) {
    .x-kpis, .x-kpis.cinq { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
    .x-kpi { padding: 14px 14px 12px; }
    .x-kpi-valeur { font-size: 25px; }
    .x-kpi-libelle { font-size: 10.5px; letter-spacing: .6px; }
    .x-salut h1 { font-size: 27px; }
    .m-entete h1 { font-size: 25px; }
    .x-commerce-ligne { grid-template-columns: minmax(0, 1fr) 56px; }
    .x-commerce-piste { grid-column: 1 / -1; grid-row: 2; }
    .x-fiche-entete { grid-template-columns: minmax(0, 1fr); }
    .x-fiche-entete h1 { font-size: 26px; }
    .x-public-barre nav a:not(.m-btn) { display: none; }
    .c-page { padding: 22px 16px 96px; }
    .c-solde-principal, .c-solde-cote { padding: 20px; }
    .c-bien { grid-template-columns: 60px minmax(0, 1fr); }
    .c-bien-num { width: 60px; height: 56px; }
    .c-bien-droite { grid-column: 2; text-align: left; }
    .x-activite li { padding: 12px 14px; grid-template-columns: 44px minmax(0, 1fr); }
    .x-activite .x-montant { grid-column: 2; text-align: left; }
}

/* Interrupteur (modules activables) */
.x-interrupteur { position: relative; display: inline-block; width: 40px; height: 22px; flex-shrink: 0; cursor: pointer; }
.x-interrupteur input { opacity: 0; width: 0; height: 0; position: absolute; }
.x-interrupteur span { position: absolute; inset: 0; background: #d6d2c8; border-radius: 11px; transition: background .15s; }
.x-interrupteur span::before { content: ''; position: absolute; left: 3px; top: 3px; width: 16px; height: 16px; background: #fff; border-radius: 50%; transition: transform .15s; }
.x-interrupteur input:checked + span { background: var(--m-vert); }
.x-interrupteur input:checked + span::before { transform: translateX(18px); }
.x-interrupteur input:focus-visible + span { outline: 2px solid var(--m-vert-vif); outline-offset: 2px; }

/* DataTables aux couleurs de Monlot : filets neutres, page active à l'encre */
.m-dt-haut { padding: 14px 20px; }
.m-dt .dt-buttons .m-dt-btn { border-color: #cfcbc1; color: var(--m-texte); height: 36px; font-weight: 600; font-size: 13.5px; }
.m-dt .dt-buttons .m-dt-btn:hover { background: var(--m-fond); }
.m-dt .dt-buttons .m-dt-excel i { color: var(--m-vert); }
.m-dt .dt-buttons .m-dt-pdf i { color: var(--m-orange); }
.m-dt .dataTables_filter input, .m-dt .dataTables_length select { border-color: #cfcbc1; height: 36px; }
.m-dt .dataTables_paginate .page-link { border-color: #cfcbc1; color: var(--m-texte); }
.m-dt .dataTables_paginate .page-item.active .page-link { background: var(--m-encre); border-color: var(--m-encre); }
.m-dt table.dataTable thead > tr > th.sorting_asc, .m-dt table.dataTable thead > tr > th.sorting_desc { color: var(--m-encre); }
.m-dt-bas { padding: 12px 20px; border-top: 1px solid var(--m-bordure); }
.m-dt table.dataTable > tbody > tr:last-child > td { border-bottom: none; }
.m-total { font-family: var(--m-police); font-size: .6em; font-weight: 600; color: var(--m-gris); letter-spacing: 0; vertical-align: middle; }

/* Téléphone : les lignes deviennent des cartes ; sans case à cocher, pas de marge à gauche */
@media (max-width: 640px) {
    .m-table tbody tr:not(:has(td.c-coche)) { padding-left: 16px; padding-right: 16px; }
    .m-table td[data-libelle] > .x-montant, .m-table td[data-libelle] > .m-statut { margin-left: auto; }
    .m-table td.c-actions { display: flex; justify-content: flex-end; }
    .m-dt-haut { padding: 12px 16px; gap: 10px; }
    .m-onglets { margin-left: -16px; margin-right: -16px; padding: 0 16px; }
}

/* Bouton désactivé : visiblement inactif */
.m-btn:disabled, .m-btn[disabled] { opacity: .42; cursor: not-allowed; pointer-events: none; }

/* =====================================================================
   ASSISTANT IA : historique à gauche, fil de conversation à droite
   ===================================================================== */
.ia { display: grid; grid-template-columns: 260px minmax(0, 1fr); gap: 20px; height: calc(100vh - var(--m-barre-h) - 76px); min-height: 520px; }
body.x-client .ia { height: calc(100vh - 64px - 80px); }
.ia-historique { background: var(--m-surface); border: 1px solid var(--m-bordure); padding: 14px; overflow-y: auto; }
.ia-historique-titre { font-size: 11px; text-transform: uppercase; letter-spacing: 1px; color: var(--m-gris); font-weight: 700; margin: 18px 4px 8px; }
.ia-conv { display: flex; align-items: center; gap: 4px; border-top: 1px solid var(--m-bordure); }
.ia-conv a { flex: 1; min-width: 0; padding: 9px 6px; color: var(--m-encre); text-decoration: none; font-size: 14px; line-height: 1.3; }
.ia-conv a small { display: block; color: var(--m-gris); font-size: 12px; margin-top: 2px; }
.ia-conv.actif a { font-weight: 600; }
.ia-conv.actif { box-shadow: inset 2px 0 0 var(--m-encre); }
.ia-conv .m-btn-icone { opacity: 0; }
.ia-conv:hover .m-btn-icone { opacity: 1; }
.ia-vide-liste { font-size: 13.5px; color: var(--m-gris); margin: 4px; }
.ia-fil { display: flex; flex-direction: column; min-height: 0; background: var(--m-surface); border: 1px solid var(--m-bordure); }
.ia-messages { flex: 1; overflow-y: auto; padding: 24px clamp(16px, 4vw, 48px); display: flex; flex-direction: column; gap: 18px; }
.ia-accueil { max-width: 640px; margin: auto; text-align: left; }
.ia-accueil h1 { font-family: var(--m-titre); font-weight: 400; font-size: clamp(28px, 3.4vw, 40px); letter-spacing: -.8px; color: var(--m-encre); margin: 0 0 10px; line-height: 1.1; }
.ia-accueil p { color: var(--m-gris); font-size: 15px; line-height: 1.55; margin: 0 0 22px; }
.ia-suggestions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.ia-suggestions button { text-align: left; padding: 12px 14px; border: 1px solid #cfcbc1; border-radius: 4px; background: #fff; font: inherit; font-size: 14px; color: var(--m-encre); cursor: pointer; line-height: 1.35; }
.ia-suggestions button:hover { border-color: var(--m-encre); background: var(--m-fond); }
.ia-msg { max-width: 760px; width: 100%; }
.ia-msg.user { align-self: flex-end; width: auto; max-width: min(620px, 85%); }
.ia-msg.user .ia-bulle { background: var(--m-fond); border: 1px solid var(--m-bordure); padding: 10px 14px; border-radius: 4px; white-space: pre-wrap; color: var(--m-encre); }
.ia-msg.assistant .ia-bulle { font-size: 15px; line-height: 1.6; color: var(--m-texte); border-left: 2px solid var(--m-vert); padding: 2px 0 2px 16px; }
.ia-bulle p { margin: 0 0 10px; } .ia-bulle p:last-child { margin-bottom: 0; }
.ia-bulle ul, .ia-bulle ol { margin: 0 0 10px; padding-left: 20px; } .ia-bulle li { margin-bottom: 4px; }
.ia-bulle strong { color: var(--m-encre); }
.ia-bulle table { border-collapse: collapse; margin: 6px 0 12px; font-size: 14px; display: block; overflow-x: auto; }
.ia-bulle th, .ia-bulle td { border-bottom: 1px solid var(--m-bordure); padding: 6px 10px; text-align: left; white-space: nowrap; }
.ia-bulle th { font-size: 12px; text-transform: uppercase; letter-spacing: .6px; color: var(--m-gris); border-bottom-color: var(--m-encre); }
.ia-bulle h1, .ia-bulle h2, .ia-bulle h3 { font-family: var(--m-titre); font-weight: 500; font-size: 18px; color: var(--m-encre); margin: 12px 0 6px; }
.ia-bulle blockquote { margin: 8px 0; padding: 10px 14px; background: var(--m-fond); border: 1px dashed #cfcbc1; font-style: normal; }
.ia-sources { font-size: 12.5px; color: var(--m-gris); margin: 6px 0 0 18px; }
.ia-reflexion { display: inline-flex; align-items: center; gap: 4px; color: var(--m-gris); font-size: 14px; }
.ia-reflexion span { width: 6px; height: 6px; border-radius: 50%; background: var(--m-vert); animation: ia-point 1.2s infinite ease-in-out; }
.ia-reflexion span:nth-child(2) { animation-delay: .15s; } .ia-reflexion span:nth-child(3) { animation-delay: .3s; margin-right: 6px; }
@keyframes ia-point { 0%, 80%, 100% { opacity: .25; transform: scale(.8); } 40% { opacity: 1; transform: none; } }
.ia-saisie { display: flex; gap: 10px; align-items: flex-end; padding: 14px clamp(16px, 4vw, 48px); border-top: 1px solid var(--m-bordure); }
.ia-saisie textarea { flex: 1; resize: none; min-height: 46px; max-height: 160px; padding: 12px 14px; border: 1px solid #cfcbc1; border-radius: 4px; font: inherit; font-size: 15px; color: var(--m-encre); line-height: 1.4; }
.ia-saisie textarea:focus { outline: none; border-color: var(--m-vert); box-shadow: 0 0 0 3px rgba(31, 77, 62, .12); }
.ia-saisie .m-btn { height: 46px; }
.ia-avertissement { font-size: 12px; color: var(--m-gris); margin: 0; padding: 0 clamp(16px, 4vw, 48px) 12px; }
@media (max-width: 992px) {
    .ia { grid-template-columns: minmax(0, 1fr); height: calc(100vh - var(--m-barre-h) - 56px); }
    .ia-historique { display: none; }
}
@media (max-width: 860px) { body.x-client .ia { height: calc(100vh - 64px - 130px); } }
@media (max-width: 640px) {
    .ia-suggestions { grid-template-columns: minmax(0, 1fr); }
    .ia-envoyer-texte { display: none; }
    .ia-messages { padding: 16px; }
    .ia-fil { margin: 0 -16px; border-left: none; border-right: none; }
}
/* Téléphone : une largeur minimale écrite sur un tableau ne doit jamais empêcher la mise en cartes */
@media (max-width: 640px) { .m-table[style*="min-width"] { min-width: 0 !important; } }

/* L'attribut hidden l'emporte toujours, même sur un bouton en inline-flex */
[hidden] { display: none !important; }

/* Cartes en lecture seule (fiche projet, catalogue, espace client) */
.x-carte { height: 380px; border: 1px solid var(--m-bordure); background: #dfe3df; }
.x-carte.haute { height: 460px; }
.x-carte .leaflet-container, .x-carte.leaflet-container { font-family: var(--m-police); }
.carte-etiquette { background: transparent; border: none; box-shadow: none; color: #fff; font-weight: 700; font-size: 11px; text-shadow: 0 0 3px #000; padding: 0; }
.carte-etiquette::before { display: none; }
.carte-statut { font-weight: 600; } .carte-statut::before { content: ''; display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: var(--c); margin-right: 5px; }
@media (max-width: 640px) { .x-carte, .x-carte.haute { height: 300px; } }
/* Téléphone : les boutons de l'en-tête passent à la ligne au lieu de pousser la page */
@media (max-width: 640px) {
    .m-entete > .m-actions, .x-salut > .m-actions { flex-shrink: 1; margin-left: 0; width: 100%; }
    .m-entete > .m-actions .m-btn, .x-salut > .m-actions .m-btn { flex: 1 1 auto; justify-content: center; }
}

/* ---------- Apparence de la structure (paramètres) ---------- */
.x-palettes { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; }
.x-palette { font: inherit; display: flex; flex-wrap: wrap; align-items: center; gap: 0; padding: 6px; border: 1px solid var(--m-bordure); border-radius: 4px; background: var(--m-surface); cursor: pointer; text-align: left; }
.x-palette span { height: 22px; flex: 1 1 50%; }
.x-palette span:first-child { flex-basis: 70%; border-radius: 2px 0 0 2px; }
.x-palette span:nth-child(2) { flex-basis: 30%; border-radius: 0 2px 2px 0; }
.x-palette small { flex-basis: 100%; margin-top: 5px; font-size: 12.5px; color: var(--m-texte); }
.x-palette.actif { border-color: var(--m-encre); box-shadow: inset 0 0 0 1px var(--m-encre); }
.x-couleur { height: 42px; padding: 3px 4px; cursor: pointer; }
.x-apercu-theme { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; padding: 12px; border: 1px dashed var(--m-bordure); border-radius: 4px; }
.x-logo-image { height: 34px; width: auto; max-width: 120px; object-fit: contain; }
.c-structure .x-monogramme { overflow: hidden; }
.c-structure .x-monogramme img { width: 100%; height: 100%; object-fit: cover; }
@media (max-width: 560px) { .x-palettes { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

/* ---------- Photos des personnes ---------- */
.x-avatar { width: 36px; height: 36px; border-radius: 50%; flex-shrink: 0; object-fit: cover; display: inline-flex; align-items: center; justify-content: center;
    background: var(--m-vert-pale); color: var(--m-vert); font-weight: 700; font-size: 13px; letter-spacing: .3px; border: 1px solid var(--m-bordure); }
.x-avatar.petit { width: 28px; height: 28px; font-size: 11px; }
.x-avatar.grand { width: 72px; height: 72px; font-size: 24px; font-family: var(--m-titre); font-weight: 600; }
.x-cellule-personne { display: flex; align-items: center; gap: 12px; min-width: 0; }
.x-fiche-identite { display: flex; align-items: center; gap: 18px; min-width: 0; }

/* ---------- Projets souscrits (fiche client) ---------- */
.x-projets-client { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 0; }
.x-projet-client { display: block; padding: 16px 20px; text-decoration: none; color: inherit; border-right: 1px solid var(--m-bordure); border-bottom: 1px solid var(--m-bordure); }
.x-projet-client:hover { background: var(--m-fond); }
.x-projet-client-tete { display: flex; justify-content: space-between; gap: 10px; align-items: baseline; }
.x-projet-client-tete strong { color: var(--m-encre); font-family: var(--m-titre); font-size: 17px; font-weight: 500; }
.x-projet-client small { display: block; color: var(--m-gris); font-size: 13px; margin-top: 2px; }
.x-projet-client-chiffres { display: flex; flex-wrap: wrap; gap: 4px 16px; margin-top: 8px; font-size: 13px; color: var(--m-gris); }
.x-projet-client-chiffres b { color: var(--m-encre); }
.x-projet-client-chiffres .alerte b { color: var(--m-alerte); }
@media (max-width: 640px) { .x-fiche-identite { gap: 12px; } .x-avatar.grand { width: 56px; height: 56px; font-size: 19px; } }

/* ---------- Recouvrement : retards, ancienneté, relances ---------- */
.x-jauge.alerte span { background: var(--m-alerte); }
.x-onglet-alerte { background: var(--m-alerte) !important; color: #fff !important; }
.x-tranches { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); }
.x-tranche { display: flex; flex-direction: column; gap: 4px; padding: 16px 20px; text-decoration: none; color: inherit; border-right: 1px solid var(--m-bordure); }
.x-tranche:last-child { border-right: none; }
.x-tranche:hover, .x-tranche.actif { background: var(--m-fond); }
.x-tranche.actif { box-shadow: inset 0 -2px 0 var(--m-encre); }
.x-tranche-libelle { font-size: 12px; text-transform: uppercase; letter-spacing: .8px; color: var(--m-gris); font-weight: 700; }
.x-tranche-valeur { font-family: var(--m-titre); font-size: 24px; color: var(--m-encre); }
.x-tranche-valeur small { font-size: 13px; color: var(--m-gris); }
.x-tranche-barre { height: 6px; background: #ebe8e0; position: relative; }
.x-tranche-barre span { position: absolute; inset: 0 auto 0 0; background: #d4881c; }
.x-tranche small { color: var(--m-gris); font-size: 13px; }
.t-31-60 .x-tranche-barre span, .x-jours.t-31-60 { background: #c9681a; }
.t-61-90 .x-tranche-barre span, .x-jours.t-61-90 { background: #b8441c; }
.t-90plus .x-tranche-barre span, .x-jours.t-90plus { background: var(--m-alerte); }
.x-jours { display: inline-block; padding: 2px 8px; border-radius: 4px; background: #d4881c; color: #fff; font-weight: 700; font-size: 13px; font-variant-numeric: tabular-nums; }
.x-actions-relance { display: flex; gap: 6px; flex-wrap: wrap; justify-content: flex-end; }
.x-actions-relance .bxl-whatsapp { color: #1f9d55; }
.x-filtres-retards { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin-bottom: 16px; }
.x-filtres-retards .m-input { width: auto; height: 38px; min-width: 160px; }
.x-filtres-retards input[type=search] { flex: 1; min-width: 180px; }
.x-case-cocher { display: inline-flex; align-items: center; gap: 6px; font-size: 14px; color: var(--m-texte); cursor: pointer; }
@media (max-width: 900px) {
    .x-tranches { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .x-tranche:nth-child(2) { border-right: none; }
    .x-tranche:nth-child(-n+2) { border-bottom: 1px solid var(--m-bordure); }
}
@media (max-width: 760px) {
    .x-actions-relance { justify-content: flex-start; width: 100%; }
    .x-actions-relance .m-btn { flex: 1; justify-content: center; min-height: 40px; }
    .x-filtres-retards .m-input, .x-filtres-retards input[type=search] { width: 100%; min-width: 0; flex: 1 1 100%; }
}

/* ---------- Dossier du projet (synthèse) ---------- */
.x-chiffre-dossier { font-size: 15px; color: var(--m-gris); margin-bottom: 12px; }
.x-chiffre-dossier b { font-family: var(--m-titre); font-size: 28px; font-weight: 500; color: var(--m-encre); margin-right: 4px; }
.x-chiffre-dossier span { white-space: nowrap; }
.x-barre-empilee { display: flex; height: 14px; background: #fff; border: 1px solid #b9d3c5; }
.x-barre-empilee span { height: 100%; }
.x-barre-empilee .vendu, .x-legende-chiffres i.vendu { background: var(--m-vert); }
.x-barre-empilee .reserve, .x-legende-chiffres i.reserve { background: #e6b26a; }
.x-barre-empilee .bloque, .x-legende-chiffres i.bloque { background: #c9c5bb; }
.x-legende-chiffres i.disponible { background: #fff; border: 1px solid #b9d3c5; }
.x-legende-chiffres { list-style: none; margin: 14px 0 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px 20px; }
.x-legende-chiffres li { display: flex; align-items: center; gap: 8px; font-size: 14px; color: var(--m-texte); }
.x-legende-chiffres li b { margin-left: auto; font-family: var(--m-titre); font-weight: 500; font-size: 17px; color: var(--m-encre); }
.x-legende-chiffres li.alerte b { color: var(--m-alerte); }
.x-legende-chiffres i { width: 12px; height: 12px; display: inline-block; flex-shrink: 0; }
.x-jauge.epaisse { height: 10px; margin-top: 0; }
.x-bloc-alerte { border-color: #e9c3bf; }
.x-sous-titre { margin: 18px 0 8px; font-size: 12px; text-transform: uppercase; letter-spacing: .8px; color: var(--m-gris); font-weight: 700; }
.x-retardataires { list-style: none; margin: 0; padding: 0; }
.x-retardataires li { display: flex; align-items: center; gap: 10px; padding: 8px 0; border-top: 1px solid var(--m-bordure); }
.x-retardataires li > a:first-child { display: flex; align-items: center; gap: 10px; flex: 1; min-width: 0; text-decoration: none; color: inherit; }
.x-retardataires b { display: block; color: var(--m-encre); font-size: 14.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.x-retardataires small { color: var(--m-gris); font-size: 13px; }
@media (max-width: 560px) { .x-legende-chiffres { grid-template-columns: 1fr; } }

/* ---------- Taux clés (tableaux de bord) ---------- */
.x-bloc-jauges { margin-bottom: 20px; }
.x-jauges { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); }
.x-jauge-ligne { display: block; padding: 16px 20px; border-right: 1px solid var(--m-bordure); border-bottom: 1px solid var(--m-bordure); text-decoration: none; color: inherit; margin: 0 -1px -1px 0; }
a.x-jauge-ligne:hover { background: var(--m-fond); }
.x-jauge-tete { display: flex; justify-content: space-between; align-items: baseline; gap: 10px; }
.x-jauge-tete span { font-size: 12px; text-transform: uppercase; letter-spacing: .8px; color: var(--m-gris); font-weight: 700; }
.x-jauge-tete b { font-family: var(--m-titre); font-weight: 500; font-size: 22px; color: var(--m-encre); font-variant-numeric: tabular-nums; }
.x-jauge-piste { height: 8px; background: #ebe8e0; margin: 8px 0 6px; position: relative; overflow: hidden; }
.x-jauge-piste span { position: absolute; inset: 0 auto 0 0; background: var(--m-vert-vif); transition: width .6s ease; }
.x-jauge-ligne.ok .x-jauge-piste span { background: var(--m-ok); }
.x-jauge-ligne.alerte .x-jauge-piste span { background: var(--m-alerte); }
.x-jauge-ligne.alerte .x-jauge-tete b { color: var(--m-alerte); }
.x-jauge-ligne.attention .x-jauge-piste span { background: #d4881c; }
.x-jauge-ligne small { color: var(--m-gris); font-size: 13px; }

/* ---------- Espace client : indicateurs et projets ---------- */
.c-indicateurs { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); background: #fff; border: 1px solid var(--m-bordure); border-radius: 4px; margin: 0 0 28px; }
.c-indicateur { padding: 16px 18px; border-right: 1px solid var(--m-bordure); min-width: 0; }
.c-indicateur:last-child { border-right: none; }
.c-indicateur small { display: block; font-size: 12px; text-transform: uppercase; letter-spacing: .8px; color: var(--m-gris); font-weight: 700; }
.c-indicateur b { display: block; font-family: var(--m-titre); font-weight: 500; font-size: 24px; color: var(--m-encre); margin-top: 2px; }
.c-indicateur > span { display: block; font-size: 13px; color: var(--m-gris); }
.c-indicateur.alerte b { color: var(--m-alerte); }
.c-indicateur.alerte .x-jauge-piste span { background: var(--m-alerte); }
.c-projets { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 12px; margin-bottom: 28px; }
.c-projet { background: #fff; border: 1px solid var(--m-bordure); border-radius: 4px; padding: 16px 18px; }
.c-projet small { display: block; color: var(--m-gris); font-size: 13px; margin-top: 3px; }
@media (max-width: 760px) {
    .c-indicateurs { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .c-indicateur:nth-child(2) { border-right: none; }
    .c-indicateur:nth-child(-n+2) { border-bottom: 1px solid var(--m-bordure); }
}

/* ---------- Téléphone : barre de boutons en bas, actions rapides ---------- */
.x-barre-mobile, .x-feuille, .x-feuille-voile { display: none; }
@media (max-width: 992px) {
    .x-barre-mobile { display: flex; position: fixed; left: 0; right: 0; bottom: 0; z-index: 40; background: #fff; border-top: 1px solid var(--m-bordure);
        padding: 6px 6px calc(6px + env(safe-area-inset-bottom)); justify-content: space-around; align-items: center; }
    .x-barre-mobile a, .x-barre-mobile > button { flex: 1; display: flex; flex-direction: column; align-items: center; gap: 2px; padding: 6px 2px; border: none; background: none;
        color: var(--m-gris); text-decoration: none; font: inherit; font-size: 11.5px; font-weight: 600; position: relative; min-height: 48px; cursor: pointer; border-radius: 4px; }
    .x-barre-mobile i { font-size: 23px; }
    .x-barre-mobile .actif { color: var(--m-vert); }
    .x-barre-mobile .actif::before { content: ''; position: absolute; top: -7px; left: 30%; right: 30%; height: 2px; background: var(--m-vert); }
    .x-barre-mobile em { position: absolute; top: 2px; left: 55%; background: var(--m-orange); color: #fff; font-style: normal; font-size: 10.5px; padding: 0 5px; border-radius: 4px; line-height: 16px; }
    .x-barre-mobile > .x-barre-mobile-plus { flex: 0 0 auto; width: 52px; height: 52px; min-height: 0; margin-top: -22px; border-radius: 50%; background: var(--m-vert); color: #fff;
        justify-content: center; box-shadow: 0 4px 14px rgba(0,0,0,.18); border: 3px solid #fff; }
    .x-barre-mobile-plus i { font-size: 28px; transition: transform .2s; }
    body.actions-ouvertes .x-barre-mobile-plus i { transform: rotate(45deg); }
    body.immobi .m-page, body.x-client .c-page, body.x-client main { padding-bottom: calc(84px + env(safe-area-inset-bottom)); }
    .x-feuille-voile { position: fixed; inset: 0; background: rgba(0,0,0,.35); z-index: 41; }
    body.actions-ouvertes .x-feuille-voile { display: block; }
    .x-feuille { position: fixed; left: 8px; right: 8px; bottom: calc(76px + env(safe-area-inset-bottom)); z-index: 42; background: #fff; border-radius: 4px; padding: 8px; flex-direction: column;
        border: 1px solid var(--m-bordure); box-shadow: 0 12px 32px rgba(0,0,0,.18); }
    body.actions-ouvertes .x-feuille { display: flex; }
    .x-feuille-titre { font-size: 12px; text-transform: uppercase; letter-spacing: .8px; color: var(--m-gris); font-weight: 700; padding: 8px 10px; }
    .x-feuille button, .x-feuille a { display: flex; align-items: center; gap: 14px; padding: 14px 12px; border: none; background: none; font: inherit; font-size: 16px; color: var(--m-encre);
        text-decoration: none; text-align: left; border-top: 1px solid var(--m-bordure); cursor: pointer; }
    .x-feuille i { font-size: 22px; color: var(--m-vert); }
    /* Les boutons d'en-tête restent utilisables au pouce */
    .m-actions .m-btn { min-height: 42px; }
    .m-menu { z-index: 50; }
}
@media (max-width: 992px) { body.x-client .c-entete nav { display: none; } }

/* ---------- Assistant : la voix (dictée, message vocal, conversation) ---------- */
.ia-bouton-rond { flex-shrink: 0; width: 46px; height: 46px; border-radius: 50%; border: 1px solid #cfcbc1; background: #fff; color: var(--m-encre); display: inline-flex;
    align-items: center; justify-content: center; cursor: pointer; font-size: 22px; }
.ia-bouton-rond:hover { border-color: var(--m-encre); background: var(--m-fond); }
.ia-bouton-rond.en-cours { color: var(--m-vert); border-color: var(--m-vert); animation: ia-pulse 1s ease-in-out infinite; }
.ia-bouton-vocal { display: flex; align-items: center; gap: 14px; width: 100%; margin: 0 0 14px; padding: 14px 16px; border: 1px solid var(--m-vert); border-radius: 4px;
    background: var(--m-vert-pale); color: var(--m-encre); font: inherit; text-align: left; cursor: pointer; }
.ia-bouton-vocal > i { width: 44px; height: 44px; border-radius: 50%; background: var(--m-vert); color: #fff; display: inline-flex; align-items: center; justify-content: center; font-size: 22px; flex-shrink: 0; }
.ia-bouton-vocal b { display: block; font-size: 15.5px; }
.ia-bouton-vocal small { color: var(--m-gris); font-size: 13.5px; }
.ia-bouton-vocal:hover { background: #fff; }
.ia-enregistrement { display: flex; gap: 10px; align-items: center; padding: 14px clamp(16px, 4vw, 48px); border-top: 1px solid var(--m-bordure); }
.ia-enregistrement-centre { flex: 1; display: flex; align-items: center; gap: 10px; min-width: 0; height: 46px; padding: 0 14px; border: 1px solid var(--m-alerte); border-radius: 4px; background: var(--m-alerte-pale); }
.ia-enregistrement-centre b { font-variant-numeric: tabular-nums; color: var(--m-alerte); min-width: 38px; }
.ia-point-rouge { width: 10px; height: 10px; border-radius: 50%; background: var(--m-alerte); animation: ia-clignote 1s steps(2) infinite; flex-shrink: 0; }
.ia-niveau { flex: 1; display: flex; align-items: center; gap: 3px; height: 26px; overflow: hidden; }
.ia-niveau i { flex: 1; max-width: 5px; height: 100%; background: var(--m-alerte); border-radius: 2px; transform: scaleY(.15); transition: transform .08s linear; }
@keyframes ia-clignote { 50% { opacity: .2; } }
@keyframes ia-pulse { 50% { box-shadow: 0 0 0 6px var(--m-vert-pale); } }

.ia-vocal { position: fixed; inset: 0; z-index: 90; background: var(--m-fond); display: flex; flex-direction: column; padding: 18px clamp(16px, 5vw, 48px) calc(18px + env(safe-area-inset-bottom)); }
.ia-vocal[hidden] { display: none !important; }
body.ia-vocal-ouvert { overflow: hidden; }
body.ia-vocal-ouvert .x-barre-mobile { display: none; }
.ia-vocal-haut { display: flex; justify-content: space-between; align-items: center; font-size: 12px; text-transform: uppercase; letter-spacing: 1px; color: var(--m-gris); font-weight: 700; }
.ia-vocal-fermer { width: 44px; height: 44px; border: 1px solid var(--m-bordure); border-radius: 50%; background: #fff; font-size: 24px; cursor: pointer; display: inline-flex; align-items: center; justify-content: center; }
.ia-vocal-centre { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; gap: 14px; max-width: 620px; margin: 0 auto; width: 100%; }
.ia-vocal-cercle { --niveau: 1; position: relative; width: 150px; height: 150px; display: flex; align-items: center; justify-content: center; margin-bottom: 10px; }
.ia-vocal-cercle span { position: absolute; inset: 0; border-radius: 50%; background: var(--m-vert); transform: scale(var(--niveau)); transition: transform .1s linear, background .3s; opacity: .95; }
.ia-vocal-cercle::before { content: ''; position: absolute; inset: -18px; border-radius: 50%; border: 1px solid var(--m-vert-vif); opacity: .35; transform: scale(var(--niveau)); transition: transform .15s linear; }
.ia-vocal-cercle i { position: relative; color: #fff; font-size: 54px; }
.ia-vocal-cercle[data-etat="reflexion"] span { background: var(--m-encre); transform: scale(.92); }
.ia-vocal-cercle[data-etat="parole"] span { background: var(--m-orange); animation: ia-parole 1.1s ease-in-out infinite; }
.ia-vocal-cercle[data-etat="pause"] span { background: var(--m-gris-clair); transform: scale(.9); }
@keyframes ia-parole { 0%, 100% { transform: scale(.95); } 50% { transform: scale(1.08); } }
.ia-vocal-etat { font-family: var(--m-titre); font-size: 26px; color: var(--m-encre); }
.ia-vocal-transcrit { color: var(--m-gris); font-size: 15px; font-style: italic; min-height: 22px; }
.ia-vocal-reponse { color: var(--m-encre); font-size: 17px; line-height: 1.55; max-height: 32vh; overflow-y: auto; }
.ia-vocal-bas { display: flex; gap: 10px; justify-content: center; flex-wrap: wrap; }
.ia-vocal-bas .m-btn { min-height: 48px; min-width: 130px; justify-content: center; font-size: 15.5px; }
.ia-vocal-note { text-align: center; font-size: 12.5px; color: var(--m-gris); margin: 12px 0 0; }
@media (max-width: 640px) {
    .ia-saisie { gap: 6px; padding: 10px 12px; }
    .ia-bouton-rond { width: 42px; height: 42px; font-size: 20px; }
    .ia-enregistrement { padding: 10px 12px; gap: 6px; }
    .ia-enregistrement .ia-texte-bouton { display: none; }
    .ia-enregistrement .m-btn { min-width: 44px; justify-content: center; padding: 0 12px; height: 46px; }
    .ia-vocal-cercle { width: 120px; height: 120px; }
    .ia-vocal-bas .m-btn { flex: 1; min-width: 0; }
}

/* ---------- Offres et promotions ---------- */
.x-offres-grille { display: grid; grid-template-columns: repeat(auto-fill, minmax(290px, 1fr)); gap: 18px; }
.x-offres-bandeau { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(270px, 340px); gap: 14px; overflow-x: auto; padding-bottom: 6px; margin-bottom: 28px; scroll-snap-type: x mandatory; }
.x-offres-bandeau > * { scroll-snap-align: start; }
.x-offre-carte { display: flex; flex-direction: column; background: #fff; border: 1px solid var(--m-bordure); border-radius: 4px; overflow: hidden; text-decoration: none; color: inherit; }
.x-offre-carte:hover { border-color: var(--m-encre); }
.x-offre-visuel { position: relative; aspect-ratio: 16 / 9; background: var(--m-vert); overflow: hidden; }
.x-offre-visuel.large { aspect-ratio: 21 / 9; }
.x-offre-visuel img { width: 100%; height: 100%; object-fit: cover; display: block; }
.x-offre-composition { position: absolute; inset: 0; display: flex; flex-direction: column; justify-content: flex-end; padding: 18px 20px; color: #fff;
    background: var(--m-vert); }
.x-offre-composition::before { content: ''; position: absolute; right: -40px; top: -40px; width: 180px; height: 180px; border: 1px solid rgba(255,255,255,.22); border-radius: 50%; }
.x-offre-composition::after { content: ''; position: absolute; right: 30px; top: 30px; width: 70px; height: 70px; border: 1px solid rgba(255,255,255,.18); }
.x-offre-composition small { font-size: 11.5px; text-transform: uppercase; letter-spacing: 1.2px; opacity: .85; font-weight: 700; }
.x-offre-composition b { font-family: var(--m-titre); font-weight: 500; font-size: clamp(26px, 3.2vw, 40px); line-height: 1.05; letter-spacing: -.5px; }
.x-offre-composition span { font-size: 14px; opacity: .9; margin-top: 4px; }
.x-offre-visuel.large .x-offre-composition b { font-size: clamp(32px, 5vw, 58px); }
.x-offre-pastille { position: absolute; top: 12px; left: 12px; background: var(--m-orange); color: #fff; font-weight: 700; font-size: 14px; padding: 4px 9px; border-radius: 4px; }
.x-offre-composition ~ .x-offre-pastille { display: none; }
.x-offre-une { position: absolute; top: 12px; right: 12px; background: #fff; color: var(--m-encre); font-size: 11.5px; font-weight: 700; text-transform: uppercase; letter-spacing: .8px; padding: 4px 8px; border-radius: 4px; }
.x-offre-corps { padding: 14px 16px 16px; display: flex; flex-direction: column; gap: 6px; flex: 1; }
.x-offre-etat { display: flex; justify-content: space-between; align-items: center; }
.x-offre-etat small { color: var(--m-gris); font-size: 12.5px; }
.x-offre-corps h3 { margin: 0; font-family: var(--m-titre); font-weight: 500; font-size: 19px; line-height: 1.2; color: var(--m-encre); }
.x-offre-corps p { margin: 0; color: var(--m-texte); font-size: 14px; line-height: 1.45; }
.x-offre-meta { display: flex; flex-wrap: wrap; gap: 4px 14px; margin-top: auto; padding-top: 6px; font-size: 13px; color: var(--m-gris); }
.x-offre-meta i { margin-right: 4px; }
.x-offre-stats { display: flex; gap: 14px; flex-wrap: wrap; border-top: 1px solid var(--m-bordure); margin: 8px -16px -16px; padding: 10px 16px; font-size: 13px; color: var(--m-gris); }
.x-offre-stats b { color: var(--m-encre); }
.x-offre-stats em { color: var(--m-orange); font-style: normal; font-weight: 700; }
.x-form-section { margin: 22px 0 12px; padding-bottom: 6px; border-bottom: 1px solid var(--m-bordure); font-size: 12px; text-transform: uppercase; letter-spacing: 1px; color: var(--m-gris); font-weight: 700; }
.x-form-section:first-of-type { margin-top: 4px; }
.x-offre-lots-outils { display: flex; gap: 14px; align-items: center; margin-bottom: 8px; font-size: 13.5px; color: var(--m-gris); }
.x-offre-lots-outils span { margin-right: auto; color: var(--m-encre); font-weight: 600; }
.x-lien-bouton { border: none; background: none; padding: 0; font: inherit; color: var(--m-vert); text-decoration: underline; cursor: pointer; }
.x-offre-lots { display: grid; grid-template-columns: repeat(auto-fill, minmax(78px, 1fr)); gap: 5px; max-height: 260px; overflow-y: auto; padding: 2px; }
.x-offre-lot { display: flex; flex-direction: column; padding: 6px 7px; border: 1px solid var(--m-bordure); border-radius: 4px; cursor: pointer; background: #fff; position: relative; margin: 0; }
.x-offre-lot input { position: absolute; top: 6px; right: 6px; accent-color: var(--m-vert); }
.x-offre-lot b { font-size: 13px; color: var(--m-encre); font-variant-numeric: tabular-nums; }
.x-offre-lot small { font-size: 11.5px; color: var(--m-gris); }
.x-offre-lot:has(input:checked) { border-color: var(--m-vert); background: var(--m-vert-pale); }
.x-offre-lot.indispo { opacity: .45; cursor: not-allowed; background: var(--m-fond); }
.x-offre-apercu .x-offre-visuel { border-bottom: 1px solid var(--m-bordure); }
.x-offre-apercu-titre { margin: 0 0 6px; font-family: var(--m-titre); font-weight: 500; font-size: 22px; color: var(--m-encre); }
.x-offre-conditions { list-style: none; margin: 0 0 14px; padding: 0; display: flex; flex-direction: column; gap: 8px; }
.x-offre-conditions li { display: flex; gap: 10px; align-items: flex-start; font-size: 14.5px; color: var(--m-texte); }
.x-offre-conditions i { color: var(--m-vert); font-size: 18px; margin-top: 1px; }
.x-offre-conditions b { color: var(--m-encre); }
.x-offre-detail { background: #fff; border: 1px solid var(--m-bordure); border-radius: 4px; overflow: hidden; margin-bottom: 24px; }
.x-offre-detail-corps { padding: clamp(18px, 3vw, 30px); max-width: 760px; }
.x-offre-titre { margin: 4px 0 8px; font-family: var(--m-titre); font-weight: 400; font-size: clamp(28px, 3.6vw, 40px); line-height: 1.1; letter-spacing: -.6px; color: var(--m-encre); }
.x-offre-accroche { margin: 0 0 16px; font-size: 17px; color: var(--m-texte); line-height: 1.5; }
.x-offre-urgence { display: inline-flex; align-items: center; gap: 6px; margin: 0 0 16px; padding: 6px 10px; border-radius: 4px; background: var(--m-terre-pale); color: var(--m-orange); font-weight: 700; font-size: 14px; }
.x-offre-description { margin: 0; font-size: 15px; line-height: 1.6; white-space: pre-line; color: var(--m-texte); }
.x-offre-lots-public { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 10px; margin-bottom: 24px; }
.x-offre-lot-public { background: #fff; border: 1px solid var(--m-bordure); border-radius: 4px; padding: 12px 14px; display: flex; flex-direction: column; gap: 2px; }
.x-offre-lot-public b { color: var(--m-encre); }
.x-offre-lot-public small { color: var(--m-gris); font-size: 13px; }
.x-offre-lot-public s { color: var(--m-gris); font-size: 13px; margin-top: 6px; }
.x-prix-offre { font-family: var(--m-titre); font-size: 20px; color: var(--m-vert); }
.x-offre-interet { margin-bottom: 24px; }
.x-offre-interet-titre { display: flex; align-items: center; gap: 8px; font-size: 18px; color: var(--m-encre); }
.x-bouton-large { width: 100%; justify-content: center; min-height: 50px; font-size: 16px; }
.x-offre-page { max-width: 1100px; margin: 0 auto; padding: 24px clamp(16px, 4vw, 40px) 64px; }
.x-cat-offres { max-width: 1240px; margin: 0 auto; padding: 8px clamp(16px, 4vw, 40px) 0; }
.x-cat-sous-titre { font-family: var(--m-titre); font-weight: 500; font-size: 24px; color: var(--m-encre); margin: 0 0 14px; }
.x-erreur { color: var(--m-alerte); font-size: 13px; }
.x-lien-fleche.retour::before { content: '← '; }
.x-lien-fleche.retour::after { content: none; }
@media (max-width: 640px) {
    .x-offre-visuel.large { aspect-ratio: 16 / 9; }
    .x-offres-bandeau { grid-auto-columns: 82%; }
}

/* ---------- Guidage jusqu'au terrain (plein écran) ---------- */
body.g-page { margin: 0; height: 100dvh; overflow: hidden; background: #17201c; }
.g-carte { position: fixed; inset: 0; z-index: 1; }
.g-haut { position: fixed; top: 0; left: 0; right: 0; z-index: 20; display: flex; gap: 10px; align-items: flex-start; padding: calc(10px + env(safe-area-inset-top)) 12px 0; pointer-events: none; }
.g-haut > * { pointer-events: auto; }
.g-rond { width: 46px; height: 46px; flex-shrink: 0; border-radius: 50%; border: none; background: #fff; color: var(--m-encre); display: inline-flex; align-items: center; justify-content: center;
    font-size: 24px; box-shadow: 0 2px 10px rgba(0,0,0,.2); text-decoration: none; cursor: pointer; }
.g-consigne { flex: 1; min-width: 0; display: flex; gap: 12px; align-items: center; background: var(--m-vert); color: #fff; border-radius: 4px; padding: 12px 14px; box-shadow: 0 4px 16px rgba(0,0,0,.25); }
.g-consigne > i { font-size: 38px; flex-shrink: 0; }
.g-consigne b { display: block; font-family: var(--m-titre); font-weight: 500; font-size: 22px; line-height: 1.15; }
.g-consigne span { display: block; font-size: 15px; opacity: .92; margin-top: 2px; }
body.g-arrive .g-consigne { background: var(--m-ok); }
.g-recentrer { position: fixed; right: 12px; bottom: 236px; z-index: 20; }
.g-recentrer[hidden], .g-boussole[hidden], .g-arrivee[hidden] { display: none !important; }
.g-boussole { position: fixed; right: 12px; top: calc(110px + env(safe-area-inset-top)); z-index: 20; width: 86px; height: 86px; border-radius: 50%; background: #fff; box-shadow: 0 2px 12px rgba(0,0,0,.25);
    display: flex; align-items: center; justify-content: center; }
.g-boussole span { display: inline-flex; transition: transform .3s ease-out; }
.g-boussole i { font-size: 58px; color: var(--m-orange); }
.g-bas { position: fixed; left: 0; right: 0; bottom: 0; z-index: 20; background: #fff; border-radius: 4px 4px 0 0; box-shadow: 0 -4px 20px rgba(0,0,0,.18); padding: 14px 16px calc(12px + env(safe-area-inset-bottom)); }
.g-destination { display: flex; justify-content: space-between; gap: 12px; align-items: flex-start; }
.g-destination small { display: block; font-size: 11.5px; text-transform: uppercase; letter-spacing: 1px; color: var(--m-gris); font-weight: 700; }
.g-destination b { display: block; font-family: var(--m-titre); font-weight: 500; font-size: 20px; color: var(--m-encre); }
.g-destination > div:first-child span { font-size: 13.5px; color: var(--m-gris); }
.g-chiffres { text-align: right; flex-shrink: 0; }
.g-chiffres b { font-size: 26px; color: var(--m-vert); font-variant-numeric: tabular-nums; }
.g-chiffres span { display: block; font-size: 14px; color: var(--m-gris); }
.g-avertissement { margin: 8px 0 0; padding: 6px 10px; background: var(--m-attention-pale); color: var(--m-attention); font-size: 13px; border-radius: 4px; }
.g-outils { display: flex; gap: 8px; margin-top: 12px; }
.g-modes { flex: 1; display: flex; border: 1px solid var(--m-bordure); border-radius: 4px; overflow: hidden; }
.g-modes button { flex: 1; display: flex; align-items: center; justify-content: center; gap: 6px; min-height: 44px; border: none; background: #fff; font: inherit; font-weight: 600; color: var(--m-texte); cursor: pointer; }
.g-modes button + button { border-left: 1px solid var(--m-bordure); }
.g-modes button.actif { background: var(--m-vert); color: #fff; }
.g-modes i, .g-outil i { font-size: 20px; }
.g-outil { width: 46px; min-height: 44px; border: 1px solid var(--m-bordure); border-radius: 4px; background: #fff; color: var(--m-encre); cursor: pointer; display: inline-flex; align-items: center; justify-content: center; }
.g-outil[hidden] { display: none; }
.g-pied { display: flex; justify-content: space-between; gap: 10px; flex-wrap: wrap; margin-top: 10px; font-size: 12.5px; color: var(--m-gris); }
.g-precision.faible { color: var(--m-attention); font-weight: 700; }
.g-secours a { color: var(--m-vert); font-weight: 600; }
.g-moi { background: none; border: none; }
.g-fleche { display: block; width: 34px; height: 34px; border-radius: 50%; background: #2a6fdb; border: 3px solid #fff; box-shadow: 0 0 0 6px rgba(42,111,219,.25); position: relative; transition: transform .4s ease-out; }
.g-fleche::after { content: ''; position: absolute; left: 50%; top: 3px; transform: translateX(-50%); border: 7px solid transparent; border-bottom: 11px solid #fff; border-top: 0; }
.g-cible { background: none; border: none; }
.g-cible i { font-size: 36px; color: var(--m-orange); filter: drop-shadow(0 2px 2px rgba(0,0,0,.35)); }
.g-arrivee { position: fixed; inset: 0; z-index: 30; background: rgba(23,32,28,.45); display: flex; align-items: flex-end; justify-content: center; padding: 16px 16px calc(16px + env(safe-area-inset-bottom)); }
.g-arrivee-carte { width: 100%; max-width: 460px; background: #fff; border-radius: 4px; padding: 24px 20px 18px; text-align: center; }
.g-arrivee-carte > i { font-size: 56px; color: var(--m-ok); }
.g-arrivee-carte b { display: block; font-family: var(--m-titre); font-weight: 500; font-size: 28px; color: var(--m-encre); margin: 4px 0; }
.g-arrivee-carte span { color: var(--m-gris); }
.g-arrivee-carte p { margin: 10px 0 16px; color: var(--m-texte); min-height: 20px; }
.g-arrivee-actions { display: flex; gap: 8px; }
.g-arrivee-actions .m-btn { flex: 1; justify-content: center; min-height: 48px; }
@media (min-width: 900px) {
    .g-bas { left: auto; right: 16px; bottom: 16px; width: 420px; border-radius: 4px; }
    .g-haut { right: auto; width: 520px; }
    .g-recentrer { bottom: 260px; right: 452px; }
}

/* ---------- Choix du style du menu (paramètres) ---------- */
.x-styles-menu { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; }
.x-style-menu { display: flex; flex-direction: column; gap: 6px; padding: 6px; border: 1px solid var(--m-bordure); border-radius: 4px; cursor: pointer; margin: 0; background: #fff; }
.x-style-menu input { position: absolute; opacity: 0; pointer-events: none; }
.x-style-menu.actif { border-color: var(--m-encre); box-shadow: inset 0 0 0 1px var(--m-encre); }
.x-style-menu small { font-size: 12.5px; color: var(--m-texte); text-align: center; }
.x-style-menu-mini { display: flex; flex-direction: column; gap: 4px; padding: 8px 7px; height: 64px; border-radius: 3px; border: 1px solid var(--m-bordure); }
.x-style-menu-mini i { display: block; height: 7px; border-radius: 2px; }
.x-style-menu[data-style="clair"] .x-style-menu-mini { background: #fff; }
.x-style-menu[data-style="clair"] .x-style-menu-mini i { background: #e3e0d8; }
.x-style-menu[data-style="clair"] .x-style-menu-mini i.actif { background: var(--m-vert); }
.x-style-menu[data-style="couleur"] .x-style-menu-mini { background: var(--m-vert); border-color: transparent; }
.x-style-menu[data-style="sombre"] .x-style-menu-mini { background: #1b2420; border-color: transparent; }
.x-style-menu[data-style="personnalise"] .x-style-menu-mini { background: #ece8de; border-style: dashed; border-color: #b9b3a5; }
.x-style-menu[data-style="couleur"] .x-style-menu-mini i, .x-style-menu[data-style="sombre"] .x-style-menu-mini i { background: rgba(255,255,255,.3); }
.x-style-menu[data-style="couleur"] .x-style-menu-mini i.actif, .x-style-menu[data-style="sombre"] .x-style-menu-mini i.actif { background: #fff; }
.x-style-menu[data-style="personnalise"] .x-style-menu-mini i { background: rgba(0,0,0,.15); }
#champCouleurMenu[hidden] { display: none; }
@media (max-width: 560px) { .x-styles-menu { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

/* ---------- Barre du haut aux couleurs du menu (paramètre « barre_coloree ») ----------
   Seuls les éléments posés sur la barre changent : les menus déroulants qui s'ouvrent dessous restent clairs. */
body.barre-coloree .m-barre { background: var(--m-menu-fond); border-bottom-color: var(--m-menu-filet); }
body.barre-coloree .m-barre > .m-burger { color: var(--m-menu-titre); }
body.barre-coloree .m-barre .x-structure-nom small { color: var(--m-menu-doux); }
body.barre-coloree .m-barre .x-structure-nom strong { color: var(--m-menu-titre); }
body.barre-coloree .m-barre .m-icone-btn { color: var(--m-menu-titre); }
body.barre-coloree .m-barre .m-icone-btn:hover { background: var(--m-menu-survol); }
body.barre-coloree .m-barre .m-utilisateur { border-left-color: var(--m-menu-filet); }
body.barre-coloree .m-barre .m-utilisateur strong { color: var(--m-menu-titre); }
body.barre-coloree .m-barre .m-utilisateur small, body.barre-coloree .m-barre .m-utilisateur-fleche { color: var(--m-menu-doux); }
body.barre-coloree .m-barre .m-utilisateur .m-initiales { background: var(--m-menu-marque); color: var(--m-menu-marque-texte); }
body.barre-coloree .m-barre .x-assistance { border-color: var(--m-menu-titre); color: var(--m-menu-titre); }
body.barre-coloree .m-barre .x-assistance a { color: var(--m-menu-titre); }
#champBarre[hidden] { display: none; }

/* ---------- Recherche publique des projets (portail et catalogue) ---------- */
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.x-portail-entete h1 { max-width: 820px; }
.x-portail-entete .x-recherche { margin-top: 26px; }
.x-recherche { background: #fff; border: 1px solid var(--m-bordure); border-radius: 4px; padding: 12px; margin-bottom: 24px; }
.x-recherche-ligne { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr) minmax(0, 1fr) auto; gap: 8px; }
.x-recherche select, .x-recherche input:not([type=checkbox]) { width: 100%; height: 46px; padding: 0 12px; border: 1px solid #cfcbc1; border-radius: 4px; background: #fff; font: inherit; font-size: 15px; color: var(--m-encre); }
.x-recherche-texte { position: relative; display: block; margin: 0; }
.x-recherche-texte i { position: absolute; left: 13px; top: 50%; transform: translateY(-50%); color: var(--m-gris); font-size: 19px; }
.x-recherche-texte input { padding-left: 40px !important; }
.x-recherche-ligne .m-btn { height: 46px; }
.x-recherche-plus { margin-top: 10px; }
.x-recherche-plus summary { cursor: pointer; color: var(--m-vert); font-weight: 600; font-size: 14.5px; padding: 4px 2px; list-style: none; }
.x-recherche-plus summary::before { content: '+ '; }
.x-recherche-plus[open] summary::before { content: '− '; }
.x-recherche-plus summary::-webkit-details-marker { display: none; }
.x-recherche-grille { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; padding-top: 12px; margin-top: 8px; border-top: 1px solid var(--m-bordure); }
.x-recherche-grille > label { display: flex; flex-direction: column; gap: 5px; margin: 0; font-size: 13px; font-weight: 600; color: var(--m-gris); }
.x-saisie-unite { position: relative; display: block; }
.x-saisie-unite input { padding-right: 40px !important; text-align: right; }
.x-saisie-unite em { position: absolute; right: 12px; top: 50%; transform: translateY(-50%); font-style: normal; color: var(--m-gris); font-size: 14px; }
.x-recherche-cases { grid-column: 1 / 3; display: flex; flex-wrap: wrap; gap: 8px 22px; align-items: center; }
.x-recherche-actions { display: flex; gap: 14px; align-items: center; justify-content: flex-end; }
.x-cat-offres .x-cat-grille { padding: 0 0 32px; max-width: none; }
.x-resultats-entete { display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; margin: 6px 0 16px; }
.x-resultats-entete h2 { margin: 0; font-family: var(--m-titre); font-weight: 500; font-size: 22px; color: var(--m-encre); }
.x-vues { display: flex; border: 1px solid var(--m-bordure); border-radius: 4px; overflow: hidden; background: #fff; }
.x-vues a { display: inline-flex; align-items: center; gap: 6px; padding: 8px 14px; color: var(--m-texte); text-decoration: none; font-weight: 600; font-size: 14px; }
.x-vues a + a { border-left: 1px solid var(--m-bordure); }
.x-vues a.actif { background: var(--m-vert); color: #fff; }
.x-carte-resultats { height: 460px; border: 1px solid var(--m-bordure); border-radius: 4px; margin-bottom: 20px; }
.x-projet-visuel { position: relative; }
.x-distance { position: absolute; bottom: 10px; right: 10px; background: #fff; color: var(--m-encre); font-weight: 700; font-size: 13px; padding: 3px 8px; border-radius: 4px; }
.x-promoteur { font-size: 13.5px; color: var(--m-gris); margin-top: 2px; }
.x-promoteur b { color: var(--m-texte); font-weight: 600; }
.x-vide-public { display: flex; flex-direction: column; align-items: center; gap: 8px; text-align: center; padding: 40px 20px; background: #fff; border: 1px dashed var(--m-bordure); border-radius: 4px; margin-bottom: 40px; }
.x-vide-public b { font-family: var(--m-titre); font-weight: 500; font-size: 21px; color: var(--m-encre); }
.x-vide-public span { color: var(--m-gris); }
.x-pagination { display: flex; justify-content: center; align-items: center; gap: 22px; padding: 0 0 48px; font-size: 15px; }
.x-pagination a { color: var(--m-vert); font-weight: 600; text-decoration: none; }
.x-pagination span { color: var(--m-gris-clair); }
.x-public-barre nav a.actif { color: var(--m-vert); font-weight: 700; }
@media (max-width: 900px) {
    .x-recherche-ligne { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
    .x-recherche-texte, .x-recherche-ligne .m-btn { grid-column: 1 / -1; }
    .x-recherche-ligne .m-btn { justify-content: center; }
    .x-recherche-grille { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
    .x-recherche-cases, .x-recherche-actions { grid-column: 1 / -1; }
    .x-carte-resultats { height: 380px; }
}
@media (max-width: 480px) {
    .x-recherche-grille { grid-template-columns: minmax(0, 1fr); }
    .x-recherche-actions { justify-content: space-between; }
}

/* ---------- Recherche dans l'espace client ---------- */
.c-loupe { width: 40px; height: 40px; border-radius: 4px; display: inline-flex; align-items: center; justify-content: center; color: var(--m-encre); font-size: 22px; text-decoration: none; border: 1px solid var(--m-bordure); background: #fff; }
.c-loupe.actif, .c-loupe:hover { border-color: var(--m-encre); }
.c-recherche-rapide { position: relative; display: flex; gap: 8px; margin: 0 0 24px; }
.c-recherche-rapide i { position: absolute; left: 13px; top: 50%; transform: translateY(-50%); color: var(--m-gris); font-size: 19px; }
.c-recherche-rapide input { flex: 1; min-width: 0; height: 46px; padding: 0 12px 0 40px; border: 1px solid #cfcbc1; border-radius: 4px; font: inherit; font-size: 15px; background: #fff; color: var(--m-encre); }
.c-recherche-rapide .m-btn { height: 46px; }
article.x-projet-carte { cursor: default; }
.x-projet-actions { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin-top: 14px; padding-top: 12px; border-top: 1px solid var(--m-bordure); }
body.x-client .x-cat-grille { padding: 0 0 32px; max-width: none; }
@media (max-width: 560px) { .c-recherche-rapide .m-btn { padding: 0 14px; } .x-projet-actions .m-btn { flex: 1; justify-content: center; } }
@media (max-width: 992px) { .x-feuille a.actif { color: var(--m-vert); font-weight: 700; } }
.x-prix-demande { font-family: var(--m-police); font-size: 15px; font-weight: 700; color: var(--m-orange); margin-top: 6px; }

/* ---------- Schéma directeur sur les cartes ---------- */
.u-controle { background: #fff; border-radius: 4px; box-shadow: 0 1px 6px rgba(0,0,0,.2); padding: 8px 10px; font-size: 13px; max-width: 240px; }
.u-bascule { display: flex; align-items: center; gap: 6px; font-weight: 700; color: var(--m-encre); cursor: pointer; margin: 0; }
.u-etat { color: var(--m-gris); font-size: 12px; }
.u-etat:empty { display: none; }
.u-legende ul { list-style: none; margin: 8px 0 4px; padding: 0; display: flex; flex-direction: column; gap: 3px; max-height: 220px; overflow-y: auto; }
.u-legende li { display: flex; align-items: center; gap: 6px; font-size: 12px; color: var(--m-texte); }
.u-legende i { width: 14px; height: 10px; flex-shrink: 0; opacity: .75; }
.u-legende i.trait { height: 0; border-top: 3px dashed; opacity: 1; }
.u-legende b { color: var(--m-alerte); }
.u-legende small { color: var(--m-gris); font-size: 11px; }
.u-legende[hidden] { display: none; }
.u-quartier span { display: inline-block; transform: translate(-50%, -50%); white-space: nowrap; font-size: 11px; font-weight: 700; color: #17201c; text-shadow: 0 0 3px #fff, 0 0 3px #fff, 0 0 3px #fff; text-transform: uppercase; letter-spacing: .6px; }

/* ---------- Conformité au schéma directeur ---------- */
.x-conf-entete { display: flex; justify-content: space-between; gap: 16px; align-items: flex-end; flex-wrap: wrap; margin-bottom: 16px; }
.x-conf-entete h2 { margin: 0; font-family: var(--m-titre); font-weight: 500; font-size: 22px; color: var(--m-encre); }
.x-conf-entete p { margin: 4px 0 0; color: var(--m-gris); font-size: 14px; }
.x-conf-alerte { margin-bottom: 20px; }
.x-conf-motif { margin-bottom: 4px; font-size: 13.5px; }
.x-conf-motif b { color: var(--m-encre); }
.x-conf-motif small { display: block; color: var(--m-gris); font-size: 12.5px; }
.x-conf-legende { list-style: none; display: flex; flex-wrap: wrap; gap: 6px 16px; margin: 0; padding: 12px 16px 6px; font-size: 13px; }
.x-conf-legende li { display: flex; align-items: center; gap: 6px; }
.x-conf-legende i { width: 14px; height: 10px; }
.m-message.danger { background: var(--m-alerte-pale); color: #7d1a12; }
.m-message.danger i { color: var(--m-alerte); }
.x-quartiers { display: flex; flex-wrap: wrap; gap: 6px; padding: 14px 16px; }
.x-quartiers button { border: 1px solid var(--m-bordure); background: #fff; border-radius: 4px; padding: 5px 10px; font: inherit; font-size: 13.5px; color: var(--m-encre); cursor: pointer; }
.x-quartiers button:hover { border-color: var(--m-encre); }
.x-import-apercu { border: 1px solid var(--m-bordure); border-radius: 4px; padding: 4px 14px; margin-top: 6px; transition: opacity .2s; }
/* Les calques de Leaflet (z-index 400 à 1000) restent dans la carte : volets et menus passent au-dessus */
.leaflet-container { isolation: isolate; }
/* Logo Monlot (symbole + nom) : image détourée, hauteur fixe */
.x-logo-marque { height: 34px; width: auto; display: block; }
@media (max-width: 640px) { .x-logo-marque { height: 28px; } }
/* Bouton « Installer l'application » : visible seulement quand le navigateur le permet */
[data-installer-app][hidden] { display: none !important; }
/* Coin du menu sans logo de structure : le symbole Monlot sur fond clair, quelle que soit la couleur du menu */
.x-monogramme.x-monogramme-monlot { background: #fff !important; padding: 3px; box-shadow: inset 0 0 0 1px rgba(0,0,0,.06); }
.x-monogramme.x-monogramme-monlot img { object-fit: contain !important; }
/* Choix exclusif en boutons accolés (type de contrat…) */
.m-segments { display: flex; border: 1px solid var(--m-bordure); border-radius: 4px; overflow: hidden; }
.m-segments label { flex: 1; display: flex; align-items: center; justify-content: center; gap: 6px; padding: 10px 12px; font-size: 14.5px; cursor: pointer; text-align: center; background: #fff; }
.m-segments label + label { border-left: 1px solid var(--m-bordure); }
.m-segments input { position: absolute; opacity: 0; pointer-events: none; }
.m-segments label:has(input:checked) { background: var(--m-vert-pale); color: var(--m-vert); font-weight: 600; box-shadow: inset 0 -2px 0 var(--m-vert); }
.m-segments small { font-weight: 400; color: var(--m-gris); }
@media (max-width: 640px) { .m-segments { flex-direction: column; } .m-segments label + label { border-left: 0; border-top: 1px solid var(--m-bordure); } }
.x-a-attribuer { color: var(--m-orange); font-weight: 600; }
/* Étapes numérotées simples (page de souscription) */
.x-etapes-simples { counter-reset: e; list-style: none; padding: 0; margin: 0; }
.x-etapes-simples li { counter-increment: e; position: relative; padding: 0 0 12px 38px; line-height: 1.5; }
.x-etapes-simples li::before { content: counter(e); position: absolute; left: 0; top: 0; width: 26px; height: 26px; border: 1px solid var(--m-vert); color: var(--m-vert); border-radius: 50%; display: flex; align-items: center; justify-content: center; font-weight: 600; font-size: 13px; }
.x-lien-partage { display: flex; gap: 8px; flex-wrap: wrap; }
.x-lien-partage .m-input { flex: 1 1 260px; font-family: ui-monospace, monospace; font-size: 13px; }
.m-bloc-entete h2 .m-statut { margin-left: 8px; vertical-align: middle; }
.x-visite-organisee { display: grid; grid-template-columns: 56px minmax(0, 1fr) auto; gap: 14px; align-items: center; margin-bottom: 10px; }
.x-inscription-rapide { display: flex; gap: 6px; align-items: center; }
.x-inscription-rapide .m-input { width: auto; min-width: 120px; }
@media (max-width: 640px) { .x-visite-organisee { grid-template-columns: 48px minmax(0, 1fr); } .x-visite-organisee > div:last-child { grid-column: 1 / -1; align-items: stretch !important; } }
/* Livrables promis */
.x-table-livrables td { vertical-align: middle; }
.x-table-livrables .m-input { min-width: 140px; }
.x-ajout-type summary { cursor: pointer; color: var(--m-vert); font-weight: 600; font-size: 14px; }
.x-livrables { list-style: none; margin: 0; padding: 0; }
.x-livrables li { display: grid; grid-template-columns: 22px minmax(0, 1fr) auto; gap: 12px; align-items: center; padding: 12px 0; border-bottom: 1px solid var(--m-bordure); }
.x-livrables li:last-child { border-bottom: 0; }
.x-livrables .x-puce { width: 18px; height: 18px; border-radius: 50%; border: 1.5px solid var(--m-bordure); display: inline-flex; align-items: center; justify-content: center; font-size: 13px; color: #fff; }
.x-livrables .x-puce.ok { background: var(--m-vert-vif); border-color: var(--m-vert-vif); }
.x-livrables .x-puce.info { border-color: var(--m-vert-vif); color: var(--m-vert-vif); }
.x-livrables small { display: block; color: var(--m-gris); font-size: 13px; }
.x-livrables .m-actions { justify-content: flex-end; }
.x-sous-titre-bloc { font-family: var(--m-titre); font-weight: 500; font-size: 16px; color: var(--m-encre); margin: 0 0 4px; }
.x-sous-titre-bloc small { font-family: var(--m-texte, inherit); font-size: 13px; color: var(--m-gris); font-weight: 400; }
/* Accueil : le cycle d'un lotissement (sans chiffres d'exemple) */
.x-cycle { list-style: none; margin: 14px 0 0; padding: 0; counter-reset: c; }
.x-cycle li { counter-increment: c; position: relative; padding: 10px 0 10px 40px; border-top: 1px solid var(--m-bordure); }
.x-cycle li::before { content: counter(c, decimal-leading-zero); position: absolute; left: 0; top: 11px; font-family: var(--m-titre); color: var(--m-orange); font-size: 15px; }
.x-cycle b { display: block; color: var(--m-encre); font-size: 15px; }
.x-cycle span { display: block; color: var(--m-gris); font-size: 13.5px; line-height: 1.45; }