/* ============================================================
   Gesti-Mécanique — Identité "atelier"
   Ardoise profonde + accent ambre signal. Type net, layout discipliné.
   ============================================================ */
:root{
  --ink:#0f172a;            /* ardoise sidebar */
  --ink-2:#1e293b;
  --accent:#f59e0b;         /* ambre signal */
  --accent-d:#d97706;
  --bg:#f4f5f7;
  --surface:#ffffff;
  --line:#e2e8f0;
  --text:#1f2937;
  --muted:#6b7280;
  --green:#10b981; --red:#ef4444; --blue:#3b82f6;
  --radius:10px;
  --font:14px;
  --sidebar-w:248px;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  font-family:"Segoe UI",system-ui,-apple-system,Roboto,Arial,sans-serif;
  font-size:var(--font);background:var(--bg);color:var(--text);line-height:1.5;
}
a{color:inherit;text-decoration:none}
.btn{display:inline-flex;align-items:center;gap:6px;border:0;cursor:pointer;
  padding:9px 16px;border-radius:8px;font-weight:600;font-size:.92em;transition:.15s}
.btn-primary{background:var(--accent);color:#1a1206}
.btn-primary:hover{background:var(--accent-d)}
.btn-ghost{background:#fff;border:1px solid var(--line);color:var(--text)}
.btn-ghost:hover{border-color:var(--accent)}
.btn-danger{background:#fee2e2;color:#b91c1c}
.btn-danger:hover{background:#fecaca}
.btn-sm{padding:5px 10px;font-size:.82em}

/* --- Layout --- */
.shell{display:flex;min-height:100vh}
.sidebar{width:var(--sidebar-w);background:var(--ink);color:#cbd5e1;
  position:fixed;inset:0 auto 0 0;display:flex;flex-direction:column;z-index:40;transition:transform .25s}
.sidebar .brand{display:flex;align-items:center;gap:10px;padding:18px 18px;border-bottom:1px solid #ffffff14}
.sidebar .brand img{height:var(--logo-size,40px);width:auto;border-radius:6px}
.sidebar .brand b{color:#fff;font-size:1.05em;letter-spacing:.2px}
.garage-switch{padding:12px 14px;border-bottom:1px solid #ffffff14}
.garage-switch label{font-size:.72em;text-transform:uppercase;letter-spacing:.08em;color:#94a3b8;display:block;margin-bottom:6px}
.garage-switch select{width:100%;padding:8px;border-radius:8px;border:1px solid #ffffff22;background:var(--ink-2);color:#fff}
.nav{flex:1;overflow-y:auto;padding:10px 8px}
.nav .group{font-size:.68em;text-transform:uppercase;letter-spacing:.1em;color:#64748b;padding:14px 12px 6px}
.nav a{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:8px;margin:2px 0;color:#cbd5e1;font-weight:500}
.nav a:hover{background:#ffffff10;color:#fff}
.nav a.active{background:var(--accent);color:#1a1206;font-weight:700}
.nav a .ic{width:18px;text-align:center;opacity:.9}
.sidebar .foot{padding:12px;border-top:1px solid #ffffff14}

.main{flex:1;margin-left:var(--sidebar-w);min-width:0;display:flex;flex-direction:column}
.topbar{background:var(--surface);border-bottom:1px solid var(--line);
  padding:0 22px;height:60px;display:flex;align-items:center;justify-content:space-between;position:sticky;top:0;z-index:30}
.topbar .menu-btn{display:none;background:none;border:0;font-size:1.4em;cursor:pointer}
.topbar h1{font-size:1.15em;margin:0;font-weight:700}
.topbar .user{display:flex;align-items:center;gap:12px}
.avatar{width:34px;height:34px;border-radius:50%;background:var(--accent);color:#1a1206;
  display:flex;align-items:center;justify-content:center;font-weight:700}
.content{padding:22px;flex:1}

/* --- Cards / grid --- */
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:16px;margin-bottom:22px}
.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:18px}
.card .k{font-size:.78em;color:var(--muted);text-transform:uppercase;letter-spacing:.05em}
.card .v{font-size:1.8em;font-weight:800;margin-top:4px}
.card .v.amber{color:var(--accent-d)}

.panel{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden}
.panel .head{padding:16px 18px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:10px}
.panel .head h2{margin:0;font-size:1.05em}
.panel .body{padding:18px}

/* --- Table --- */
table.tbl{width:100%;border-collapse:collapse}
table.tbl th,table.tbl td{text-align:left;padding:11px 14px;border-bottom:1px solid var(--line);font-size:.93em}
table.tbl th{background:#f8fafc;font-size:.74em;text-transform:uppercase;letter-spacing:.05em;color:var(--muted)}
table.tbl tr:hover td{background:#fcfcfd}
.tag{display:inline-block;padding:3px 9px;border-radius:99px;font-size:.74em;font-weight:700}
.tag.green{background:#d1fae5;color:#065f46}
.tag.red{background:#fee2e2;color:#991b1b}
.tag.gray{background:#e5e7eb;color:#374151}
.tag.amber{background:#fef3c7;color:#92400e}

/* --- Forms --- */
.form-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}
.form-grid .full{grid-column:1/-1}
.field label{display:block;font-size:.82em;font-weight:600;margin-bottom:5px;color:#374151}
.field input,.field select,.field textarea{width:100%;padding:10px 12px;border:1px solid var(--line);
  border-radius:8px;font-size:.95em;background:#fff;font-family:inherit}
.field input:focus,.field select:focus,.field textarea:focus{outline:0;border-color:var(--accent);box-shadow:0 0 0 3px #f59e0b22}
.form-actions{display:flex;gap:10px;margin-top:20px}
.check{display:flex;align-items:center;gap:8px}
.check input{width:auto}

/* --- Permissions matrix --- */
.perm-module{border:1px solid var(--line);border-radius:8px;margin-bottom:12px}
.perm-module > .h{background:#f8fafc;padding:10px 14px;font-weight:700;display:flex;justify-content:space-between;align-items:center}
.perm-list{display:flex;flex-wrap:wrap;gap:8px;padding:12px 14px}
.perm-list label{display:flex;align-items:center;gap:6px;background:#fff;border:1px solid var(--line);
  padding:6px 10px;border-radius:99px;font-size:.84em;cursor:pointer}
.perm-list input:checked + span{font-weight:700;color:var(--accent-d)}

/* --- Flash --- */
.flash{padding:12px 16px;border-radius:8px;margin-bottom:16px;font-weight:600}
.flash.success{background:#d1fae5;color:#065f46}
.flash.error{background:#fee2e2;color:#991b1b}

.empty{text-align:center;color:var(--muted);padding:40px 20px}
.toolbar{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.search{flex:1;min-width:180px}

/* --- Login --- */
.login-wrap{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:20px;
  background:var(--ink) center/cover no-repeat;position:relative}
.login-wrap::before{content:"";position:absolute;inset:0;background:#0f172abb}
.login-card{position:relative;background:#fff;border-radius:16px;padding:36px;width:100%;max-width:400px;
  box-shadow:0 25px 60px #00000055}
.login-card .logo{text-align:center;margin-bottom:8px}
.login-card .logo img{height:54px}
.login-card h1{text-align:center;font-size:1.4em;margin:6px 0 2px}
.login-card .sub{text-align:center;color:var(--muted);margin-bottom:24px;font-size:.9em}

/* --- Chat bubble --- */
.chat-fab{position:fixed;right:22px;bottom:22px;width:56px;height:56px;border-radius:50%;
  background:var(--accent);color:#1a1206;display:flex;align-items:center;justify-content:center;
  font-size:1.5em;box-shadow:0 10px 30px #f59e0b55;cursor:pointer;z-index:50;border:0}

/* --- Responsive --- */
@media (max-width:860px){
  .sidebar{transform:translateX(-100%)}
  .sidebar.open{transform:translateX(0)}
  .main{margin-left:0}
  .topbar .menu-btn{display:block}
  .form-grid{grid-template-columns:1fr}
  .scrim{display:none;position:fixed;inset:0;background:#0006;z-index:35}
  .scrim.show{display:block}
}

/* --- Lignes documents --- */
.lignes-table input{padding:7px 8px;border:1px solid var(--line);border-radius:6px;width:100%;font-size:.9em}
.lignes-table td{padding:6px 8px}
.totaux{display:flex;flex-wrap:wrap;gap:20px;justify-content:flex-end;align-items:flex-end;margin-top:16px}
.tot-table{border-collapse:collapse;min-width:240px}
.tot-table td{padding:8px 14px;border-bottom:1px solid var(--line)}
.tot-table td:last-child{text-align:right;font-weight:700}
.tot-table tr.grand td{font-size:1.15em;color:var(--accent-d);border-bottom:0;border-top:2px solid var(--ink)}
.doc-meta{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:16px;margin-bottom:18px}
.doc-meta .b{background:#f8fafc;border:1px solid var(--line);border-radius:8px;padding:12px 14px}
.doc-meta .b .k{font-size:.72em;text-transform:uppercase;color:var(--muted);letter-spacing:.05em}

/* --- Impression --- */
.print-doc{max-width:800px;margin:0 auto;padding:30px;color:#111;font-size:13px}
.print-doc .ph{display:flex;justify-content:space-between;align-items:flex-start;border-bottom:3px solid var(--ink);padding-bottom:16px;margin-bottom:20px}
.print-doc h1{font-size:1.6em;margin:0;color:var(--accent-d)}
.print-doc table{width:100%;border-collapse:collapse;margin:16px 0}
.print-doc th{background:var(--ink);color:#fff;padding:9px;text-align:left;font-size:.85em}
.print-doc td{padding:8px 9px;border-bottom:1px solid #ddd}
.print-doc .tot{margin-left:auto;width:300px}
.print-doc .tot td{border:0;padding:6px 9px}
.print-actions{max-width:800px;margin:14px auto;display:flex;gap:10px}
@media print{ .print-actions{display:none} body{background:#fff} }