*{box-sizing:border-box}
:root{
  --navy:#173f83;--navy-dark:#0f2c5f;--navy-light:#e8edf7;
  --orange:#f07d1a;--orange-dark:#d9670a;
  --green:#16804b;--red:#c0392b;--gray:#667085;
  --ink:#1b2430;--muted:#667085;--line:#e1e6ee;
  --bg:#eef1f7;--card:#ffffff;
  --shadow-sm:0 1px 2px rgba(15,44,95,.06);
  --shadow-md:0 4px 14px rgba(15,44,95,.08);
  --radius:12px;
}
body{margin:0;background:
  radial-gradient(1100px 420px at 100% -10%, #dfe7f7 0%, transparent 60%),
  var(--bg);
  font-family:'Inter',Arial,Helvetica,sans-serif;color:var(--ink);-webkit-font-smoothing:antialiased}

.app-layout{display:flex;min-height:100vh}

.sidebar{width:236px;flex:0 0 236px;background:linear-gradient(180deg,var(--navy) 0%,var(--navy-dark) 100%);
  color:#fff;display:flex;flex-direction:column;position:sticky;top:0;height:100vh;box-shadow:var(--shadow-md);z-index:5}
.sidebar-brand{padding:22px 20px 18px;font-size:20px;font-weight:800;letter-spacing:.3px;display:flex;align-items:center;gap:9px;border-bottom:1px solid rgba(255,255,255,.12)}
.sidebar-brand .dot{width:9px;height:9px;border-radius:50%;background:var(--orange);box-shadow:0 0 0 4px rgba(240,125,26,.25);display:inline-block;flex:0 0 auto}
.sidebar-brand .brand-sub{font-size:11px;font-weight:500;opacity:.7;margin-left:auto;letter-spacing:.2px}
.sidebar-nav{flex:1;padding:14px 12px;display:flex;flex-direction:column;gap:4px;overflow-y:auto}
.sidebar-nav button{display:flex;align-items:center;gap:11px;background:transparent;color:rgba(255,255,255,.82);
  border:1px solid transparent;border-radius:9px;padding:11px 13px;font-weight:600;font-size:13.5px;text-align:left;width:100%}
.sidebar-nav button svg{width:17px;height:17px;flex:0 0 auto;opacity:.9}
.sidebar-nav button:hover{background:rgba(255,255,255,.08);color:#fff}
.sidebar-nav button.active{background:#fff;color:var(--navy-dark);box-shadow:var(--shadow-sm)}
.sidebar-footer{padding:14px 20px;font-size:11px;opacity:.75;border-top:1px solid rgba(255,255,255,.12)}

button{border:0;border-radius:8px;padding:10px 16px;font-weight:600;cursor:pointer;font-family:inherit;font-size:13px;transition:transform .12s ease,box-shadow .12s ease,background-color .12s ease,filter .12s ease}
button:hover{filter:brightness(1.06)}
button:active{transform:translateY(1px)}
.primary{background:var(--navy);color:#fff;box-shadow:var(--shadow-sm)}
.primary:hover{background:var(--navy-dark)}
.green{background:var(--green);color:#fff}
.red{background:var(--red);color:#fff}
.orange{background:var(--orange);color:#fff}
.gray{background:var(--gray);color:#fff}

.segmented{display:inline-flex;background:var(--navy-light);border-radius:9px;padding:3px;gap:3px}
.seg{background:transparent;color:var(--navy);padding:8px 14px;box-shadow:none}
.seg.active{background:#fff;color:var(--navy-dark);box-shadow:var(--shadow-sm)}
.spacer{flex:1}

main{flex:1;min-width:0;max-width:1450px;margin:22px auto;padding:0 18px}
.page{display:none}.page.active{display:block;animation:fadein .18s ease}
@keyframes fadein{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}
@keyframes shimmer{0%{background-position:200% 0}100%{background-position:-200% 0}}
@keyframes slideInUp{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}
.stat{animation:slideInUp .5s ease-out;animation-fill-mode:both}
.stat:nth-child(1){animation-delay:.05s}
.stat:nth-child(2){animation-delay:.1s}
.stat:nth-child(3){animation-delay:.15s}
.stat:nth-child(4){animation-delay:.2s}
.stat:nth-child(5){animation-delay:.25s}
.stat:nth-child(6){animation-delay:.3s}
.stat:nth-child(7){animation-delay:.35s}
.stat:nth-child(8){animation-delay:.4s}

.card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:20px;margin-bottom:16px;box-shadow:var(--shadow-md);transition:all .25s cubic-bezier(0.4,0,0.2,1);position:relative;overflow:hidden}
.card::before{content:'';position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,var(--navy),var(--orange));opacity:0;transition:opacity .25s ease}
.card:hover{box-shadow:0 8px 24px rgba(15,44,95,.12);transform:translateY(-2px)}
.card:hover::before{opacity:1}
.card h2{margin:0 0 16px;font-size:17px;font-weight:700;color:var(--navy-dark);letter-spacing:-.3px}

.grid4{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:16px}
label{display:block;font-size:11px;font-weight:700;color:var(--muted);margin-bottom:5px;text-transform:uppercase;letter-spacing:.4px}
input,select{width:100%;padding:9px 11px;border:1.5px solid var(--line);border-radius:8px;font-size:13px;font-family:inherit;background:#fbfcfe;transition:border-color .12s ease,box-shadow .12s ease}
input:focus,select:focus{outline:none;border-color:var(--navy);box-shadow:0 0 0 3px rgba(23,63,131,.12);background:#fff}
input:disabled,input[readonly],select:disabled{background:#f1f3f5;color:#59636f}

.toolbar{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.toolbar label{display:flex;align-items:center;gap:5px;margin:0;font-size:12px;white-space:nowrap}.toolbar label input{width:auto;padding:7px 8px}
.hint{font-size:11.5px;color:var(--muted);margin-top:9px;line-height:1.5}

.badge{display:inline-flex;align-items:center;gap:5px;padding:5px 11px;border-radius:20px;font-size:11px;font-weight:700;background:var(--navy-light);color:var(--navy)}
.badge.lock{background:#fdecec;color:#a11a1a}.badge.open{background:#e7f7ee;color:#146c3a}.badge.conv{background:#fff3e0;color:#b65c00}
.badge.impayee{background:#fdecec;color:#a11a1a}.badge.partiellement_payee{background:#fff3e0;color:#b65c00}.badge.payee{background:#e7f7ee;color:#146c3a}
.pay-select{width:auto;min-width:160px;padding:6px 8px;font-size:11.5px}

.stats{display:flex;gap:14px;flex-wrap:wrap}
.stat{background:linear-gradient(135deg,#fff 0%,#f8fafc 100%);border:1.5px solid var(--line);border-radius:14px;padding:20px;min-width:180px;box-shadow:0 2px 8px rgba(15,44,95,.06);transition:all .3s cubic-bezier(0.4,0,0.2,1);position:relative;overflow:hidden;border-left:5px solid var(--navy)}
.stat::before{content:'';position:absolute;top:-50%;right:-50%;width:100%;height:100%;background:radial-gradient(circle,rgba(240,125,26,.08),transparent);transition:all .6s ease;pointer-events:none}
.stat:hover{transform:translateY(-4px);box-shadow:0 12px 24px rgba(15,44,95,.12);border-left-color:var(--orange)}
.stat:hover::before{right:-20%;top:-20%}
.stat b{display:block;font-size:28px;color:var(--navy-dark);font-weight:800;margin-bottom:8px;line-height:1}
.stat span{font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:.5px;font-weight:600}
.stat[style*='--green'] .stat-icon,
.stat[style*='border-left-color:var(--green)']::after{content:'✓';position:absolute;top:16px;right:16px;font-size:24px;opacity:.15;font-weight:800;color:var(--green)}
.stat[style*='--red'] .stat-icon,
.stat[style*='border-left-color:var(--red)']::after{content:'!';position:absolute;top:16px;right:16px;font-size:24px;opacity:.15;font-weight:800;color:var(--red)}

.table-scroll{overflow:auto;border-radius:10px}
.data{width:100%;border-collapse:collapse}
.data th,.data td{border-bottom:1px solid var(--line);padding:10px 9px;font-size:12.5px}
.data th{background:linear-gradient(135deg,#f8fafc 0%,#f0f4f8 100%);color:var(--navy-dark);text-align:left;font-weight:700;font-size:11px;text-transform:uppercase;letter-spacing:.4px;border-bottom:2px solid var(--navy-light)}

.data tbody tr:hover{background:linear-gradient(90deg,rgba(23,63,131,.04) 0%,rgba(240,125,26,.04) 100%);border-left:3px solid var(--navy)}
.data td.num{text-align:right;font-variant-numeric:tabular-nums;color:var(--navy-dark);font-weight:600}
.stock-negative{color:var(--red)!important}.stock-positive{color:var(--green)!important}
.stock-period-summary{display:grid;grid-template-columns:repeat(4,minmax(150px,1fr));gap:10px;margin:14px 0 16px}.stock-summary-card{background:linear-gradient(135deg,#f8fafc,#fff);border:1px solid var(--line);border-radius:10px;padding:12px 14px}.stock-summary-card span{display:block;color:var(--muted);font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.45px}.stock-summary-card b{display:block;margin-top:5px;color:var(--navy-dark);font-size:19px}.stock-summary-card small{display:block;margin-top:3px;color:var(--muted);font-size:11px}.stock-period-empty{padding:12px 14px;background:var(--navy-light);color:var(--navy);border-radius:9px;font-size:12px;font-weight:600}.stock-table-wrap{border:1px solid var(--line);border-radius:10px}.stock-data{min-width:1250px}.stock-data th{white-space:normal}.stock-data .stock-group-head th{background:#e8edf7;color:var(--navy-dark);text-align:center;border-bottom:1px solid #cdd8ea}.stock-data .stock-group-head th:first-child{text-align:left}.stock-article{min-width:210px}.stock-code{font-size:11px;font-weight:800;color:var(--navy);letter-spacing:.3px}.stock-name{margin-top:3px;color:var(--ink);font-weight:600}.stock-initial{display:inline-block;margin-top:7px;padding:3px 7px;border-radius:12px;background:#e9f8ef;color:var(--green);font-size:10px;font-weight:800}.stock-metric{font-variant-numeric:tabular-nums;font-weight:750}.stock-rotation{display:inline-flex;flex-direction:column;align-items:flex-end;gap:3px}.stock-rotation b{color:var(--navy-dark);font-size:15px}.stock-rotation small{color:var(--muted);font-size:10px;white-space:nowrap}.stock-rotation-good b{color:var(--green)}.stock-rotation-na b{color:var(--gray)}
.data td.actions{white-space:nowrap;display:flex;gap:6px;flex-wrap:wrap}
.data td.actions button{padding:6px 10px;font-size:11.5px;transition:all .2s ease}
.search{max-width:360px;background:#fff url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="%23667085" stroke-width="2"><circle cx="11" cy="11" r="7"/><line x1="21" y1="21" x2="16.65" y2="16.65"/></svg>') no-repeat 11px center;padding-left:32px}

/* ===== Fenêtre d'import Excel ===== */
.modal-backdrop{position:fixed;inset:0;z-index:50;display:flex;align-items:center;justify-content:center;padding:20px;background:rgba(15,44,95,.48);backdrop-filter:blur(3px)}
.modal-backdrop[hidden]{display:none}
.import-modal{width:min(760px,100%);max-height:calc(100vh - 40px);overflow:auto;background:#fff;border-radius:14px;box-shadow:0 20px 54px rgba(15,44,95,.3);padding:24px;animation:slideInUp .18s ease}
.message-modal{width:min(430px,100%);background:#fff;border-radius:16px;box-shadow:0 24px 64px rgba(15,44,95,.34);padding:26px;text-align:center;animation:slideInUp .18s ease}
.message-icon{width:44px;height:44px;margin:0 auto 13px;border-radius:50%;display:grid;place-items:center;background:var(--navy-light);color:var(--navy);font-size:25px;font-weight:800;font-family:Georgia,serif}.message-modal h2{margin:0;color:var(--navy-dark);font-size:19px}.message-modal p{margin:10px 0 0;color:var(--ink);font-size:13px;line-height:1.55;white-space:pre-wrap}.message-modal .modal-actions{justify-content:center}.message-backdrop.message-error .message-icon{background:#fdecec;color:var(--red)}.message-backdrop.message-success .message-icon{background:#e7f7ee;color:var(--green)}
.modal-header{display:flex;justify-content:space-between;gap:16px;align-items:flex-start;border-bottom:1px solid var(--line);padding-bottom:14px}
.modal-header h2{margin:0;color:var(--navy-dark);font-size:19px}.modal-header p{margin:6px 0 0;color:var(--muted);font-size:12px;line-height:1.5}
.modal-close{flex:0 0 auto;width:32px;height:32px;padding:0;background:#f1f3f5;color:var(--gray);font-size:23px;line-height:1}.modal-close:hover{background:#fdecec;color:var(--red)}
.import-intro{margin:16px 0 10px;font-size:12.5px;line-height:1.55}.import-columns{max-height:310px;border:1px solid var(--line)}
.import-columns code{font-family:Consolas,monospace;font-size:11px;color:var(--navy-dark);background:var(--navy-light);padding:2px 5px;border-radius:4px}
.modal-actions{display:flex;justify-content:flex-end;gap:8px;flex-wrap:wrap;margin-top:18px}

/* ===== Feuille A4 — Bon de Livraison / Facture ===== */
.sheet-wrap{display:flex;justify-content:center}
.sheet{width:210mm;min-height:297mm;background:#fff;box-shadow:0 0 0 1px var(--line);display:flex;flex-direction:column;padding:14mm 12mm}

.inv-header{display:grid;grid-template-columns:32% 36% 32%;align-items:center;margin-bottom:9mm}
.inv-header .navy-block{background:#0b1f6b;height:9mm;border-radius:1px}
.inv-logo{text-align:center}
.inv-logo .agt{font-size:30px;font-weight:800;color:#0b1f6b;letter-spacing:1px;line-height:1}
.inv-logo .tag{font-size:9px;letter-spacing:2px;color:#c0504d;margin-top:2px}
.inv-meta{text-align:right;font-size:11px;color:#0b1f6b;font-weight:700;line-height:1.6}
.inv-meta .sub{font-weight:400;font-style:italic;color:#667085;font-size:9.5px}

.invoice-content{flex:1;font-size:9px}
.invoice-head{display:grid;grid-template-columns:52% 48%;margin-bottom:6mm}
.blocklabel{font-weight:700;color:#0b1f6b;font-size:10.5px;margin-bottom:2px}
.soc,.clientbox{line-height:1.5}
.soc b,.clientbox b{display:block;font-size:10.5px}

.invoice-table{width:100%;border-collapse:collapse;table-layout:fixed;margin-top:2mm}
.invoice-table th,.invoice-table td{border:1px solid #7d8b9a;padding:3px;height:7mm}
.invoice-table th{font-size:7.6px;color:#173f83;text-align:center;background:#eef1f6}
.invoice-table td{font-size:8.2px;font-weight:600}
.invoice-table td input,.invoice-table td select{border:0;background:transparent;padding:0;font-size:8.2px;height:auto}
.print-article-code{display:none}
.num{text-align:right!important}.center{text-align:center}
.c1{width:8%}.c2{width:25%}.c3{width:8%}.c3b{width:7%}.c4{width:7%}.c5{width:9%}.cact{width:26px}
.cact button{width:22px;height:22px;padding:0;border-radius:6px;background:#fdecec;color:#a11a1a;font-weight:800;line-height:1}
.totals{margin-left:auto;width:62%;margin-top:9mm}
.totals .r{display:flex;justify-content:space-between;border-bottom:1px solid #ccd2d8;padding:4px 0;font-weight:700}
.totals .grand{font-size:11px;color:#173f83}
.words{margin-top:7mm;text-align:center;font-weight:700;font-size:9px}

.inv-footer{margin-top:10mm;padding-top:4mm;border-top:1px solid #ccd2d8}
.inv-footer .row{display:grid;grid-template-columns:1fr 1fr 1fr;font-size:9px;color:#333;margin-bottom:3mm}
.inv-footer .row div b{display:flex;align-items:center;gap:4px;color:#0b1f6b;margin-bottom:1mm}
.inv-footer .navy-bar{height:5mm;background:#0b1f6b}

/* À l'écran, la zone de saisie reste confortable. Les dimensions A4 exactes
   sont appliquées uniquement lors de l'impression / de la génération PDF. */
@media screen{
 .sheet-wrap{padding-bottom:18px}
 .sheet{width:min(100%,1320px);min-height:860px;padding:32px 34px;border-radius:14px;box-shadow:0 12px 30px rgba(15,44,95,.14)}
 .inv-header{margin-bottom:26px}.inv-logo .agt{font-size:38px}.inv-logo .tag{font-size:11px}.inv-meta{font-size:14px}.inv-meta .sub{font-size:12px}
 .invoice-content{font-size:13px}.invoice-head{margin-bottom:20px}.blocklabel{font-size:13px}.soc,.clientbox{line-height:1.6}.soc b,.clientbox b{font-size:14px}
 .invoice-table{margin-top:16px}.invoice-table th,.invoice-table td{padding:9px 8px;height:46px}.invoice-table th{font-size:11px}.invoice-table td{font-size:13px}
 .invoice-table td input,.invoice-table td select{width:100%;min-height:34px;padding:7px 6px;border:1px solid #d7dee9;border-radius:6px;background:#fff;font-size:13px}
 .invoice-table .cact button{width:30px;height:30px;font-size:17px}.totals{margin-top:26px}.totals .r{padding:7px 0;font-size:14px}.totals .grand{font-size:16px}.words{margin-top:20px;font-size:12px}.inv-footer{margin-top:28px}.inv-footer .row{font-size:11px}
}

/* ===== PAGE DE LOGIN ===== */
.login-page{background:radial-gradient(1100px 420px at 100% -10%, #dfe7f7 0%, transparent 60%),var(--bg);justify-content:center;align-items:center;min-height:100vh;font-family:'Inter',Arial,Helvetica,sans-serif}
.login-container{background:#fff;border-radius:16px;box-shadow:0 10px 40px rgba(15,44,95,.15);padding:48px;max-width:400px;width:100%;text-align:center}
.login-logo{font-size:48px;font-weight:800;color:var(--navy-dark);margin-bottom:8px;letter-spacing:.5px}
.login-logo .login-subtitle{display:block;font-size:16px;font-weight:500;color:var(--orange);margin-top:4px;letter-spacing:.2px}
.login-container h1{margin:24px 0 32px;font-size:28px;color:var(--navy-dark);font-weight:700}
.login-container form{display:flex;flex-direction:column;gap:16px}
.form-group{text-align:left}
.form-group label{display:block;font-weight:700;color:var(--muted);margin-bottom:8px;font-size:13px}
.form-group input{width:100%;padding:12px;border:1.5px solid var(--line);border-radius:8px;font-size:14px;font-family:inherit}
.form-group input:focus{outline:none;border-color:var(--navy);box-shadow:0 0 0 3px rgba(23,63,131,.12)}
.login-error{color:var(--red);font-size:13px;background:#fdecec;padding:12px;border-radius:8px;margin:0 0 16px}
.login-hint{margin-top:24px;padding-top:24px;border-top:1px solid var(--line);font-size:12px;color:var(--muted);line-height:1.6}

/* ===== POWER BI STYLE DASHBOARD ===== */
#page-dashboard{padding-top:8px}
.dashboard-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:28px;padding-bottom:20px;border-bottom:2px solid var(--line)}
.dashboard-header h1{animation:slideInUp .5s ease-out}
.dashboard-header > div:last-child{animation:slideInUp .5s ease-out;animation-delay:.1s;display:flex;gap:8px;padding:8px 16px;background:linear-gradient(135deg,#f0f4f8,#f8fafc);border-radius:10px;border:1px solid var(--line)}
.kpi-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:16px;margin-bottom:16px}
.kpi-card{background:linear-gradient(135deg,#fff 0%,#f8fafc 100%);border:1.5px solid var(--line);border-radius:12px;padding:18px;display:flex;align-items:center;gap:14px;min-width:0;transition:all .3s cubic-bezier(0.4,0,0.2,1);position:relative;overflow:hidden;cursor:default;animation:slideInUp .5s ease-out}
.kpi-card::before{content:'';position:absolute;top:-50%;right:-50%;width:200%;height:200%;background:radial-gradient(circle,rgba(240,125,26,.08),transparent);opacity:0;transition:all .6s ease;pointer-events:none}
.kpi-card:nth-child(1){animation-delay:.05s}.kpi-card:nth-child(2){animation-delay:.1s}.kpi-card:nth-child(3){animation-delay:.15s}.kpi-card:nth-child(4){animation-delay:.2s}.kpi-card:nth-child(5){animation-delay:.25s}.kpi-card:nth-child(6){animation-delay:.3s}
.kpi-card:hover{transform:translateY(-6px);box-shadow:0 12px 32px rgba(15,44,95,.14);border-color:var(--orange)}
.kpi-card:hover::before{opacity:1;right:-20%;top:-20%}
.kpi-icon{width:48px;height:48px;border-radius:10px;display:flex;align-items:center;justify-content:center;flex:0 0 48px;color:#fff;font-size:24px}
.kpi-primary .kpi-icon{background:linear-gradient(135deg,var(--navy),#0f2c5f)}
.kpi-accent .kpi-icon{background:linear-gradient(135deg,var(--orange),#d9670a)}
.kpi-purple .kpi-icon{background:linear-gradient(135deg,#8b5cf6,#6d28d9)}
.kpi-success .kpi-icon{background:linear-gradient(135deg,var(--green),#15803d)}
.kpi-danger .kpi-icon{background:linear-gradient(135deg,var(--red),#991b1b)}
.kpi-cyan .kpi-icon{background:linear-gradient(135deg,#06b6d4,#0891b2)}
.kpi-pink .kpi-icon{background:linear-gradient(135deg,#ec4899,#db2777)}
.kpi-teal .kpi-icon{background:linear-gradient(135deg,#14b8a6,#0d9488)}
.kpi-icon svg{width:28px;height:28px;fill:currentColor}
.kpi-content{flex:1;min-width:0}
.kpi-value{font-size:clamp(18px,1.65vw,24px);font-weight:800;color:var(--navy-dark);line-height:1.15;margin-bottom:4px;overflow-wrap:anywhere}
.kpi-label{font-size:12px;color:var(--muted);text-transform:uppercase;letter-spacing:.4px;font-weight:600;overflow-wrap:anywhere}
.kpi-trend{margin-top:7px;font-size:11.5px;font-weight:700;min-height:15px;letter-spacing:.1px;overflow-wrap:anywhere}
.kpi-trend .trend-up{display:inline-flex;align-items:center;gap:3px;color:var(--green);background:rgba(22,128,75,.1);padding:2px 8px;border-radius:20px}
.kpi-trend .trend-down{display:inline-flex;align-items:center;gap:3px;color:var(--red);background:rgba(192,57,43,.1);padding:2px 8px;border-radius:20px}
.kpi-trend .trend-flat{display:inline-flex;align-items:center;gap:3px;color:var(--muted);background:#f0f4f8;padding:2px 8px;border-radius:20px}
.kpi-trend .trend-arrow{font-size:10px}
.chart-grid{display:grid;grid-template-columns:1fr;gap:16px}
.chart-grid-2{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}
.chart-card{background:linear-gradient(135deg,#fff 0%,#f8fafc 100%);border:1.5px solid var(--line);border-radius:14px;padding:20px;box-shadow:0 2px 8px rgba(15,44,95,.06);transition:all .3s cubic-bezier(0.4,0,0.2,1);animation:slideInUp .5s ease-out}
.chart-canvas-box{position:relative;width:100%}
.chart-canvas-box.h-md{height:300px}
.chart-canvas-box.h-lg{height:320px}
.chart-card:hover{box-shadow:0 12px 32px rgba(15,44,95,.12);transform:translateY(-3px);border-color:var(--orange)}
.chart-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px;padding-bottom:12px;border-bottom:1px solid var(--line)}
.chart-header h2{margin:0;font-size:16px;font-weight:700;color:var(--navy-dark);letter-spacing:-.3px}
.chart-badge{display:inline-flex;align-items:center;gap:4px;padding:4px 10px;background:#f0f4f8;color:var(--navy);border-radius:6px;font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.3px}
@media(max-width:1024px){.chart-grid-2{grid-template-columns:1fr}.kpi-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:600px){.kpi-grid{grid-template-columns:1fr}.dashboard-header{flex-direction:column;gap:16px;align-items:flex-start}.dashboard-header > div:last-child{align-self:flex-start}}
@media(max-width:760px){.stock-period-summary{grid-template-columns:repeat(2,minmax(130px,1fr))}}
@media(max-width:600px){.import-modal{padding:18px}.modal-actions button{width:100%}}

/* ===== Interface métier — finition premium (hors dashboard) ===== */
:root{--navy:#173f83;--navy-dark:#102f66;--navy-light:#edf2fb;--orange:#ed7a18;--line:#dbe4f0;--bg:#f3f6fb;--card:#fff;--shadow-sm:0 2px 5px rgba(16,47,102,.06);--shadow-md:0 12px 30px rgba(16,47,102,.08);--radius:16px}
body{background:radial-gradient(900px 410px at 96% -8%,#dbe7fb 0%,transparent 66%),radial-gradient(720px 340px at 40% 102%,#edf3fc 0%,transparent 72%),var(--bg)}
body::before{content:'';position:fixed;inset:0;pointer-events:none;background-image:linear-gradient(rgba(23,63,131,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(23,63,131,.025) 1px,transparent 1px);background-size:28px 28px;mask-image:linear-gradient(to bottom,rgba(0,0,0,.42),transparent 72%)}
.sidebar{width:264px;flex-basis:264px;background:linear-gradient(160deg,#173f83 0%,#112f65 54%,#091d43 100%);box-shadow:14px 0 36px rgba(9,29,67,.16)}
.sidebar::after{content:'';position:absolute;inset:0 0 auto;height:150px;pointer-events:none;background:radial-gradient(240px 130px at 8% 0%,rgba(93,151,246,.33),transparent 75%)}
.sidebar-brand{position:relative;z-index:1;padding:25px 20px 21px;border-bottom-color:rgba(255,255,255,.13)}.brand-emblem{width:34px;height:34px;display:grid;place-items:center;border-radius:11px;background:linear-gradient(135deg,#f49a45,#e66e12);box-shadow:0 8px 16px rgba(6,18,48,.28)}
.sidebar-brand .dot{width:11px;height:11px;background:#fff;box-shadow:0 0 0 5px rgba(255,255,255,.20)}.brand-wordmark{display:flex;flex-direction:column;font-size:21px;font-weight:800;letter-spacing:.35px;line-height:1}.brand-wordmark small{margin-top:5px;color:rgba(255,255,255,.58);font-size:7.5px;font-weight:700;letter-spacing:1.35px}.sidebar-brand .brand-sub{padding:5px 7px;border:1px solid rgba(255,255,255,.16);border-radius:20px;background:rgba(255,255,255,.07);font-size:9px;font-weight:700;opacity:1;letter-spacing:.2px}
.sidebar-nav{position:relative;z-index:1;padding:17px 13px;gap:5px}.nav-section-label{margin:11px 9px 4px;color:rgba(202,219,249,.54);font-size:9px;font-weight:800;letter-spacing:1.05px;text-transform:uppercase}.nav-section-label:first-child{margin-top:1px}.sidebar-nav button{position:relative;border-radius:10px;padding:11px 13px;font-size:13px;letter-spacing:.05px;transition:background .18s ease,color .18s ease,transform .18s ease}
.sidebar-nav button:hover{background:rgba(255,255,255,.11);transform:translateX(2px)}.sidebar-nav button.active{background:linear-gradient(110deg,#fff,#f2f6ff);box-shadow:0 8px 20px rgba(3,19,48,.24)}
.sidebar-nav button.active::before{content:'';position:absolute;left:-13px;width:4px;height:26px;border-radius:0 4px 4px 0;background:var(--orange)}
.sidebar-footer{position:relative;z-index:1;padding:16px 20px 18px;background:rgba(0,0,0,.10);border-top-color:rgba(255,255,255,.12)}
main{max-width:1510px;margin:28px auto;padding:0 24px}.page:not(#page-dashboard){animation:fadein .24s ease}
button{min-height:38px;border-radius:9px;padding:9px 15px;font-weight:700;letter-spacing:.05px;box-shadow:0 1px 1px rgba(15,44,95,.04)}
button:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid rgba(237,122,24,.28);outline-offset:2px}.primary{background:linear-gradient(135deg,#2455a0,#123975)}.green{background:linear-gradient(135deg,#1a9258,#126d42)}.orange{background:linear-gradient(135deg,#f28a2e,#d9650a)}.gray{background:linear-gradient(135deg,#77859c,#59677e)}.red{background:linear-gradient(135deg,#d55345,#b12d27)}
.segmented{padding:4px;gap:4px;border:1px solid #d9e4f5;background:#edf2fb;border-radius:11px}.seg{min-height:34px;padding:7px 14px;border-radius:8px}.seg.active{box-shadow:0 3px 9px rgba(15,44,95,.14)}
.card{padding:22px;border-color:#dce5f1;border-radius:16px;box-shadow:0 8px 22px rgba(15,44,95,.06);overflow:visible}.card::before{height:4px;background:linear-gradient(90deg,var(--navy),#356cc0 66%,var(--orange))}.card:hover{transform:translateY(-1px);box-shadow:0 14px 30px rgba(15,44,95,.10)}.card h2{font-size:18px;letter-spacing:-.45px}
.card h2::after{content:'';display:block;width:30px;height:3px;margin-top:8px;border-radius:3px;background:linear-gradient(90deg,var(--orange),#f6b16c)}
label{font-size:10.5px;color:#61718a;letter-spacing:.55px;margin-bottom:6px}input,select{min-height:40px;padding:9px 12px;border-color:#d6e0ed;border-radius:9px;background:#fff;color:#1d2a3b;box-shadow:inset 0 1px 2px rgba(16,47,102,.025)}input:hover,select:hover{border-color:#afc1da}input:focus,select:focus{border-color:#3463a6;box-shadow:0 0 0 4px rgba(35,80,151,.11);background:#fff}.hint{padding-left:10px;border-left:3px solid #d4e1f4;color:#62718a}
.toolbar{gap:10px;padding-bottom:14px;border-bottom:1px solid #e4ebf4}.toolbar .spacer+button{margin-left:2px}.toolbar label{padding:4px 0;color:#586b87}.toolbar label input{border-radius:7px;background:#fff}.search{min-height:40px;border-radius:10px;background-color:#fff;box-shadow:0 2px 5px rgba(15,44,95,.035)}
.badge{padding:6px 11px;border:1px solid transparent;box-shadow:0 1px 2px rgba(15,44,95,.04)}.badge.open{border-color:#c8ead7}.badge.lock{border-color:#f3c9c6}.badge.conv{border-color:#f6ddae}
.table-scroll{border:1px solid #e0e8f2;border-radius:12px;background:#fff;box-shadow:inset 0 1px 0 rgba(255,255,255,.8)}.data th,.data td{padding:12px 11px}.data th{position:sticky;top:0;z-index:1;background:linear-gradient(135deg,#f7faff,#edf3fb);font-size:10.5px;color:#365178;border-bottom-color:#d9e5f3}.data tbody tr:nth-child(even){background:#fbfcff}.data tbody tr:hover{background:linear-gradient(90deg,rgba(31,79,151,.07),rgba(237,122,24,.045));box-shadow:inset 3px 0 0 var(--orange)}.data td.num{font-weight:700}.data td.actions{padding:8px 10px}.data td.actions button{min-height:31px;padding:5px 10px;border-radius:7px}
.stock-period-summary{gap:12px}.stock-summary-card{padding:15px 16px;border-color:#dae5f2;border-radius:12px;box-shadow:0 4px 10px rgba(15,44,95,.035)}.stock-summary-card b{font-size:21px}.stock-table-wrap{border-color:#d7e2ef}.stock-data .stock-group-head th{background:linear-gradient(135deg,#dfe9f8,#edf3fb)}.stock-article{padding-left:14px!important}.stock-code{color:#214f99}.stock-initial{padding:4px 8px}
.import-modal,.message-modal{border:1px solid rgba(255,255,255,.8);box-shadow:0 26px 70px rgba(15,44,95,.30)}.modal-header{padding-bottom:16px}.modal-close{border-radius:9px}.modal-actions{padding-top:2px}
#page-documents>.card:first-child,#page-stock>.card:first-child,#page-achats>.card:first-child,#page-articles>.card:first-child,#page-fournisseurs>.card:first-child,#page-parametres>.card:first-child,#page-clients>.card:first-child{background:linear-gradient(135deg,rgba(255,255,255,.98),rgba(246,249,254,.97));border-color:#cedced}
.article-picker-trigger{position:relative;display:flex;min-width:250px;min-height:40px;align-items:flex-start;flex-direction:column;justify-content:center;gap:2px;padding-right:32px;border:1px solid #d5e0ee;background:#fff;color:var(--navy-dark);text-align:left;box-shadow:inset 0 1px 2px rgba(16,47,102,.025)}.article-picker-trigger::after{content:'⌕';position:absolute;right:11px;top:50%;transform:translateY(-50%);color:#3761a1;font-size:18px}.article-picker-trigger span{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:12px;font-weight:750}.article-picker-trigger small{color:#71819a;font-size:10px;font-weight:600}.article-picker-trigger:hover{border-color:#7292bd;background:#f9fbff}.invoice-article-picker{width:100%;min-width:0;border-radius:7px;padding:6px 28px 6px 7px}.invoice-article-picker::after{right:8px;color:#3761a1;font-size:17px}.invoice-article-picker span{font-size:12px}.invoice-article-picker small{font-size:9px}
.article-picker-modal{width:min(720px,100%);max-height:calc(100vh - 40px);overflow:hidden;display:flex;flex-direction:column;background:#fff;border:1px solid rgba(255,255,255,.8);border-radius:18px;box-shadow:0 26px 70px rgba(15,44,95,.32);padding:24px;animation:slideInUp .18s ease}.article-picker-search-wrap{padding:17px 0 12px}.article-picker-search-wrap .search{max-width:none}.article-picker-results{max-height:min(54vh,510px);overflow:auto;border:1px solid #dfe7f1;border-radius:12px;background:#fbfcff;padding:7px}.article-picker-result{width:100%;min-height:0;display:grid;grid-template-columns:112px 1fr;gap:3px 12px;padding:12px 13px;border:1px solid transparent;border-radius:9px;background:transparent;color:var(--ink);text-align:left;box-shadow:none}.article-picker-result:hover,.article-picker-result:focus{background:#fff;border-color:#ccdbee;box-shadow:0 4px 12px rgba(16,47,102,.08);filter:none}.article-picker-code{grid-row:span 2;align-self:center;color:#214f99;font-size:12px;font-weight:800}.article-picker-name{font-size:13px;font-weight:750}.article-picker-ref{color:#728198;font-size:11px}.article-picker-empty{padding:28px 14px;color:#71819a;text-align:center;font-size:13px}.stock-value{color:#16804b!important}

@media print{
 @page{size:A4 portrait;margin:12mm 10mm 34mm}
 html,body{width:auto;height:auto;background:#fff;-webkit-print-color-adjust:exact;print-color-adjust:exact}.no-print{display:none!important}
 main{margin:0;padding:0;max-width:none}
 .page{display:none!important}#page-document{display:block!important}
 .sheet-wrap{display:block}.sheet{width:auto;min-height:0;padding:0;display:block;box-shadow:none;border-radius:0;overflow:visible}
 .invoice-table{page-break-inside:auto}.invoice-table thead{display:table-header-group}.invoice-table tbody{display:table-row-group}.invoice-table tr{break-inside:avoid;page-break-inside:avoid}
 .totals,.words{break-inside:avoid;page-break-inside:avoid}
 .inv-footer{position:fixed;left:10mm;right:10mm;bottom:8mm;margin:0;padding-top:4mm;background:#fff;z-index:1;break-inside:avoid;page-break-inside:avoid}
 .invoice-table .code{display:none!important}.invoice-table .print-article-code{display:block;font-size:8.2px;font-weight:700;overflow-wrap:anywhere}
 .invoice-table select{appearance:none;-webkit-appearance:none;-moz-appearance:none;background:none;padding-right:0}
}
@media(max-width:900px){
  .grid4{grid-template-columns:1fr 1fr}
  .grid2{grid-template-columns:1fr}
  .app-layout{flex-direction:column}
  .sidebar{width:100%;flex:0 0 auto;height:auto;position:relative;flex-direction:row;align-items:center;padding:0}
  .sidebar-brand{border-bottom:0;border-right:1px solid rgba(255,255,255,.12);padding:14px 16px}
  .sidebar-nav{flex-direction:row;overflow-x:auto;padding:8px}.nav-section-label{display:none}
  .sidebar-nav button{width:auto;white-space:nowrap}
  .sidebar-footer{display:none}
}
@media(max-width:600px){.article-picker-modal{padding:18px}.article-picker-trigger{min-width:100%;width:100%}.article-picker-result{grid-template-columns:1fr}.article-picker-code{grid-row:auto}}