/* prospecthub-design-b-v1 : complements propres a ProspectHub, charges APRES app.css (coque design-lcc).
   prospecthub-securite-design-v1 (B3) : couleurs de marque, durees et tailles de texte passent par les jetons d app.css ;
   aucun texte sous 13 px (meta --fs-sm, contenu --fs-md), sauf la rubrique du menu du telephone (11 px, prevue par design-lcc).
   Uniquement des jetons et des valeurs de la coque design-lcc (rayons 12.6 / 16.6 / 24, ombres --shadow-*, --accent-turq). */

/* Marque : picto casque LCC et logo LCC Services en pied de menu, selon le style du menu */
.side-mark .ph-picto { color: var(--brand-turq); }
:root[data-menu="clair"] .side-mark .ph-picto { color: var(--accent-turq); }
.ph-foot img { display: block; height: 30px; width: auto; }
.ph-foot .ph-logo-clair { display: none; }
:root[data-menu="clair"] .ph-foot .ph-logo-clair { display: block; }
:root[data-menu="clair"] .ph-foot .ph-logo-sombre { display: none; }
:root[data-theme="dark"] .ph-foot .ph-logo-clair { display: none; }
:root[data-theme="dark"] .ph-foot .ph-logo-sombre { display: block; }

/* Elements masques par l attribut hidden. La coque design-lcc le traite classe par classe ; les vues de ProspectHub l utilisent
   comme l ancien d-none de Bootstrap (dont la feuille posait deja [hidden] { display: none !important }) :
   meme regle globale, sinon un bloc en grille ou un .btn reste visible (relecture du 17/10). */
[hidden] { display: none !important; }

/* Pied du menu et des pages de connexion : lien « © LCC Services Dev » vers /about.php, comme avant */
.ph-foot { flex-wrap: wrap; }
.ph-copy { display: block; width: 100%; margin-top: 8px; font-size: var(--fs-sm); letter-spacing: .02em; color: var(--text-2); text-decoration: none; opacity: .75; }
.ph-copy:hover { opacity: 1; text-decoration: underline; }
:root[data-menu="sombre"] .ph-copy { color: rgba(255, 255, 255, .55); }
:root[data-side="reduit"] .ph-copy { display: none; }
.ph-copy-cx { margin-top: 14px; text-align: center; font-size: var(--fs-sm); }
.ph-copy-cx a { color: var(--text-2); text-decoration: none; }
.ph-copy-cx a:hover { text-decoration: underline; }

/* Pastille turquoise (nouveau, analyse, administrateur...) : absente d app.css, construite sur les jetons turquoise de la coque design-lcc */
.st-turq { background: rgba(var(--accent-turq-rgb), .10); color: var(--accent-turq-fonce); border-color: rgba(var(--accent-turq-rgb), .30); }
:root[data-theme="dark"] .st-turq { background: rgba(var(--accent-turq-rgb), .16); color: var(--brand-turq); border-color: rgba(var(--accent-turq-rgb), .40); }

/* Ciblage : tuiles, pastilles de filtres, panneau d ajout, fiche laterale */
.cbl-kpis { grid-template-columns: repeat(3, minmax(0, 1fr)); margin-bottom: 24px; }
.kpi.nue { flex-direction: column; align-items: flex-start; gap: 0; }
.kpi.nue .t { font-size: 13px; font-weight: 500; color: var(--text-2); margin: 0 0 6px; }
.kpi.nue .n { font-family: var(--font-marque); font-size: 32px; font-weight: 700; line-height: 1.1; letter-spacing: -.02em; font-variant-numeric: tabular-nums; color: var(--text); font-synthesis: none; }
.kpi.nue .delta { font-size: var(--fs-sm); font-weight: 500; margin-top: 6px; color: var(--text-2); }
.cbl-chips { display: contents; }
.cbl-chips .chip .bi { font-size: 13px; margin-left: 2px; }
.cbl-ajout { position: relative; }
.cbl-pop { position: absolute; top: calc(100% + 8px); left: 0; z-index: 60; width: 560px; max-width: calc(100vw - 48px); max-height: 470px; overflow-y: auto; padding: 16px 18px; background: var(--surface); color: var(--text); border: 1px solid var(--border); border-radius: 16.6px; box-shadow: var(--shadow-raised); }
.cbl-pop-ligne { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin-bottom: 12px; }
.cbl-pop .fl { display: block; font-size: 13px; font-weight: 500; color: var(--text); margin: 0 0 6px; }
.cbl-range { width: 100%; height: 36px; accent-color: var(--accent-turq); }
.cbl-cat { font-size: var(--fs-sm); font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: var(--text-2); margin: 16px 0 8px; }
.cbl-opts { display: flex; flex-wrap: wrap; gap: 8px; }
.cbl-pop-pied { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-top: 18px; padding-top: 12px; border-top: 1px solid var(--border-2); }
.lv-filtres .cnt { margin-left: auto; font-size: 13px; color: var(--text-2); }
.cbl-res > h4 .lv-sel { width: auto; }
.cbl-tel .bi { color: var(--text-2); margin-right: 6px; }
.cbl-ach { color: var(--accent-turq); margin-left: 4px; }
.cbl-fiche { position: sticky; top: 16px; }
.cbl-fiche-tete { gap: 12px; }
.cbl-av-xl { width: 48px; height: 48px; font-size: 16px; }
.cbl-score { align-items: center; }
.cbl-score b { font-family: var(--font-marque); font-size: 24px; font-weight: 700; line-height: 1; color: var(--text); }
.cbl-sec { margin: 20px 0 6px; }
.cbl-kv { display: flex; justify-content: space-between; align-items: center; gap: 12px; font-size: 14px; padding: 7px 0; border-bottom: 1px solid var(--border-2); }
.cbl-kv:last-of-type { border-bottom: 0; }
.cbl-kv > span:first-child { color: var(--text-2); }
.cbl-kv > span:last-child { text-align: right; min-width: 0; overflow-wrap: anywhere; }
.cbl-fiche-act { margin-top: 18px; }
.cbl-fiche-act .btn:first-child { flex: 1; }
@media (max-width: 1100px) { .cbl-kpis { grid-template-columns: 1fr; } .cbl-fiche { position: static; } }

/* Tableau de bord */
.tb-kpis { grid-template-columns: repeat(4, minmax(0, 1fr)); margin-bottom: 24px; }
@media (max-width: 1100px) { .tb-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.tb-barres { display: flex; flex-direction: column; gap: 12px; font-size: 13.5px; }
.tb-barres .tb-l { display: flex; justify-content: space-between; gap: 12px; margin-bottom: 6px; }
.tb-barres .tb-l span:last-child { color: var(--text-2); font-variant-numeric: tabular-nums; }
.tb-graphe { position: relative; height: 240px; }

/* Ciblage : une ligne par fiche, rien ne deborde (regle d interface du CEO, 16/10/2026) */
.cbl-res .tt td { white-space: nowrap; }
.cbl-res .tt td.cbl-nom { max-width: 0; width: 42%; }
.cbl-nom { overflow: hidden; text-overflow: ellipsis; }
.cbl-nom-t { overflow: hidden; text-overflow: ellipsis; }
.cbl-res .tt td.cbl-loc { max-width: 220px; overflow: hidden; text-overflow: ellipsis; }
.cbl-res .tt .av { flex-shrink: 0; }

/* Communs des pages : piles, lignes cle-valeur, champs de barre de filtres */
.stack-24 { display: flex; flex-direction: column; gap: 24px; min-width: 0; }
.kv-l { display: flex; justify-content: space-between; align-items: center; gap: 12px; font-size: 14px; padding: 7px 0; border-bottom: 1px solid var(--border-2); }
.kv-l:last-child { border-bottom: 0; }
.kv-l > span:first-child { color: var(--text-2); flex-shrink: 0; }
.kv-l > span:last-child { text-align: right; min-width: 0; overflow-wrap: anywhere; }
.lv-filtres .fi { width: auto; }
.lv-filtres .pr-court { width: 140px; }
.lv-filtres .pr-moyen { width: 170px; }

/* Prospects */
.pr-groupe { gap: 8px; }
.pr-groupe[hidden] { display: none; }
.tt td.pr-nom { max-width: 0; width: 34%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tt td.pr-loc { max-width: 220px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.card .tt td { white-space: nowrap; }
.pr-txt { display: inline-flex; flex-direction: column; vertical-align: middle; min-width: 0; max-width: calc(100% - 42px); line-height: 1.3; }
.pr-txt > span, .pr-txt > small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pr-txt > small { font-size: var(--fs-sm); font-weight: 400; color: var(--text-2); }
.tt td.pr-mail { max-width: 220px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 13px; }
.pr-pied { gap: 16px; flex-wrap: wrap; }
.pr-par { display: inline-flex; align-items: center; gap: 8px; }
.pr-par .fi { width: auto; height: 34px; }
.tt td.ph-ellipse { max-width: 200px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pr-tete { gap: 12px; }
.pr-av-xl { width: 48px; height: 48px; font-size: 16px; }
.pr-score { display: inline-flex; align-items: center; gap: 10px; font-family: 'Plus Jakarta Sans', system-ui, sans-serif; font-size: var(--fs-sm); font-weight: 500; }
.pr-score b { font-family: var(--font-marque); font-size: 20px; font-weight: 700; color: var(--text); }
.pr-score .dc-barre { width: 90px; }
.pr-sec { margin: 16px 0 6px; }
.pr-notes { font-size: 14px; line-height: 1.6; }
.pr-brut { margin-top: 20px; }
.pr-brut summary { cursor: pointer; font-size: 13px; font-weight: 600; color: var(--text-2); }
.pr-brut pre { margin-top: 10px; max-height: 260px; overflow: auto; padding: 12px; background: var(--bg); border: 1px solid var(--border); border-radius: 12.6px; font-size: var(--fs-sm); line-height: 1.5; }
.pr-plein { width: 100%; margin-top: 18px; }
textarea.fi { height: auto; padding: 10px 12px; }

/* Panier : envoi et formats d export */
.pa-envoi { justify-content: center; }
.pa-off { opacity: .5; pointer-events: none; }
.pa-formats { display: flex; flex-direction: column; gap: 8px; margin-bottom: 14px; }
.pa-fmt { display: flex; align-items: flex-start; gap: 12px; width: 100%; padding: 10px 12px; text-align: left; font-family: inherit; color: var(--text); background: var(--surface); border: 1px solid var(--border); border-radius: 12.6px; cursor: pointer; transition: var(--tr); }
.pa-fmt:hover { border-color: rgba(var(--accent-turq-rgb), .5); background: rgba(239, 243, 247, .6); }
.pa-fmt[aria-checked="true"] { border-color: var(--accent-turq); background: var(--primary-pale); }
.pa-fmt > .bi { font-size: 18px; color: var(--accent-turq-txt); margin-top: 2px; }
.pa-fmt b { display: block; font-size: 13.5px; font-weight: 600; }
.pa-fmt span span { display: block; font-size: var(--fs-sm); color: var(--text-2); line-height: 1.45; margin-top: 2px; }
.vide .btn { margin-top: 4px; }

/* Imports : depot, correspondance, resultat (gabarits de la coque design-lcc .dc-zone, .dc-jeton, .dv-progres, .ecart) */
.ij-centre { max-width: 680px; margin: 0 auto; }
.dc-zone { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 5px; padding: 18px 14px; border: 1px dashed var(--border); border-radius: 16px; background: rgba(239, 243, 247, .4); cursor: pointer; text-align: center; transition: var(--tr); }
.dc-zone:hover, .dc-zone.survol { border-color: var(--accent-turq); background: rgba(var(--accent-turq-rgb), .08); transform: translateY(-1px); }
.ij-zone { padding: 36px 20px; gap: 8px; margin-bottom: 16px; }
.ij-zone b { font-size: 15px; font-weight: 600; }
.ij-zone .muted { font-size: 13px; }
.ij-med { display: grid; place-items: center; width: 48px; height: 48px; border-radius: 50%; background: rgba(var(--accent-turq-rgb), .14); color: var(--primary); font-size: 20px; margin-bottom: 4px; }
.ij-zone[hidden], .ij-fichier[hidden] { display: none; }
.ij-fichier { display: flex; align-items: center; gap: 12px; padding: 12px 14px; margin-bottom: 16px; border: 1px solid rgba(var(--accent-turq-rgb), .3); background: rgba(var(--accent-turq-rgb), .08); border-radius: 12px; }
.ij-fichier > .bi { font-size: 22px; color: var(--accent-turq-txt); }
.ij-fichier > span { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.ij-fichier b { font-size: 14px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ij-fichier .muted { font-size: var(--fs-sm); }
.ij-etapes { margin-top: 16px; }
.ij-infos { gap: 8px; margin-bottom: 16px; }
.ij-profil { margin-left: auto; display: inline-flex; align-items: center; gap: 8px; }
.ij-apercu { white-space: normal; }
.card .tt td.ij-apercu { white-space: normal; }
.ij-jeton { display: inline-block; padding: 2px 8px; margin: 2px 4px 2px 0; border-radius: 999px; border: 1px solid var(--border); color: var(--text-2); font-size: var(--fs-sm); font-weight: 600; max-width: 180px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; vertical-align: middle; }
.ij-conf { display: inline-flex; align-items: center; gap: 8px; }
.ij-conf .dc-barre { width: 48px; }
.ij-map .fi { min-width: 220px; }
.ij-pied { flex-wrap: wrap; }
.ij-case { display: inline-flex; align-items: center; gap: 8px; font-size: 13px; color: var(--text); cursor: pointer; }
.ij-prog { height: 6px; border-radius: 999px; background: rgba(217, 226, 234, .7); overflow: hidden; }
.ij-prog i { display: block; height: 100%; border-radius: 999px; background: var(--accent-turq); transition: width var(--dur) var(--ease); }
.ij-prog.faible i { background: var(--danger); }
.tu-modal .m-foot .btn[hidden] { display: none; }
.ij-chiffres { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; margin-bottom: 8px; }
.ij-chiffres > div { display: flex; flex-direction: column; gap: 2px; padding: 14px 16px; border: 1px solid var(--border-2); border-radius: 16.6px; background: var(--bg); }
.ij-chiffres .muted { font-size: var(--fs-sm); font-weight: 500; }
.ij-chiffres b { font-family: var(--font-marque); font-size: 24px; font-weight: 700; letter-spacing: -.02em; color: var(--text); }
.ij-chiffres .dc-barre { margin-top: 6px; }
.ij-ecart { margin: 16px 0 0; }
.card .tt td.ij-msg { white-space: normal; font-size: 13px; }

/* Formulaires : libelle au-dessus du champ (span.fl dans un label), grilles de champs */
span.fl { display: block; font-size: 13px; font-weight: 500; color: var(--text); margin: 0 0 6px; }
.ecart[hidden], .ph-err[hidden], .stack-24[hidden], .lc-prog[hidden] { display: none; }
.ph-err { display: flex; align-items: flex-start; gap: 8px; padding: 8px 10px; border-radius: 12.6px; font-size: var(--fs-md); font-weight: 500; line-height: 1.35; background: var(--danger-bg); border: 1px solid var(--danger-bd); color: var(--danger); }

/* Envoi vers L2COM */
.lc-etape { gap: 10px; }
.lc-num { display: inline-grid; place-items: center; width: 26px; height: 26px; border-radius: 50%; background: var(--primary); color: var(--primary-txt); font-family: var(--font-titres); font-size: 13px; font-weight: 700; flex-shrink: 0; }
.lc-modes { gap: 20px; margin-bottom: 14px; }
.lc-mode { display: inline-flex; align-items: center; gap: 8px; font-size: 14px; font-weight: 500; cursor: pointer; }
.lc-mode input, .ij-case input { accent-color: var(--primary); width: 18px; height: 18px; margin: 0; }
.lc-hist th, .lc-hist td { padding-left: 10px; padding-right: 10px; }
.lc-2col { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin-bottom: 12px; align-items: end; }
.lc-3col { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; align-items: end; margin-top: 4px; }
#blocExistante > label { display: block; margin-bottom: 12px; }
.lc-case { min-height: 36px; line-height: 1.4; }
.lc-ag { display: inline-flex; align-items: center; gap: 8px; padding: 5px 13px; border-radius: 999px; border: 1px solid var(--border); background: var(--surface); color: var(--text-2); font-size: var(--fs-sm); font-weight: 600; cursor: pointer; transition: var(--tr); }
.lc-ag:hover { border-color: var(--accent-turq); color: var(--text); }
/* Coche : style .dc-jeton.on de la coque design-lcc (bordure et aplat turquoise doux, texte navy) */
.lc-ag:has(input:checked) { background: rgba(var(--accent-turq-rgb), .12); border-color: rgba(var(--accent-turq-rgb), .6); color: var(--primary); }
.lc-ag input { accent-color: var(--primary); width: 15px; height: 15px; margin: 0; }
.lc-code { font-size: var(--fs-sm); }
.lc-dedup { justify-content: flex-start; gap: 18px; flex-wrap: wrap; }
.lc-recap { position: sticky; top: 16px; }
.lc-recap-txt { margin-bottom: 16px; font-size: 14px; }
.lc-prog, .lc-msg { margin-top: 16px; }
@media (max-width: 1100px) { .lc-2col, .lc-3col { grid-template-columns: 1fr; } .lc-recap { position: static; } }

/* Exports et campagnes */
.ex-grille { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.ex-grille .ex-large { grid-column: span 3; }
.ex-cols-tete { margin: 22px 0 10px; }
.ex-cols { display: flex; flex-wrap: wrap; gap: 8px; }
.ex-pied { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-top: 20px; padding-top: 16px; border-top: 1px solid var(--border-2); }
.ex-fmt { cursor: pointer; }
.ex-fmt input { position: absolute; opacity: 0; width: 1px; height: 1px; pointer-events: none; }
.ct-bascule .ex-fmt:has(input:checked) { background: var(--primary); color: var(--primary-txt); border-color: var(--primary); }
.ex-fmt:has(input:focus-visible) { outline: 2px solid var(--accent-turq); outline-offset: 2px; }
@media (max-width: 1100px) { .ex-grille { grid-template-columns: 1fr; } .ex-grille .ex-large { grid-column: auto; } }

/* Reglages en onglets */
.rg-onglets { display: inline-flex; flex-wrap: wrap; margin: 0 0 24px; }
.rg-panneau[hidden] { display: none; }
.rg-json { height: auto; padding: 10px 12px; font-size: var(--fs-md); line-height: 1.5; }
.rg-pied { display: flex; justify-content: flex-end; gap: 10px; margin-top: 16px; }
.rg-defile { max-height: 520px; overflow: auto; }
.rg-defile .fi { width: 110px; }
.rg-portees { font-size: var(--fs-sm); }
.card-body > label:not([class]), .card-body form > label:not([class]) { display: block; }

/* Assistant IA */
.ia-chat { display: flex; flex-direction: column; height: calc(100vh - 150px); min-height: 520px; }
.ia-fil { flex: 1; overflow-y: auto; padding: 18px 20px; background: var(--bg); border-top: 1px solid var(--border-2); border-bottom: 1px solid var(--border-2); }
.ia-msg { display: flex; align-items: flex-start; gap: 10px; margin-bottom: 14px; }
.ia-msg.moi { justify-content: flex-end; }
.ia-texte { max-width: 80%; padding: 10px 14px; border-radius: 16.6px; font-size: 14px; line-height: 1.55; overflow-wrap: anywhere; }
.ia-msg.moi .ia-texte { background: var(--primary); color: var(--primary-txt); }
.ia-msg.ia .ia-texte { background: var(--surface); border: 1px solid var(--border); box-shadow: var(--shadow-card); }
.ia-av { background: var(--accent-turq); color: var(--brand-navy); }
.ia-saisie { display: flex; gap: 8px; padding: 14px 20px 18px; }
.ia-rapides { display: flex; flex-direction: column; gap: 8px; }
.ia-rapides .quick-btn { display: flex; align-items: center; gap: 8px; width: 100%; text-align: left; font-family: inherit; color: var(--text); cursor: pointer; }

/* Connexion (gabarit « carte » de la coque design-lcc) */
.cx-carte { width: 100%; }
.cx-large { max-width: 520px; }
.ph-picto-cx { display: inline-grid; place-items: center; width: 42px; height: 42px; color: var(--accent-turq); }
.ph-picto-cx svg { width: 100%; height: 100%; }
.ph-cx-titre { font-family: var(--font-titres); font-size: 20px; font-weight: 600; line-height: 1.3; letter-spacing: -.01em; margin: 0 0 16px; }
.ph-cx-msg { margin: 0 0 12px; }
.cx-carte .btn-lg { margin-top: 18px; }
.mfa-code { height: 48px; text-align: center; font-size: 22px; font-weight: 600; letter-spacing: .32em; font-variant-numeric: tabular-nums; }
.cx-codes { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin: 4px 0 4px; padding: 12px; background: var(--bg); border: 1px solid var(--border); border-radius: 12.6px; font-size: 14px; text-align: center; }
.cx-etapes { margin: 0 0 10px 18px; font-size: 13.5px; line-height: 1.55; color: var(--text-2); }
.cx-qr { display: flex; justify-content: center; margin: 14px 0 10px; }
.cx-secret { text-align: center; font-size: 14px; letter-spacing: .08em; margin-bottom: 8px; color: var(--text); overflow-wrap: anywhere; }
.login-foot a { color: var(--accent-turq-txt); }

/* Onglets (coque design-lcc, ecran Compte : .cp-onglets / .cp-onglet) */
.cp-onglets { display: inline-flex; flex-wrap: wrap; gap: 4px; padding: 4px; border-radius: 999px; background: rgba(220, 227, 234, .35); }
:root[data-theme="dark"] .cp-onglets { background: rgba(255, 255, 255, .06); }
.cp-onglet { padding: 6px 12px; border: 0; border-radius: 999px; background: transparent; color: var(--text-2); font-family: inherit; font-size: var(--fs-sm); font-weight: 500; cursor: pointer; transition: var(--tr); }
.cp-onglet:hover { color: var(--text); }
.cp-onglet[aria-selected="true"] { background: var(--surface); color: var(--text); font-weight: 600; box-shadow: var(--shadow-card); }
.cp-onglet:focus-visible { outline: 2px solid var(--accent-turq); outline-offset: 1px; }

/* Tiroir du telephone. La coque design-lcc le veut « toujours complet (libelles, sections) » (bloc max-width 860 px d app.css),
   mais la regle du rail automatique (max-width 1100 px) y laisse les rubriques a font-size 0 et cache le nom du compte.
   On rend au tiroir ses titres de rubrique et le nom du compte (constat sur capture du 17/10). */
@media (max-width: 860px) {
  .side-sec { justify-content: flex-start; padding: 8px 10px; margin: 6px 12px 0; width: calc(100% - 24px); font-size: 11px; }
  .side-user-wrap { padding: 4px 12px 12px; }
  .side-user { justify-content: flex-start; padding: 8px 12px; }
  .side-user .qui, .side-user .bi-chevron-down { display: block; }
}

/* Telephone : la colonne du nom garde une largeur lisible, le tableau defile dans sa carte (overflow-x de .card) */
@media (max-width: 860px) {
  .tt td.pr-nom, .cbl-res .tt td.cbl-nom { min-width: 190px; }
}