/* acomptes.batmax.fr : la feuille, copiée de relances.batmax.fr (habillage validé le 07/10), en VERT au lieu d'orange (Benoît, 13/10). */
:root{
  --fond:#fff;--texte:#1a1a1a;--doux:#7a7570;--grille:#d9d9d9;--entete:#111314;--sable:#e6f3ea;--sable-ligne:#9fcfae;
  --a:#1f8a4c;--a2:#3ec27a;--brun:#1e6b3a;--a-fond:#e3f5ea;--survol:#f3faf5;--survol-cellule:#e6f4ea;
  --alerte:#c2560a;--rouge:#c01e3a;--rouge-fond:#fff0f2;--vert:#2f9e5b;--vert-fond:#e3f5ea;--vert-texte:#2f7a4a;
  --carte:#fff;--ligne:#e6e1d6;--zebre:#faf8f3;--ombre:0 2px 8px rgba(40,25,0,.10);
  --bouton:linear-gradient(135deg,#2fa866,#1f8a4c);--bouton-texte:#ffffff;
}
*{box-sizing:border-box}
html,body{margin:0;height:100%;background:var(--fond);color:var(--texte);font:14px/1.35 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;font-variant-numeric:tabular-nums;-webkit-text-size-adjust:100%}
#app{height:100%;display:flex;flex-direction:column}
button{font:inherit}

/* barre du haut : charbon, titre orange, filtres en listes déroulantes */
.barre{display:flex;align-items:center;gap:16px;padding:9px 16px;background:var(--entete);color:#e8e4dc;font-size:13px;white-space:nowrap;flex-wrap:wrap;position:relative;z-index:6}
.barre h1{font-size:16px;margin:0 6px 0 0;font-weight:800;color:var(--a2);letter-spacing:.2px}
.barre h1 small{display:block;font-size:11px;font-weight:500;color:#cfc9bd;letter-spacing:0}
.barre label{display:flex;align-items:center;gap:6px;color:#cfc9bd}
.barre select,.barre input{font:inherit;font-size:13px;padding:4px 9px;border:1px solid #374151;border-radius:7px;background:#1f2123;color:#f3f4f6;min-height:30px}
.barre input::placeholder{color:#9ca3af}
.barre input[type=search]{width:230px;-webkit-appearance:none}
.barre .droite{margin-left:auto;display:flex;gap:14px;align-items:center;color:#cfc9bd}
.barre .lien-barre{background:none;border:0;color:#f3f4f6;text-decoration:none;border-bottom:1px solid #4b5563;cursor:pointer;padding:0;font-size:13px}
.barre .lien-barre:hover{border-bottom-color:var(--a2)}
.barre .retour{background:none;border:1px solid #6b665e;color:#fff;border-radius:4px;padding:3px 10px;cursor:pointer}

/* la grille : carte blanche sur fond gris clair, pas de traits verticaux, lignes de 40 px, la couleur pour le sens seulement (esquisse F validée le 07/10) */
:root{--bg:#f4f5f7;--bord:#e5e7eb;--filet:#eef0f3;--t1:#111827;--t2:#4b5563;--t3:#9ca3af;--survol:#f9fafb;--bande:#fafbfc}
.cadre{flex:1;overflow:auto;background:var(--bg);padding:12px}
.cadre::-webkit-scrollbar{height:12px;width:12px}
.cadre::-webkit-scrollbar-thumb{background:#c9c4b8;border-radius:6px;border:3px solid var(--bg)}
.feuille{border-collapse:separate;border-spacing:0;width:100%;min-width:1600px;table-layout:fixed;background:#fff;border:1px solid var(--bord);border-radius:10px;box-shadow:0 1px 2px rgba(16,24,40,.04),0 1px 3px rgba(16,24,40,.06)}
.feuille th:last-child{border-top-right-radius:10px}
.feuille tbody tr:last-child td:first-child{border-bottom-left-radius:10px}
.feuille tbody tr:last-child td:last-child{border-bottom-right-radius:10px}
.feuille th,.feuille td{padding:0 8px;height:40px;white-space:nowrap;text-align:left;vertical-align:middle;overflow:hidden;text-overflow:ellipsis;border-bottom:1px solid var(--filet);font-size:13.5px;color:var(--t2)}
.feuille th{position:sticky;top:0;background:#fff;font-size:11px;font-weight:600;letter-spacing:.03em;text-transform:uppercase;color:#6b7280;border-bottom:1px solid var(--bord);z-index:3;user-select:none;white-space:normal;line-height:1.15}
.feuille th:first-child{border-top-left-radius:10px}
.feuille th.triable{cursor:pointer}
.feuille th.triable:hover{color:var(--t1)}
.feuille th .sens{color:var(--a);font-size:10px;margin-left:3px}
.feuille th:first-child,.feuille td:first-child{position:sticky;left:0;z-index:2;background:#fff}
.feuille th:first-child{z-index:4}
.feuille.figee th:nth-child(2),.feuille.figee td:nth-child(2){position:sticky;left:124px;z-index:2;background:#fff}
.feuille.figee th:nth-child(2){z-index:4}
.feuille tbody tr:last-child td{border-bottom:0}
.feuille td.num,.feuille th.num{text-align:right}
.feuille td.centre,.feuille th.centre{text-align:center}
.feuille tr.paire td{background:var(--bande)}
.feuille tbody tr:hover td{background:var(--survol)}
.feuille td.facture-cell{font-weight:600;color:var(--t1)}
.feuille td.facture-cell a,.feuille td.facture-cell span{color:inherit;text-decoration:none;border:0}
.feuille td.facture-cell a:hover{color:var(--a)}
.feuille td a.lien-client{color:var(--t1);text-decoration:none}
.feuille td a.lien-client:hover{color:var(--a)}
.feuille td.repete a.lien-client{color:var(--t3)}
.feuille td.num{font-weight:600;color:var(--t1);font-variant-numeric:tabular-nums}
.feuille td.retour{color:var(--t1)}
.feuille tr.main td,.feuille tr.payee td,.feuille tr.disparue td,.feuille tr.annulee td{color:var(--t3)}
.feuille tr.main td .numero,.feuille tr.payee td .numero{text-decoration:line-through}
.pill{display:inline-block;padding:2px 7px;border-radius:999px;font-size:12px;font-weight:600;line-height:18px;white-space:nowrap}
.pill.r2{background:#fef2f2;color:#b91c1c}
.pill.r1{background:#fffbeb;color:#b45309}
.pill.r0{background:#ecfdf5;color:#047857}

/* largeurs des colonnes : larges au-dessus de 1360 px de fenêtre, compactes en dessous (la feuille doit tenir entière, Benoît 07/10) */
col.c-devis{width:124px}col.c-nom{width:120px}col.c-genre{width:76px}col.c-facture{width:140px}col.c-retard{width:64px}col.c-etat{width:128px}col.c-attendu{width:90px}col.c-virement{width:128px}
col.c-relanceur{width:100px}col.c-interlocuteur{width:116px}col.c-derniere{width:98px}col.c-moyen{width:90px}col.c-ticket{width:76px}col.c-prochaine{width:98px}col.c-nb{width:80px}
col.c-payee{width:78px}
@media (max-width:1600px){
  .cadre{padding:4px}
  .feuille{min-width:1420px}
  .feuille th,.feuille td{font-size:13px;padding:0 5px;height:36px}
  .feuille td .saisie{font-size:13px;padding:0 5px;height:35px}
  .feuille td input[type=date].saisie{padding:0 2px}
  .feuille th{font-size:10.5px;letter-spacing:.02em}
  .pill{font-size:11.5px;padding:1px 6px}
  .feuille td .plus,.feuille td .effacer{width:22px;height:22px;font-size:14px;margin-left:4px}
  .feuille.figee th:nth-child(2),.feuille.figee td:nth-child(2){left:126px}
  col.c-devis{width:126px}col.c-nom{width:92px}col.c-genre{width:66px}col.c-facture{width:120px}col.c-retard{width:56px}col.c-etat{width:110px}col.c-attendu{width:84px}col.c-virement{width:120px}
  col.c-relanceur{width:92px}col.c-interlocuteur{width:106px}col.c-derniere{width:92px}col.c-moyen{width:76px}col.c-ticket{width:72px}col.c-prochaine{width:92px}col.c-nb{width:72px}
  col.c-payee{width:72px}
}

/* cellules de saisie : le menu, le calendrier ou le texte est dans la case, sans cadre ; un cadre orange quand on y est */
.feuille td.editable{padding:0;position:relative}
.feuille td.editable:hover{background:#eaf7ee !important}
.feuille td.editable:focus-within{background:#fff !important;box-shadow:inset 0 0 0 2px var(--a)}
.feuille td.editable.enregistre{background:var(--vert-fond) !important;box-shadow:inset 0 0 0 2px var(--vert);transition:background .4s}
.feuille td .saisie{font:inherit;font-size:13.5px;border:0;outline:0;background:transparent;width:100%;padding:0 8px;height:39px;color:var(--t1);border-radius:0;margin:0;display:block}
.feuille td select.saisie{appearance:none;-webkit-appearance:none;cursor:pointer;text-overflow:ellipsis}
.feuille td.editable:hover select.saisie{background:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='10' height='6'><path d='M1 1l4 4 4-4' fill='none' stroke='%231f8a4c' stroke-width='1.6'/></svg>") no-repeat right 6px center;padding-right:18px}
.feuille td.qui select.saisie{text-align:center;text-align-last:center}
.feuille td.attribuer select.saisie{color:#b45309;font-style:italic}
.feuille td.moyen select.saisie:not(.vide){color:var(--t2)}
.feuille td input[type=date].saisie{cursor:pointer;padding:0 4px;display:flex;align-items:center;justify-content:center;text-align:center}
.feuille td input[type=date].saisie::-webkit-datetime-edit{display:inline-flex;align-items:center;height:100%;padding:0}
.feuille td input[type=date].saisie::-webkit-calendar-picker-indicator{display:none}
.feuille td input[type=date].saisie.vide::-webkit-datetime-edit{color:#b8bcc4}
.feuille td input[type=text].saisie{cursor:text;text-overflow:ellipsis}
.feuille td.interlocuteur{cursor:pointer;padding:0 8px}
.feuille td.interlocuteur .nom-interlocuteur{display:block;overflow:hidden;text-overflow:ellipsis;color:var(--t1)}
.feuille td.interlocuteur.vide .nom-interlocuteur{color:#c4c8cf}
.fenetre.large{max-width:760px}
.entete-interlocuteur,.rangee-interlocuteur{display:grid;grid-template-columns:1.2fr 1.4fr 1fr 136px;gap:8px;align-items:center;margin-top:6px}
.entete-interlocuteur span{font-size:11px;text-transform:uppercase;letter-spacing:.04em;color:#6b7280;font-weight:600}
.rangee-interlocuteur.nouvelle{margin-top:10px;padding-top:10px;border-top:1px dashed var(--grille)}
.rangee-interlocuteur .fin{display:flex;gap:8px;align-items:center;justify-content:flex-end;font-size:13px;white-space:nowrap}
.rangee-interlocuteur .liens a{color:var(--a);font-weight:600;text-decoration:none}
.rangee-interlocuteur .liens a:hover{text-decoration:underline}
.rangee-interlocuteur .petit-rouge{width:26px;height:26px;border-radius:50%;border:1px solid var(--bord);background:#fff;color:#b91c1c;cursor:pointer;font-size:14px;line-height:1;padding:0}
.rangee-interlocuteur .petit-rouge:hover{border-color:#b91c1c;background:#fef2f2}
.rangee-interlocuteur .champ-nom{position:relative}
.rangee-interlocuteur .champ-nom input{width:100%}
.propositions{position:absolute;left:0;right:-120px;top:100%;z-index:5;background:#fff;border:1px solid var(--bord);border-radius:8px;box-shadow:0 8px 24px rgba(16,24,40,.12);padding:4px;display:flex;flex-direction:column;gap:2px;max-height:220px;overflow:auto}
.propositions[hidden]{display:none}
.propositions .proposition{text-align:left;background:none;border:0;border-radius:6px;padding:6px 8px;cursor:pointer;font:inherit;font-size:13px;color:var(--t2);display:flex;gap:8px;align-items:baseline;flex-wrap:wrap}
.propositions .proposition b{color:var(--t1)}
.propositions .proposition .detail{color:var(--t3);font-size:12px}
.propositions .proposition .ou{margin-left:auto;color:var(--a);font-size:11px;font-weight:600;white-space:nowrap}
.propositions .proposition:hover,.propositions .proposition.actif{background:#eaf7ee}
.fenetre .plus-interlocuteur{margin-top:10px;padding:6px 12px;min-height:32px;font-size:13px;color:var(--a);border-color:#8fd3a8}
.fenetre .plus-interlocuteur:hover{background:#eaf7ee}
.feuille td.ticket{text-align:center}
.feuille td.ticket input[type=text].saisie{text-align:center;color:var(--brun);font-weight:600}
.feuille td.ticket a.lien-ticket{color:var(--a);font-weight:600;text-decoration:underline;text-underline-offset:2px}
.feuille td.ticket a.lien-ticket:hover{color:#166534}
.feuille td.ticket .crayon{background:none;border:0;color:#c4c8cf;cursor:pointer;font-size:12px;padding:0 0 0 5px;vertical-align:middle;opacity:0}
.feuille td.ticket:hover .crayon{opacity:1}
.feuille td.ticket .crayon:hover{color:var(--a)}
.feuille td input[type=text].saisie::placeholder{color:transparent}
.feuille td.editable:hover input[type=text].saisie::placeholder,.feuille td input[type=text].saisie:focus::placeholder{color:#c4c8cf}
.feuille td.depassee input[type=date].saisie{color:#b91c1c;font-weight:600}
.feuille td .saisie:disabled{color:var(--t3)}
.feuille td input[type=checkbox]{width:16px;height:16px;margin:0;cursor:pointer;accent-color:#059669;vertical-align:middle}
.feuille td input[type=checkbox]:disabled{cursor:default;accent-color:#9ca3af}
.feuille td.relances,.feuille td.liste{text-overflow:clip;white-space:nowrap}
.feuille td .lien{background:none;border:0;padding:0 2px;cursor:pointer;color:var(--a);text-decoration:underline;font-size:13.5px;font-weight:600}
.feuille td .plus,.feuille td .effacer{display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;border-radius:50%;border:1px solid var(--bord);background:#fff;color:var(--a);font-weight:700;font-size:15px;cursor:pointer;margin-left:6px;line-height:1;padding:0;vertical-align:middle}
.feuille td .plus:hover,.feuille td .effacer:hover{border-color:var(--a);background:#eaf7ee}
.feuille td .effacer{color:#b91c1c;font-size:13px;margin-left:4px}
.feuille td .effacer:hover{border-color:#b91c1c;background:#fef2f2}
.feuille td .retirer{color:#b91c1c;text-decoration:none;font-weight:500;font-size:13px}
.feuille td .retirer:hover{text-decoration:underline}
.feuille td .ajouter{color:#047857;text-decoration:none;font-weight:600;font-size:13px}
.feuille tr.hist td{height:32px;background:#fbfbfc !important;color:var(--t2);font-size:12.5px}
.feuille tr.hist td.fin{color:var(--t3);font-style:italic;padding-left:24px;font-weight:500}
.feuille tr.hist td .effacer{width:auto;height:auto;border:0;border-radius:0;background:none;color:#b91c1c;font-size:12.5px;font-weight:500;text-decoration:none}
.feuille tr.hist td .effacer:hover{text-decoration:underline;background:none}
.vide-liste{padding:40px 20px;color:var(--t2);text-align:center;font-size:15px;background:#fff;border:1px solid var(--bord);border-radius:10px}

/* fenêtre (import de liste) */
body.sans-defilement{overflow:hidden}
.voile{position:fixed;inset:0;z-index:100;background:rgba(0,0,0,.45);display:flex;align-items:center;justify-content:center;padding:16px}
.fenetre{background:var(--carte);color:var(--texte);border-radius:12px;box-shadow:0 20px 60px rgba(0,0,0,.35);width:100%;max-width:560px;max-height:92vh;overflow-y:auto;padding:20px 22px}
.fenetre h2{margin:0 0 4px;font-size:18px}
.fenetre .sous{color:var(--doux);margin:0 0 10px}
.fenetre label{display:block;font-weight:700;font-size:13px;margin:14px 0 5px;color:var(--brun)}
.fenetre input,.fenetre textarea{width:100%;font:inherit;padding:8px 10px;border:1px solid var(--grille);border-radius:6px;background:var(--carte);color:var(--texte)}
.fenetre textarea{min-height:80px;resize:vertical}
.fenetre .boutons{display:flex;gap:10px;justify-content:flex-end;margin-top:18px}
.bouton{background:var(--bouton);color:var(--bouton-texte);border:0;border-radius:8px;font-weight:700;padding:9px 16px;min-height:38px;cursor:pointer}
.bouton.second{background:var(--carte);color:var(--texte);border:1px solid var(--grille)}
.bouton[disabled]{opacity:.5}
.erreur{color:var(--rouge);margin:8px 0 0;min-height:1.3em;font-weight:600}

/* fiche client : deux colonnes, mêmes feuilles */
.fiche{flex:1;overflow:auto;padding:14px;background:#f4f5f7;display:grid;grid-template-columns:1.3fr 1fr;gap:16px;align-items:start;align-content:start}
@media (max-width:1000px){.fiche{grid-template-columns:1fr}}
.carte{background:var(--carte);border:1px solid #e5e7eb;border-radius:10px;padding:12px 14px;box-shadow:0 1px 2px rgba(16,24,40,.04)}
.carte h2{margin:0 0 8px;font-size:12.5px;text-transform:uppercase;letter-spacing:.5px;color:#1e4a2e}
.carte .feuille{min-width:0;table-layout:auto;box-shadow:none;border-radius:0;border:0;border-top:1px solid #e5e7eb}
.carte .feuille th{position:static}
.carte .feuille th:first-child,.carte .feuille td:first-child{position:static}
.carte .feuille th,.carte .feuille td{height:34px}
.carte .attribuer-tout{display:flex;gap:8px;align-items:center;margin:0 0 10px;font-size:13px;color:var(--doux)}
.carte .attribuer-tout select{font:inherit;font-size:13px;padding:3px 6px;border:1px solid var(--grille);border-radius:3px}
.journal{list-style:none;margin:0;padding:0;display:grid;gap:6px}
.journal li{border-left:4px solid var(--a2);padding:6px 10px;background:var(--zebre);border-radius:4px;font-size:13.5px}
.journal li.evt{border-left-color:var(--grille)}
.journal b{display:block}
.journal .sous{color:var(--doux);font-size:12.5px}
.journal .texte{white-space:pre-wrap;margin-top:3px}
.journal .petit{float:right;background:none;border:0;color:var(--rouge);text-decoration:underline;cursor:pointer;font-size:12.5px;padding:0 4px}
.vide{color:var(--doux);padding:16px 8px;text-align:center}

/* connexion */
.connexion{flex:1;display:flex;flex-direction:column;justify-content:center;padding:24px 20px;background:var(--entete);color:#fff}
.connexion .boite{background:var(--carte);color:var(--texte);border-radius:14px;padding:24px 22px;box-shadow:0 10px 40px rgba(0,0,0,.25);max-width:440px;width:100%;margin:0 auto}
.connexion h1{font-size:24px;margin:0 0 6px;color:var(--a)}
.connexion p{color:var(--doux);margin:0 0 14px}
.connexion label{display:block;font-weight:700;font-size:14px;margin:16px 0 6px;color:var(--brun)}
.connexion input{width:100%;font:inherit;padding:11px 14px;border:1px solid var(--grille);border-radius:8px;background:var(--carte);color:var(--texte);min-height:46px;margin-bottom:10px}
.connexion input:focus{outline:none;border-color:var(--a)}
.connexion .bouton{width:100%}

/* acomptes : sûr (vert plein) ou probable (gris) ; virement rapproché en vert ; « pas encore » de facture d'acompte en gris clair */
.pill.sur{background:#e3f5ea;color:#1e6b3a}
.pill.probable{background:#f1f2f4;color:#6b7280}
.feuille td.virement{color:#1e6b3a;font-weight:600;white-space:nowrap}
.feuille td .pas-encore{color:#b8bcc4;font-style:italic;font-weight:500}
