/* Aspect « progiciel Windows » inspiré de WaveSoft : barre de menus, bandeau d'outils bleu, grilles denses */
:root{
  --fond:#e6eaf0; --fenetre:#ffffff; --barre:#f3f4f6; --bleu:#2b5797; --bleu-fonce:#1f3f6e;
  --entete:#dbe2ec; --ligne-alt:#f2f6fb; --selection:#cfe0f7; --texte:#1b2430; --gris:#6b7685;
  --ok:#2f7d32; --erreur:#b3261e; --bord:#b9c3d0;
}
*{box-sizing:border-box}
html,body{margin:0;height:100%}
body{font:13px/1.35 "Segoe UI",Tahoma,Arial,sans-serif;color:var(--texte);background:var(--fond)}
a{color:var(--bleu)}
:focus-visible{outline:2px solid #f0a020;outline-offset:1px}

/* barre de menus */
.menubar{display:flex;flex-wrap:wrap;align-items:stretch;background:var(--barre);border-bottom:1px solid var(--bord);padding:0 4px;position:relative;z-index:20}
.menu{position:relative}
.menu>button{font:inherit;background:none;border:0;padding:6px 10px;cursor:default;color:var(--texte)}
.menu:hover>button,.menu:focus-within>button{background:var(--selection)}
.menu .sous{display:none;position:absolute;left:0;top:100%;min-width:230px;background:#fff;border:1px solid var(--bord);box-shadow:2px 3px 6px rgba(0,0,0,.18);padding:3px 0}
.menu:hover .sous,.menu:focus-within .sous{display:block}
.sous a{display:block;padding:5px 22px 5px 26px;color:var(--texte);text-decoration:none;white-space:nowrap}
.sous a:hover,.sous a:focus{background:var(--bleu);color:#fff}
.sous hr{border:0;border-top:1px solid #dde3ea;margin:3px 6px}
.menubar .droite{margin-left:auto;display:flex;align-items:center;gap:10px;color:var(--gris);padding-right:6px}

/* bandeau d'outils */
.outils{display:flex;flex-wrap:wrap;align-items:center;gap:4px;background:linear-gradient(#3a6ab0,var(--bleu));border-bottom:1px solid var(--bleu-fonce);padding:4px 8px;min-height:38px}
.outils .titre{color:#fff;font-weight:600;font-size:14px;margin-right:14px}
.outils .bouton,.outils button{font:inherit;color:#fff;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.35);border-radius:2px;padding:4px 10px;text-decoration:none;cursor:pointer}
.outils .bouton:hover,.outils button:hover{background:rgba(255,255,255,.28)}
.outils form{display:inline;margin:0}

main{padding:10px}
.fenetre{background:var(--fenetre);border:1px solid var(--bord);box-shadow:1px 1px 0 #fff inset}
.fenetre>h2{margin:0;font-size:13px;font-weight:600;background:var(--entete);border-bottom:1px solid var(--bord);padding:5px 8px}
.fenetre .corps{padding:10px}
.cote{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:10px}
@media (max-width:800px){.cote{grid-template-columns:1fr}}

/* messages */
.msg{padding:7px 10px;margin:0 0 8px;border:1px solid;background:#fff}
.msg.ok{border-color:var(--ok);color:var(--ok)}
.msg.erreur{border-color:var(--erreur);color:var(--erreur)}

/* filtres et grilles */
.filtres{display:flex;flex-wrap:wrap;gap:6px;align-items:center;padding:6px 8px;background:#f7f9fb;border-bottom:1px solid var(--bord)}
input,select,textarea{font:inherit;color:var(--texte);border:1px solid #9aa7b6;background:#fff;padding:3px 5px;border-radius:0}
input[readonly],input:disabled,select:disabled,textarea[readonly]{background:#eef1f5;color:#444}
.grille-wrap{overflow-x:auto}
table.grille{width:100%;border-collapse:collapse;font-size:12.5px}
.grille th{background:var(--entete);text-align:left;font-weight:600;padding:4px 6px;border:1px solid var(--bord);white-space:nowrap;position:sticky;top:0}
.grille td{padding:3px 6px;border-right:1px solid #e1e6ec;border-bottom:1px solid #e9edf2;white-space:nowrap}
.grille tbody tr:nth-child(even){background:var(--ligne-alt)}
.grille tbody tr.lien{cursor:pointer}
.grille tbody tr.lien:hover{background:var(--selection)}
.grille tfoot td{background:var(--entete);font-weight:600;border-top:2px solid var(--bord)}
.n{text-align:right;font-variant-numeric:tabular-nums}
.c{text-align:center}
.vide{color:var(--gris);padding:14px!important;text-align:center}
.etat{display:inline-block;padding:0 6px;border:1px solid;font-size:11.5px}
.etat.encours{color:#8a5a00;border-color:#d9b25c;background:#fff7e3}
.etat.validee{color:var(--ok);border-color:#8bc28d;background:#eef8ee}
.etat.soldee{color:var(--gris);border-color:#c3cad3;background:#f1f3f5}

/* fiches */
.champs{display:grid;grid-template-columns:150px minmax(0,1fr);gap:6px 10px;align-items:center}
.champs label{color:#33414f}
.champs input[type=text],.champs input[type=email],.champs input[type=date],.champs input[type=number],.champs select,.champs textarea{width:100%}
.onglets{display:flex;gap:2px;border-bottom:1px solid var(--bord);margin:0 0 8px}
.onglets span{padding:4px 12px;border:1px solid var(--bord);border-bottom:0;background:var(--entete)}
.actions{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}
.btn{font:inherit;padding:4px 14px;border:1px solid #7b8796;background:linear-gradient(#fff,#e4e8ee);color:var(--texte);cursor:pointer;text-decoration:none;display:inline-block}
.btn:hover{background:linear-gradient(#fff,#d7dde6)}
.btn.prim{border-color:var(--bleu-fonce);background:linear-gradient(#3a6ab0,var(--bleu));color:#fff}
.btn.danger{color:var(--erreur)}

/* saisie des lignes de pièce */
table.lignes input{width:100%;border:1px solid transparent;background:transparent;padding:2px 4px}
table.lignes input:focus{border-color:var(--bleu);background:#fff}
table.lignes td{padding:1px 2px}
table.lignes .code{width:120px}.lignes .q{width:70px}.lignes .pu{width:100px}.lignes .rem{width:60px}.lignes .tv{width:55px}.lignes .mt{width:110px}
.suppr{border:0;background:none;color:var(--erreur);cursor:pointer;font-size:15px}
.totaux{margin-left:auto;border-collapse:collapse;min-width:260px}
.totaux td{padding:4px 8px;border:1px solid var(--bord)}
.totaux tr:last-child td{font-weight:700;background:var(--entete)}

/* bureau */
.tuiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:8px;margin-bottom:10px}
.tuile{background:#fff;border:1px solid var(--bord);padding:8px 10px;text-decoration:none;color:var(--texte)}
.tuile b{display:block;font-size:20px;color:var(--bleu-fonce);font-variant-numeric:tabular-nums}
.tuile:hover{background:var(--selection)}

/* connexion */
.connexion{max-width:340px;margin:12vh auto 0}
.connexion .corps{display:grid;gap:8px}
.connexion input{width:100%;padding:6px}
@media (max-width:600px){.champs{grid-template-columns:1fr}.outils .titre{width:100%}}
@media print{.menubar,.outils,.filtres,.actions{display:none}}
.grille th.n{text-align:right}.grille th.c{text-align:center}
.secteurs{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:8px}
.secteur{display:grid;gap:3px;border:1px solid var(--bord);background:#fff;padding:10px 12px 10px 34px;position:relative;cursor:pointer}
.secteur input{position:absolute;left:10px;top:12px}
.secteur span{color:#3d4a59}.secteur small{color:var(--gris)}
.secteur:has(input:checked){border-color:var(--bleu);background:#eef4fc;box-shadow:inset 3px 0 0 var(--bleu)}
.grille td.texte{white-space:normal;min-width:180px}