/* ==========================================================================
   AKM Docs — "v5" look, shared by the new pages (records.html) and, when they
   are opened from the new dashboard (?theme=v5), the existing section pages
   (Contacts, SOA, Reports, Import / Export, AI Assistant).

   Same design as the new editor (editor.css): a light grey bench, white cards,
   hairlines, rounded shapes, Montserrat for headings and labels, colour only
   where it means something (document type, status, the primary action).

   Opened any other way — from the current dashboard, or directly — those
   section pages do not load this file and look exactly as before.
   ========================================================================== */

@font-face { font-family: 'Montserrat'; font-weight: 500; font-display: swap; src: url('Assets/fonts/montserrat-500.ttf') format('truetype'); }
@font-face { font-family: 'Montserrat'; font-weight: 600; font-display: swap; src: url('Assets/fonts/montserrat-600.ttf') format('truetype'); }
@font-face { font-family: 'Montserrat'; font-weight: 700; font-display: swap; src: url('Assets/fonts/montserrat-700.ttf') format('truetype'); }
@font-face { font-family: 'Montserrat'; font-weight: 800; font-display: swap; src: url('Assets/fonts/montserrat-800.ttf') format('truetype'); }
@font-face { font-family: 'Montserrat'; font-weight: 900; font-display: swap; src: url('Assets/fonts/montserrat-900.ttf') format('truetype'); }

:root {
  --inv: #4a90e2; --inv-deep: #2560a8;
  --qt: #1fa67a;  --qt-deep: #137251;
  --dn: #e64c4c;  --dn-deep: #b42d2d;
  --rc: #b45309;  --rc-deep: #8a3f06;
  --ok: #137251; --ok-bg: #e7f6ee;
  --warn: #9a5b00; --warn-bg: #fff4e0;
  --bad: #b42318; --bad-bg: #fdecea;
  --bench: #e7ebf0; --ink: #1c2530; --muted: #5b6776; --faint: #8a95a3;
  --panel: #ffffff; --line: #d9e0e8; --hair: #e7ebf0; --well: #f2f5f8;
  --accent: var(--inv-deep);
  --ui: 'Montserrat', 'Segoe UI', Arial, sans-serif;
  --body: Arial, Helvetica, sans-serif;
}

/* ── Base pieces the new pages use ── */
.v5, .v5 * { box-sizing: border-box; }
body.v5 { margin: 0; background: var(--bench); color: var(--ink); font-family: var(--ui); -webkit-text-size-adjust: 100%; }
.v5 [hidden] { display: none !important; }
.v5 button, .v5 input, .v5 select, .v5 textarea { font-family: inherit; }
.v5 :focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.v5 .sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.v5 .muted { color: var(--faint); }

.v5 .gate { position: fixed; inset: 0; display: grid; place-items: center; background: var(--bench); z-index: 50; padding: 16px; }
.v5 .gate-card { background: var(--panel); border: 1px solid var(--line); border-radius: 16px; padding: 32px 28px; text-align: center; max-width: 380px; width: 100%; display: grid; gap: 12px; }
.v5 .gate-card img { width: 150px; margin: 0 auto; }
.v5 .gate-card h1 { margin: 0; font-size: 20px; font-weight: 800; }
.v5 .gate-card p { margin: 0; color: var(--muted); font-size: 13px; }

.v5 .card { background: var(--panel); border: 1px solid var(--line); border-radius: 14px; }
.v5 .btn { display: inline-flex; align-items: center; justify-content: center; gap: 6px; font: 700 13px var(--ui); border: 0; border-radius: 10px; padding: 10px 14px; min-height: 40px; cursor: pointer; background: var(--accent); color: #fff; text-decoration: none; white-space: nowrap; }
.v5 .btn.ghost { background: var(--well); color: var(--ink); }
.v5 .btn:disabled { opacity: .55; cursor: progress; }
.v5 .linkbtn { display: inline-flex; align-items: center; gap: 6px; font: 700 12.5px var(--ui); color: var(--ink); background: var(--panel); border: 1px solid var(--line); border-radius: 999px; padding: 7px 12px; text-decoration: none; cursor: pointer; white-space: nowrap; }
.v5 .linkbtn:hover { border-color: var(--accent); }
.v5 .linkbtn.small { padding: 4px 10px; font-size: 11.5px; }
.v5 .linkbtn.danger { color: var(--bad); }
.v5 .linkbtn.danger:hover { border-color: var(--bad); }
.v5 .eyebrow { font: 800 10px var(--ui); letter-spacing: .12em; text-transform: uppercase; color: var(--muted); }
.v5 .dot { display: inline-block; width: 9px; height: 9px; border-radius: 50%; flex: none; }
.v5 .dot.inv { background: var(--inv); } .v5 .dot.qt { background: var(--qt); } .v5 .dot.dn { background: var(--dn); } .v5 .dot.rc { background: var(--rc); }
.v5 .dot.ok { background: #22a06b; } .v5 .dot.warn { background: #e0a100; } .v5 .dot.bad { background: #d92d20; }
.v5 .pill { display: inline-block; font: 700 11.5px var(--ui); padding: 3px 10px; border-radius: 999px; white-space: nowrap; }
.v5 .pill.paid { background: var(--ok-bg); color: var(--ok); }
.v5 .pill.unpaid { background: var(--warn-bg); color: var(--warn); }
.v5 .pill.partial { background: #eef2ff; color: #3949ab; }
.v5 .pill.overdue { background: var(--bad-bg); color: var(--bad); }
.v5 .pill.consignment { background: #f3eefc; color: #6a3fb0; }
.v5 .toast { position: fixed; left: 50%; bottom: calc(24px + env(safe-area-inset-bottom, 0px)); transform: translateX(-50%); z-index: 80; background: var(--ink); color: #fff; padding: 11px 16px; border-radius: 12px; font-size: 13.5px; font-weight: 600; max-width: min(520px, calc(100% - 32px)); box-shadow: 0 8px 24px rgba(0,0,0,.25); }
.v5 .toast.err { background: var(--bad); }

/* ==========================================================================
   Section pages opened from the new dashboard (html.theme-v5). These pages
   are built on components.css (.akm-*); retune its tokens and primitives.
   ========================================================================== */
html.theme-v5 {
  --akm-primary: #2560a8; --akm-primary-dark: #1d4f8c; --akm-primary-light: #eef4fb;
  --akm-success: #137251; --akm-success-bg: #e7f6ee;
  --akm-warning: #9a5b00; --akm-warning-bg: #fff4e0;
  --akm-danger: #b42318; --akm-danger-bg: #fdecea;
  --akm-text: #1c2530; --akm-text-muted: #5b6776;
  --akm-border: #d9e0e8; --akm-bg: #e7ebf0; --akm-surface: #ffffff;
  --akm-radius: 14px; --akm-radius-sm: 10px;
  --akm-shadow: none; --akm-shadow-hover: none;
  --akm-font: 'Montserrat', 'Segoe UI', Arial, sans-serif;
}
html.theme-v5 body { background: var(--bench) !important; color: var(--ink); }
/* no purple sign-in splash inside the new dashboard */
html.theme-v5 #auth-loading { background: var(--bench) !important; color: var(--muted) !important; }
html.theme-v5 .akm-page__title { font-weight: 800; letter-spacing: -.01em; color: var(--ink); }
html.theme-v5 .akm-page__subtitle { color: var(--muted); }
html.theme-v5 .akm-card { border: 1px solid var(--line); box-shadow: none; }
html.theme-v5 .akm-btn { border-radius: 10px; font-weight: 700; box-shadow: none !important; }
html.theme-v5 .akm-btn--secondary { border-color: var(--line); color: var(--ink); background: var(--panel); }
html.theme-v5 .akm-btn--secondary:hover:not(:disabled) { border-color: var(--accent); background: var(--panel); }
html.theme-v5 .akm-btn--ghost { border-color: var(--line); color: var(--ink); background: var(--panel); }
html.theme-v5 .akm-badge { border-radius: 999px; font-weight: 700; }
html.theme-v5 .akm-field label { letter-spacing: .08em; font-weight: 800; font-size: .7rem; }
html.theme-v5 .akm-field input, html.theme-v5 .akm-field select, html.theme-v5 .akm-field textarea { border-radius: 10px; border-color: var(--line); background: var(--well); }
html.theme-v5 .akm-field input:focus, html.theme-v5 .akm-field select:focus, html.theme-v5 .akm-field textarea:focus { border-color: var(--accent); background: #fff; box-shadow: none; }
html.theme-v5 .akm-table-wrap { border-color: var(--line); border-radius: 14px; }
html.theme-v5 .akm-table th { background: var(--panel); color: var(--muted); font: 800 10.5px var(--ui); letter-spacing: .1em; text-transform: uppercase; border-bottom: 1px solid var(--line); }
html.theme-v5 .akm-table td { border-bottom-color: var(--hair); }
html.theme-v5 .akm-table tbody tr:hover { background: #f7f9fb; }
html.theme-v5 .akm-dialog { border-radius: 16px; border: 1px solid var(--line); }
html.theme-v5 .akm-dialog h3 { color: var(--ink); font-weight: 800; }
/* the "← Dashboard" buttons point at the current dashboard; inside the new one they are noise */
html.theme-v5 #return-to-dashboard-btn { display: none !important; }
