/* ═══════════════════════════════════════════════
   EcoFactures — Admin stylesheet
═══════════════════════════════════════════════ */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
body { font-family: 'Segoe UI', system-ui, sans-serif; font-size: 14px; background: #f0f2f5; color: #1a2340; }

:root {
  --navy:#1a2340; --teal:#2ec4b6; --teal2:#26a69a;
  --green:#3ab54a; --light:#e8f7f5; --muted:#5a6a8a;
  --red:#e74c3c; --amber:#f39c12; --border:#e0eae8; --bg:#f0f2f5;
}

/* ── LOGIN ── */
.login-screen {
  min-height:100vh; display:flex; align-items:center; justify-content:center;
  background:var(--navy);
}
.login-card { background:#fff; border-radius:14px; padding:2.5rem 2rem; width:100%; max-width:380px; }
.login-logo { text-align:center; margin-bottom:1.75rem; }
.login-logo img { height:44px; width:auto; }
.login-logo .login-title { font-size:13px; color:var(--muted); margin-top:8px; }
.login-field { margin-bottom:12px; }
.login-field label { display:block; font-size:12px; color:var(--muted); margin-bottom:4px; }
.login-field input {
  width:100%; border:1.5px solid #d0dde0; border-radius:8px;
  padding:10px 13px; font-size:14px; font-family:inherit;
  color:var(--navy); outline:none; transition:border-color .18s;
}
.login-field input:focus { border-color:var(--teal); box-shadow:0 0 0 3px #2ec4b618; }
.login-error { font-size:12px; color:var(--red); background:#FCEBEB; border:1px solid #f5a9a9; border-radius:7px; padding:8px 12px; margin-bottom:10px; display:none; }
.login-error.show { display:block; }
.btn-login { width:100%; background:var(--navy); color:#fff; border:none; border-radius:8px; padding:12px; font-size:14px; font-weight:600; cursor:pointer; font-family:inherit; transition:background .18s; }
.btn-login:hover { background:#253060; }
.tfa-info { font-size:11px; color:var(--muted); text-align:center; margin-top:12px; }

/* ── APP LAYOUT ── */
.app-layout { display:flex; flex-direction:column; min-height:100vh; }
.topbar { background:#fff; border-bottom:1px solid var(--border); height:54px; padding:0 1.25rem; display:flex; align-items:center; justify-content:space-between; flex-shrink:0; position:sticky; top:0; z-index:100; }
.topbar-left { display:flex; align-items:center; gap:10px; }
.topbar-logo img { height:34px; width:auto; }
.admin-pill { font-size:10px; background:#EEEDFE; color:#534AB7; border:1px solid #AFA9EC; border-radius:20px; padding:2px 10px; }
.topbar-right { display:flex; align-items:center; gap:10px; }
.topbar-user { font-size:12px; color:var(--muted); }
.avatar { width:32px; height:32px; border-radius:50%; background:#B5D4F4; color:#0C447C; font-size:11px; font-weight:600; display:flex; align-items:center; justify-content:center; }
.btn-logout { font-size:11px; color:var(--muted); background:none; border:1px solid var(--border); border-radius:6px; padding:4px 10px; cursor:pointer; font-family:inherit; text-decoration:none; }
.btn-logout:hover { color:var(--red); border-color:var(--red); }

/* ── SIDEBAR ── */
.content-wrap { display:flex; flex:1; overflow:hidden; }
.sidebar { width:210px; flex-shrink:0; background:#fff; border-right:1px solid var(--border); padding:1rem 0; display:flex; flex-direction:column; }
.nav-group { margin-bottom:1.25rem; }
.nav-lbl { font-size:9px; color:#aab; text-transform:uppercase; letter-spacing:.08em; padding:0 1rem; margin-bottom:4px; display:block; }
.ni { display:flex; align-items:center; gap:9px; padding:8px 1rem; font-size:13px; color:var(--muted); cursor:pointer; transition:background .15s; text-decoration:none; border:none; background:none; font-family:inherit; width:100%; text-align:left; }
.ni:hover { background:#f5fafa; }
.ni.on { background:var(--light); color:#0a6b63; font-weight:600; }
.ni svg { width:15px; height:15px; flex-shrink:0; opacity:.7; }
.ni.on svg { opacity:1; }
.ni-cnt { margin-left:auto; font-size:10px; background:#eee; padding:1px 7px; border-radius:9px; color:var(--muted); }
.ni.on .ni-cnt { background:#9fdfd9; color:#085041; }

/* ── MAIN ── */
.main { flex:1; overflow:auto; padding:1.25rem; display:flex; flex-direction:column; gap:1rem; }

/* ── METRICS ── */
.metrics { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; }
.mc { background:#fff; border:1px solid var(--border); border-radius:10px; padding:13px 15px; }
.mc-lbl { font-size:10px; color:var(--muted); margin-bottom:5px; }
.mc-val { font-size:22px; font-weight:700; color:var(--navy); }
.mc-sub { font-size:10px; margin-top:3px; }
.mc-sub.g { color:#1a8a80; } .mc-sub.a { color:var(--amber); }

/* ── SECTION HEADER ── */
.section-head { display:flex; align-items:center; justify-content:space-between; }
.section-title { font-size:13px; font-weight:600; color:var(--navy); }
.filters { display:flex; gap:6px; }
.flt { font-size:11px; padding:4px 12px; border-radius:6px; border:1px solid var(--border); background:#fff; color:var(--muted); cursor:pointer; font-family:inherit; text-decoration:none; }
.flt.on { background:var(--light); color:#0a6b63; border-color:var(--teal); }

/* ── TABLE ── */
.tbl-card { background:#fff; border:1px solid var(--border); border-radius:10px; overflow:hidden; }
table { width:100%; border-collapse:collapse; }
th { padding:8px 12px; font-size:9px; color:var(--muted); text-transform:uppercase; letter-spacing:.06em; font-weight:500; border-bottom:1px solid var(--border); text-align:left; }
td { padding:10px 12px; font-size:12px; color:var(--muted); border-bottom:1px solid #f0f2f5; vertical-align:middle; }
tr:last-child td { border-bottom:none; }
tr:hover td { background:#fafcfc; }
.cn-name { font-size:12px; font-weight:600; color:var(--navy); display:block; }
.cn-siret { font-size:10px; color:#aab; display:block; }
.pill { display:inline-flex; align-items:center; gap:4px; font-size:10px; padding:2px 8px; border-radius:5px; }
.p-new { background:#E6F1FB; color:#185FA5; }
.p-wip { background:#FEF3CD; color:#7a5000; }
.p-done { background:#E1F5EE; color:#0a6b63; }
.p-del { background:#FCEBEB; color:#a32d2d; }
.pill-dot { width:5px; height:5px; border-radius:50%; background:currentColor; }
.fchips { display:flex; gap:4px; flex-wrap:wrap; }
.fchip { font-size:10px; background:#E6F1FB; color:#185FA5; padding:2px 6px; border-radius:4px; }
.acts { display:flex; gap:5px; flex-wrap:wrap; }
.ab { padding:3px 9px; font-size:11px; border-radius:5px; border:1px solid var(--border); background:#fff; color:var(--muted); cursor:pointer; font-family:inherit; white-space:nowrap; text-decoration:none; display:inline-block; }
.ab:hover { background:#f5fafa; }
.ab.primary { border-color:#9fdfd9; color:#0a6b63; background:var(--light); }
.ab.danger { border-color:#f5a9a9; color:var(--red); }
.ab.danger:hover { background:#FCEBEB; }
.empty-row { text-align:center; padding:2.5rem; color:var(--muted); font-size:12px; }

/* ── DETAIL PANEL ── */
.detail-panel { background:#fff; border:1px solid var(--border); border-radius:10px; padding:1.25rem; }
.dp-head { display:flex; align-items:flex-start; justify-content:space-between; margin-bottom:1rem; }
.dp-title { font-size:15px; font-weight:700; color:var(--navy); }
.dp-sub { font-size:11px; color:var(--muted); margin-top:3px; }
.dp-close { background:none; border:none; cursor:pointer; font-size:20px; color:var(--muted); line-height:1; }
.dp-grid { display:grid; grid-template-columns:1fr 1fr; gap:8px; margin-bottom:1rem; }
.dp-field { background:#f5f7fa; border-radius:7px; padding:8px 11px; }
.dp-flbl { font-size:10px; color:var(--muted); margin-bottom:3px; }
.dp-fval { font-size:12px; font-weight:600; color:var(--navy); }
.dp-files-title { font-size:11px; color:var(--muted); margin-bottom:7px; font-weight:600; }
.dp-file { display:flex; align-items:center; gap:8px; padding:7px 10px; background:#f5f7fa; border-radius:7px; margin-bottom:5px; }
.dp-ext { width:28px; height:28px; border-radius:5px; background:#E6F1FB; color:#185FA5; font-size:9px; font-weight:700; display:flex; align-items:center; justify-content:center; flex-shrink:0; }
.dp-fname { flex:1; font-size:11px; color:var(--navy); font-weight:500; }
.dp-fsize { font-size:10px; color:var(--muted); }
.dp-enc { font-size:10px; background:var(--light); color:#0a6b63; padding:1px 6px; border-radius:4px; }
.dp-actions { display:flex; gap:8px; flex-wrap:wrap; margin-top:1rem; }
.dp-act { padding:8px 18px; font-size:12px; border-radius:7px; border:1px solid; cursor:pointer; font-weight:600; font-family:inherit; }
.dp-wip { background:#FEF3CD; color:#7a5000; border-color:var(--amber); }
.dp-done { background:var(--light); color:#0a6b63; border-color:var(--teal); }
.dp-del { background:#FCEBEB; color:var(--red); border-color:#f5a9a9; }

/* ── SETTINGS ── */
.settings-grid { display:grid; grid-template-columns:1fr 1fr; gap:1rem; }
.settings-card { background:#fff; border:1px solid var(--border); border-radius:10px; padding:1.5rem; }
.settings-card h3 { font-size:14px; font-weight:700; color:var(--navy); margin-bottom:4px; }
.sc-sub { font-size:12px; color:var(--muted); margin-bottom:1.25rem; line-height:1.5; }
.logo-preview { border:1.5px dashed var(--border); border-radius:9px; padding:1.25rem; text-align:center; background:#f8fafa; margin-bottom:12px; min-height:80px; display:flex; align-items:center; justify-content:center; }
.logo-preview img { max-height:56px; max-width:100%; }
.logo-preview .no-logo { font-size:12px; color:var(--muted); }
.logo-drop { border:1.5px dashed var(--teal); border-radius:8px; padding:14px; text-align:center; cursor:pointer; background:var(--light2); font-size:12px; color:#1a7a72; transition:background .18s; position:relative; margin-bottom:10px; }
.logo-drop:hover { background:#cdeee9; }
.logo-drop input { position:absolute; inset:0; opacity:0; cursor:pointer; width:100%; height:100%; }
.btn-settings { width:100%; border:none; border-radius:8px; padding:10px; font-size:13px; font-weight:600; cursor:pointer; font-family:inherit; margin-bottom:8px; }
.btn-apply { background:var(--navy); color:#fff; }
.btn-apply:hover { background:#253060; }
.btn-reset { background:#fff; color:var(--red); border:1px solid #f5a9a9; }
.btn-reset:hover { background:#FCEBEB; }
.applied-badge { display:none; align-items:center; gap:6px; background:var(--light); border:1px solid #9fdfd9; border-radius:7px; padding:8px 12px; font-size:12px; color:#0a6b63; margin-top:10px; }
.applied-badge.show { display:flex; }
.sec-row { display:flex; align-items:center; justify-content:space-between; padding:10px 0; border-bottom:1px solid #f0f2f5; }
.sec-row:last-child { border-bottom:none; }
.sec-name { font-size:13px; font-weight:600; color:var(--navy); }
.sec-desc { font-size:11px; color:var(--muted); margin-top:2px; }
.toggle { position:relative; width:40px; height:22px; flex-shrink:0; }
.toggle input { display:none; }
.toggle-slider { position:absolute; inset:0; background:var(--teal); border-radius:11px; cursor:pointer; }
.toggle-slider::before { content:''; position:absolute; width:16px; height:16px; background:#fff; border-radius:50%; top:3px; left:21px; transition:left .2s; }
.toggle input:not(:checked) + .toggle-slider { background:#d0dde0; }
.toggle input:not(:checked) + .toggle-slider::before { left:3px; }
.pw-field { margin-bottom:10px; }
.pw-field label { display:block; font-size:11px; color:var(--muted); margin-bottom:4px; }
.pw-field input { width:100%; border:1.5px solid #d0dde0; border-radius:7px; padding:9px 12px; font-size:13px; font-family:inherit; color:var(--navy); outline:none; }
.pw-field input:focus { border-color:var(--teal); }

/* ── JOURNAL ── */
.log-item { display:flex; align-items:flex-start; gap:10px; padding:10px 0; border-bottom:1px solid #f0f2f5; }
.log-item:last-child { border-bottom:none; }
.log-dot { width:8px; height:8px; border-radius:50%; flex-shrink:0; margin-top:4px; }
.log-dot.g { background:var(--teal); } .log-dot.a { background:var(--amber); } .log-dot.r { background:var(--red); }
.log-text { font-size:12px; color:var(--navy); flex:1; line-height:1.4; }
.log-meta { font-size:10px; color:var(--muted); margin-top:2px; }
.log-time { font-size:10px; color:var(--muted); flex-shrink:0; white-space:nowrap; }

/* ── FLASH ── */
.flash { padding:10px 14px; border-radius:8px; margin-bottom:1rem; font-size:12px; display:flex; align-items:center; gap:8px; }
.flash-success { background:var(--light); border:1px solid #9fdfd9; color:#0a6b63; }
.flash-error { background:#FCEBEB; border:1px solid #f5a9a9; color:#a32d2d; }