:root{--vert:#1f7a3d;--vert-fonce:#155a2c;--jaune:#f4c542;--bord:#d9e2d9;--gris:#5a6b5a;--encre:#1b251b;--rouge:#c0392b}
*{box-sizing:border-box}
body{margin:0;font-family:-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;color:var(--encre);background:#f3f6f3}
a{color:var(--vert-fonce)}
header.top{background:var(--vert-fonce);color:#fff;position:sticky;top:0;z-index:50;box-shadow:0 2px 6px rgba(0,0,0,.2)}
header.top .inner{max-width:1100px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;padding:10px 16px;gap:12px;flex-wrap:wrap}
header.top .brand{color:#fff;font-weight:bold;font-size:1.15rem;text-decoration:none}
header.top nav a{color:#fff;text-decoration:none;margin-left:14px;font-size:.92rem}
header.top nav a.cart{position:relative}
.cc{display:inline-block;min-width:18px;height:18px;line-height:18px;text-align:center;background:var(--jaune);color:#222;border-radius:9px;font-size:.72rem;font-weight:bold;padding:0 5px;margin-left:2px}
.cc.z{display:none}
main{max-width:1100px;margin:0 auto;padding:16px}

/* filtres */
.filters{display:flex;gap:8px;flex-wrap:wrap;align-items:center;background:#fff;border:1px solid var(--bord);border-radius:8px;padding:10px;margin-bottom:10px;position:sticky;top:52px;z-index:40}
.filters select,.filters input[type=search]{padding:8px;border:1px solid var(--bord);border-radius:6px;font-size:.9rem}
.filters input[type=search]{flex:1;min-width:160px}
.filters button{background:var(--vert);color:#fff;border:none;border-radius:6px;padding:8px 14px;cursor:pointer;font-weight:bold}
.filters .onlybox{font-size:.85rem;color:var(--gris);display:flex;align-items:center;gap:5px}
.filters .clear{font-size:.82rem;color:var(--rouge);text-decoration:none}
.count{color:var(--gris);font-size:.85rem;margin:6px 2px}

h2.fam{font-size:1.05rem;color:var(--vert-fonce);border-bottom:2px solid var(--jaune);padding-bottom:5px;margin:22px 0 10px}
h2.fam small{color:var(--gris);font-weight:normal;font-size:.78rem;text-transform:uppercase;letter-spacing:.4px;margin-left:8px}

/* carte pièce */
.part{display:flex;gap:14px;background:#fff;border:1px solid var(--bord);border-radius:8px;padding:12px;margin-bottom:10px}
.part.sel{border-color:var(--vert);box-shadow:0 0 0 2px rgba(31,122,61,.18)}
.imgs{width:120px;flex:none;display:flex;flex-direction:column;gap:6px}
.imgs .main{width:120px;height:90px;object-fit:cover;border:1px solid var(--bord);border-radius:5px;background:#fff}
.imgs .main.ph,.imgs .main.broken{display:flex;align-items:center;justify-content:center;background:#eef4ee;color:#9bb7a3;font-size:1.6rem;border:1px dashed var(--bord)}
.imgs .main.broken{font-size:0}.imgs .main.broken::after{content:"📷";font-size:1.6rem}
.thumbs{display:flex;flex-wrap:wrap;gap:5px;align-items:center}
.thumb{position:relative;width:34px;height:34px}
.thumb img{width:34px;height:34px;object-fit:cover;border-radius:4px;border:1px solid var(--bord)}
.thumb button{position:absolute;top:-6px;right:-6px;width:16px;height:16px;line-height:14px;border-radius:50%;border:none;background:var(--rouge);color:#fff;font-size:11px;cursor:pointer;padding:0}
.addph{width:34px;height:34px;border:1px dashed var(--vert);border-radius:4px;display:flex;align-items:center;justify-content:center;font-size:.6rem;color:var(--vert-fonce);cursor:pointer;text-align:center;line-height:1}
.addph input{display:none}
.body{flex:1;min-width:0}
.body .nm{font-weight:bold;font-size:1rem}
.stars{color:#c8851a;letter-spacing:1px;font-size:.9rem}
.bdg{font-size:.66rem;font-weight:bold;color:#fff;border-radius:9px;padding:1px 7px;margin-left:4px;white-space:nowrap}
.b-ok{background:var(--vert)}.b-occ{background:#8a6d3b}.b-cons{background:var(--rouge)}
.body .det{color:var(--gris);font-size:.85rem;margin:3px 0}
.body .ref{font-size:.78rem;color:#0b5d34;background:#eef6ef;border-left:3px solid var(--vert);padding:3px 8px;border-radius:3px;margin:5px 0}
.note{width:100%;min-height:42px;border:1px solid var(--bord);border-radius:6px;padding:6px 8px;font-family:inherit;font-size:.86rem;resize:vertical}
.note:focus{outline:none;border-color:var(--vert)}
.actions{display:flex;align-items:center;gap:12px;margin-top:7px;flex-wrap:wrap}
.ord{font-size:.9rem;font-weight:bold;color:var(--vert-fonce);display:flex;align-items:center;gap:5px;cursor:pointer}
.ord input{width:17px;height:17px}
.qty{width:62px;padding:5px;border:1px solid var(--bord);border-radius:6px}
.gimg{font-size:.78rem;color:var(--gris);text-decoration:none;margin-left:auto}

/* auth */
.auth{max-width:380px;margin:8vh auto;background:#fff;border:1px solid var(--bord);border-radius:10px;padding:26px}
.auth h2{margin:0 0 12px;color:var(--vert-fonce)}
.auth input{width:100%;padding:11px;border:1px solid var(--bord);border-radius:6px;margin:8px 0;font-size:1rem}
.auth button{width:100%;background:var(--vert);color:#fff;border:none;border-radius:6px;padding:12px;font-weight:bold;font-size:1rem;cursor:pointer}
.err{color:var(--rouge);font-size:.88rem}

/* commande */
.cmdhead{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:10px;margin-bottom:10px}
.cmdhead h2{color:var(--vert-fonce);margin:0}
.cmdhead button,.btnlink{background:var(--vert);color:#fff;border:none;border-radius:6px;padding:8px 14px;cursor:pointer;text-decoration:none;font-weight:bold;font-size:.9rem}
.btnlink{background:#fff;color:var(--vert-fonce);border:1px solid var(--bord)}
table.cmd{width:100%;border-collapse:collapse;background:#fff;border:1px solid var(--bord);border-radius:8px;overflow:hidden}
table.cmd th,table.cmd td{border-bottom:1px solid var(--bord);padding:9px 10px;text-align:left;font-size:.9rem;vertical-align:top}
table.cmd th{background:var(--vert);color:#fff}
table.cmd tr.grp td{background:#eef4ee;font-weight:bold;color:var(--vert-fonce);font-size:.82rem}
table.cmd .pc img{width:54px;height:40px;object-fit:cover;border-radius:4px;border:1px solid var(--bord);margin-right:8px;float:left}
table.cmd .q{font-weight:bold;text-align:center}
table.cmd .noprint button{background:var(--rouge);color:#fff;border:none;width:24px;height:24px;border-radius:50%;cursor:pointer}
.empty{color:var(--gris);background:#fff;border:1px solid var(--bord);border-radius:8px;padding:20px}

/* toast */
#toast{position:fixed;left:50%;bottom:22px;transform:translateX(-50%) translateY(40px);background:var(--vert-fonce);color:#fff;padding:10px 18px;border-radius:8px;font-size:.9rem;opacity:0;transition:.25s;pointer-events:none;z-index:100}
#toast.show{opacity:1;transform:translateX(-50%) translateY(0)}
#toast.err{background:var(--rouge)}

/* barre outils + ajouter une pièce */
.toolbar{display:flex;justify-content:flex-end;margin:4px 2px 0}
.addpart{display:inline-block;background:var(--vert);color:#fff;text-decoration:none;font-weight:bold;font-size:.86rem;padding:8px 14px;border-radius:6px}
.addpart:hover{background:var(--vert-fonce)}

/* mini boutons sur la carte (modifier / supprimer) */
.mini{background:#fff;border:1px solid var(--bord);border-radius:6px;padding:4px 8px;cursor:pointer;text-decoration:none;font-size:.9rem;line-height:1.2}
.actions .gimg+.mini{margin-left:0}
.mini.del{color:var(--rouge);border-color:#e6c3bd}
.mini:hover{border-color:var(--vert)}

/* formulaire pièce */
.partform{max-width:680px;background:#fff;border:1px solid var(--bord);border-radius:10px;padding:20px;margin:4px auto}
.partform label{display:block;font-size:.82rem;color:var(--gris);font-weight:bold;margin:10px 0 0}
.partform input[type=text],.partform input:not([type]),.partform textarea,.partform select{width:100%;padding:9px;border:1px solid var(--bord);border-radius:6px;font-family:inherit;font-size:.92rem;margin-top:4px}
.partform textarea{resize:vertical}
.partform .row2{display:flex;gap:14px;flex-wrap:wrap}
.partform .row2>label,.partform .row2>div{flex:1;min-width:200px}
.partform .flags{display:flex;flex-direction:column;justify-content:flex-end;gap:6px;margin-top:18px}
.partform .flags .cb{font-weight:normal;color:var(--encre);display:flex;align-items:center;gap:6px}
.partform .formbtns{margin-top:18px;display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.partform button[type=submit]{background:var(--vert);color:#fff;border:none;border-radius:6px;padding:11px 18px;font-weight:bold;cursor:pointer}
button.danger{background:#fff;color:var(--rouge);border:1px solid #e6c3bd;border-radius:6px;padding:10px 14px;font-weight:bold;cursor:pointer;margin-left:auto}

/* dossier (liste des documents) */
.doclist{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:12px;margin-top:8px}
.doccard{display:flex;flex-direction:column;gap:4px;background:#fff;border:1px solid var(--bord);border-radius:8px;padding:14px;text-decoration:none;color:var(--encre)}
.doccard:hover{border-color:var(--vert);box-shadow:0 2px 8px rgba(31,122,61,.12)}
.doccard .dt{font-weight:bold;color:var(--vert-fonce)}
.doccard .df{font-size:.74rem;color:var(--gris)}

@media(max-width:560px){.imgs{width:84px}.imgs .main{width:84px;height:64px}.part{gap:10px}}
@media print{header.top,.filters,.toolbar,.noprint,#toast,.count{display:none!important}main{max-width:100%}table.cmd th{background:#eee;color:#000}}
