/* Créances : cartes, ancienneté des impayés, liste des clients repliable (retards signalés en rouge) */
.cr-kpis{grid-template-columns:repeat(4,minmax(0,1fr));margin-bottom:var(--esp-3)}
.content .kpi.cr-rouge{border-color:var(--bad);background:var(--bad-soft)}
.kpi.cr-rouge .val,.kpi.cr-rouge .lab{color:var(--bad)}
.cr-jaune{--c:#d9b01e} .cr-orange{--c:#dd7a1c} .cr-rouge{--c:var(--bad)} .cr-ok{--c:var(--ok)}
.cr-age{display:flex;flex-direction:column;gap:var(--esp-2);margin-bottom:var(--esp-3)}
.cr-barre{display:flex;height:14px;border-radius:var(--r-btn);overflow:hidden;background:var(--panel2);gap:2px}
.cr-barre i{display:block;background:var(--c);min-width:4px}
.cr-legende{display:flex;flex-wrap:wrap;gap:6px 18px;font-size:var(--t-petit);color:var(--muted)}
.cr-legende span{display:inline-flex;align-items:center;gap:6px}
.cr-legende i{width:10px;height:10px;border-radius:3px;background:var(--c)}
.cr-legende b{color:var(--ink)}
.cr-filtres{display:flex;flex-wrap:wrap;align-items:flex-end;gap:var(--esp-2) var(--esp-3);margin-bottom:var(--esp-3)}
.cr-filtres .field select{min-width:220px}
.cr-case{display:inline-flex;align-items:center;gap:8px;cursor:pointer;padding-bottom:8px}
.cr-case input{width:18px;height:18px;accent-color:var(--bad)}
.cr-tout{margin-left:auto;display:flex;gap:6px}
/* Liste compacte : un seul panneau, une ligne fine par client (nom · téléphone · factures · plafond · retard · montant) */
.cr-liste{display:flex;flex-direction:column;background:var(--panel);border:1px solid var(--line);border-radius:var(--r-carte);overflow:hidden}
.cr-client{border-left:3px solid transparent}
.cr-client+.cr-client{border-top:1px solid var(--line)}
.cr-client.retard{border-left-color:var(--bad)}
.cr-tete{display:grid;grid-template-columns:20px minmax(0,2fr) minmax(0,1.2fr) 90px 120px 130px 130px;align-items:center;gap:var(--esp-3);padding:10px var(--esp-3);cursor:pointer}
.cr-tel,.cr-nb{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cr-signal{text-align:right}
.cr-du{font-size:var(--t-texte);color:var(--bad);text-align:right;white-space:nowrap}
.cr-tete:hover{background:var(--panel2)}
.cr-tete:focus-visible{outline:2px solid var(--copper);outline-offset:-2px}
.cr-chev{display:inline-flex;color:var(--muted);transform:rotate(-90deg);transition:transform .15s ease}
.cr-client.ouvert .cr-chev{transform:none}
.cr-nom{display:flex;align-items:center;gap:6px;min-width:0}
.cr-nom>b{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cr-nom>b{font-size:var(--t-texte)}
.cr-plafond{display:flex;align-items:center;gap:8px}
.cr-plafond .gauge{width:70px;height:6px;flex:none}
.cr-corps{border-top:1px dashed var(--line);padding:var(--esp-2) var(--esp-3) var(--esp-3);background:var(--panel2)}
.cr-boutons{justify-content:flex-end;margin-bottom:var(--esp-2)}
.cr-ech-retard{color:var(--bad);font-weight:var(--g-fort)}
@media (max-width:860px){.cr-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}.cr-tete{grid-template-columns:20px minmax(0,1fr) auto auto}.cr-tel,.cr-plafond{display:none}.cr-nb{display:none}}
@media (max-width:640px){
  /* Ligne client : nom à gauche, montant à droite ; le signal de retard passe dessous, sur toute la largeur */
  .cr-tete{grid-template-columns:16px minmax(0,1fr) auto;gap:2px var(--esp-2);padding:10px var(--esp-2)}
  .cr-signal{grid-column:2/-1;grid-row:2;text-align:left}
  .cr-tout{margin-left:0}
  .cr-filtres .field{flex:1 1 100%}.cr-filtres .field select{min-width:0;width:100%}
  .cr-corps{padding:var(--esp-2)}
  .cr-boutons{justify-content:flex-start}
  /* Factures : une petite fiche par facture au lieu d'un tableau large */
  .cr-factures thead{display:none}
  .cr-factures,.cr-factures tbody{display:block}
  .cr-factures tr{display:grid;grid-template-columns:1fr auto;gap:2px 10px;padding:8px 4px;border-bottom:1px solid var(--line)}
  .cr-factures td{display:block;border:0;padding:0}
  .cr-factures td:nth-child(1){font-weight:var(--g-fort)}
  .cr-factures td:nth-child(2),.cr-factures td:nth-child(3){font-size:var(--t-petit);color:var(--muted)}
  .cr-factures td:nth-child(2){text-align:right}
  .cr-factures td:nth-child(4){grid-column:1}
  .cr-factures td:nth-child(5){text-align:right;font-weight:var(--g-fort)}
  .cr-factures td:nth-child(6){grid-column:1/-1}
  .cr-factures td:nth-child(6) .actions{justify-content:flex-end}
}
