/* Brandagy design tokens — ported unchanged from the design package (shared/tokens.css).
   Single source of truth for colours, shape, elevation, type and motion.
   Extra tokens the dashboard needs are appended at the end, clearly marked. */
:root {
  /* Ink */
  --ink: #0E0F0C;
  --ink-2: #454745;
  --ink-3: #6A6C6A;      /* smallest text colour allowed on white (5.3:1) */
  --ink-disabled: #868685; /* borders/icons/disabled only, not body text (3.8:1) */
  /* Brand */
  --forest: #163300;
  --green: #9FE870;
  --green-hover: #80E142;
  --mint: #E2F6D5;
  /* Neutrals */
  --neutral: #ECEFEB;
  --neutral-hover: #E2E6DC;
  --surface: #F6F7F5;
  --surface-2: #ECEFEB; /* rgba(22,51,0,.08) on white */
  --border: #E2E2E1;
  --divider: #E8E9E6;
  --input-border: #868685;
  /* Status */
  --ok-bg: #E2F6D5;
  --warn-bg: #FFF1B8;
  --info-bg: #D6F2F2;
  --danger: #A8200D;
  --danger-bg: #FBE3E0;
  --fav: #C2362B;
  /* Shape */
  --r-xs: 4px;
  --r-input: 10px;
  --r-card: 16px;
  --r-panel: 24px;
  --r-pill: 9999px;
  /* Elevation */
  --shadow-pop: 0 12px 32px rgba(14, 15, 12, .12);
  --shadow-modal: 0 24px 64px rgba(14, 15, 12, .24);
  --scrim: rgba(14, 15, 12, .42);
  /* Type */
  --font: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif; /* native system stack (no web font) */
  --mono: ui-monospace, Menlo, Consolas, monospace;
  /* Motion */
  --t-fast: .15s;
  --t-med: .22s;
  /* Focus – soft ring (the original 4px solid ring was too heavy in the app) */
  --focus-ring: 0 0 0 3px rgba(22, 51, 0, .18);

  /* ---- Dashboard additions (values taken from Dashboard.dc.html, compacted) ---- */
  --ok-fg: #2F5711;
  --warn-fg: #5C4400;
  --warn-soft: #FFF6D6;
  --warn-ink: #7A5C00;
  --warn-icon: #B98A00;
  --highlight: #FFF3A6;
  --info-fg: #0B5A5A;
  --tile: #F1F1EF;
  --tile-hover: #E8E8E5;
  --summary: #F2F4EF;
  --scroll-thumb: #C9CBC6;
  /* Compact scale */
  --fs-body: 14.5px;
  --fs-sm: 13px;
  --fs-xs: 12px;
  --fs-nav: 14px;
  --fs-sub: 13.5px;
  --fs-btn: 13.5px;
  --ctl-h: 38px;      /* default control height (buttons, inputs, selects) */
  --ctl-h-lg: 42px;   /* primary actions */
  --ctl-h-sm: 32px;
  --nav-row: 42px;
  --nav-sub-row: 36px;
  --sidebar-w: 248px;
  --sidebar-rail-w: 64px;
  --sidebar-drawer-w: 288px;
  --topbar-h: 64px;
  --mobilebar-h: 56px;
  --page-pad-x: 40px;
  --page-pad-y: 28px;
  --bp-mobile: 759px;
}

/* Accessibility baseline: keyboard-only focus, subtle but clearly visible.
   Buttons/links get a 2px outline offset from the shape; text fields get a
   forest border + soft ring (see dashboard.css / login.css). Mouse clicks do
   not trigger :focus-visible, so no persistent box after clicking. */
.bd-app :focus-visible,
.bd-overlay :focus-visible,
.bd-modal :focus-visible,
.bd-login :focus-visible { outline: 2px solid var(--forest); outline-offset: 2px; box-shadow: none; border-radius: inherit; }
.bd-app input:focus-visible, .bd-app textarea:focus-visible, .bd-app select:focus-visible,
.bd-overlay input:focus-visible, .bd-modal input:focus-visible, .bd-modal textarea:focus-visible,
.bd-login input:focus-visible { outline: none; }
.bd-app [hidden],
.bd-overlay [hidden],
.bd-modal [hidden],
.bd-overlay[hidden],
.bd-toast[hidden] { display: none !important; }
.bd-sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }

@media (prefers-reduced-motion: reduce) {
  .bd-app *, .bd-app *::before, .bd-app *::after,
  .bd-overlay *, .bd-modal, .bd-toast, .bd-login * {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
    scroll-behavior: auto !important;
  }
}
