/* Direction: Dhruva payroll ledger — warm paper, bottle-green accent, serif display, ink-dark sidebar */
/* Completed by the platform from the short form: both modes, every
   palette token, each text-on-ground pair at its floor. To restyle, write the
   short form again (the decisions in one :root) and it is completed again. */

:root {
  --canvas: #f6f4ee;
  --surface: #ffffff;
  --surface-2: #ecebe3;
  --border: #dedbd0;
  --border-strong: #adb0ab;
  --ink: #1b1f1d;
  --muted: #5d625f;
  --accent: #1f6f5c;
  --accent-hover: #1a5e4e;
  --accent-ink: #ffffff;
  --accent-text: #195a4b;
  --accent-strong: #1f6f5c;
  --accent-soft: #d8e1da;
  --accent-border: #95b8ac;
  --success: #15803d;
  --success-ink: #ffffff;
  --success-soft: #dbe6d9;
  --success-strong: #116d34;
  --warning: #b45309;
  --warning-ink: #ffffff;
  --warning-soft: #eee1d3;
  --warning-strong: #994607;
  --danger: #b91c1c;
  --danger-ink: #ffffff;
  --danger-soft: #efdad5;
  --danger-strong: #b91c1c;
  --chart-1: #1f6f5c;
  --chart-2: #0384b5;
  --chart-3: #523a8c;
  --chart-4: #ac507a;
  --chart-5: #763b08;
  --chart-6: #777e16;

  --x-side: #14171f;
  --x-side-hover: #1f2330;
  --x-side-active: #2a3042;
  --x-on-side: #eceef4;
  --x-side-muted: #9ca2b5;
  --x-side-accent: #6fd3b8;
  --x-new: #1d4ed8;
  --x-new-hover: #1e40af;
  --x-on-new: #ffffff;
  --font-display: "Fraunces", Georgia, serif;
  --font-body: "Inter", system-ui, sans-serif;
  --font-mono: "JetBrains Mono", ui-monospace, monospace;
  --display-weight: 600;
  --display-tracking: -0.02em;
  --radius-card: 12px;
  --radius-btn: 8px;
  --radius-input: 8px;
  --font-sans: "Inter", system-ui, sans-serif;
  --eyebrow-tracking: 0.08em;
}

html[data-theme="dark"] {
  --canvas: #04100d;
  --surface: #1d2825;
  --surface-2: #111c19;
  --border: #27312f;
  --border-strong: #4f5856;
  --ink: #f6f4ee;
  --muted: #959994;
  --accent: #1f6f5c;
  --accent-hover: #418574;
  --accent-ink: #ffffff;
  --accent-text: #5e998a;
  --accent-strong: #5e998a;
  --accent-soft: #0a251e;
  --accent-border: #103b31;
  --success: #15803d;
  --success-ink: #ffffff;
  --success-soft: #082918;
  --success-strong: #499c68;
  --warning: #b45309;
  --warning-ink: #ffffff;
  --warning-soft: #2b1f0c;
  --warning-strong: #c57a40;
  --danger: #b91c1c;
  --danger-ink: #ffffff;
  --danger-soft: #2c1310;
  --danger-strong: #d16969;
  --chart-1: #34816d;
  --chart-2: #0e98ce;
  --chart-3: #846fc6;
  --chart-4: #c0628c;
  --chart-5: #bb6729;
  --chart-6: #89911f;
}

.side-link { transition: background-color .15s, color .15s; }
.side-link:hover { background: var(--x-side-hover); color: var(--x-on-side); }
.side-link[aria-current="page"] { background: var(--x-side-active); color: var(--x-on-side); box-shadow: inset 3px 0 0 var(--x-side-accent); }
.slip-paper { background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius-card); }
.btn.btn-new { background: var(--x-new); border-color: var(--x-new); color: var(--x-on-new); }
.btn.btn-new:hover { background: var(--x-new-hover); border-color: var(--x-new-hover); }
.num { font-variant-numeric: tabular-nums; }

@media print {
  .side, .no-print { display: none !important; }
  .shell { padding-left: 0 !important; }
  body { background: #fff !important; }
  .slip-paper { border: 1px solid #999; box-shadow: none; }
}