/*
 * Jumpstart Moving CRM, design tokens (TODO 00094, CEO ruling R5).
 *
 * THIS FILE HOLDS ONLY CUSTOM PROPERTIES AND @font-face. No selectors other than
 * :root, no layout, no media queries. Every colour a component paints is read from a
 * token declared here, so a later theme change (a light sidebar, say) is a token swap
 * in this one file and touches no component rule.
 *
 * Values come from the approved dashboard mockup
 * (deliverables/dashboard-design/v1/tokens.css), which took them from the measured
 * brand palette. The three fonts are self-hosted beside this file; nothing is fetched
 * from a third party at run time.
 */

@font-face {
  font-family: "JM Display";
  src: url("fonts/outfit-variable.ttf") format("truetype-variations");
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "JM Display Fallback";
  src: url("fonts/archivo-semibold.ttf") format("truetype");
  font-weight: 600 800;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "JM Display Fallback";
  src: url("fonts/archivo-regular.ttf") format("truetype");
  font-weight: 400 500;
  font-style: normal;
  font-display: swap;
}

:root {
  /* brand colour. s159 correction (A15): --jm-gray and --jm-accent-text were darkened from
     the mockup's #7A7A7A / #B85A0F so every text use clears 4.5:1 on white, #F7F7F7 and the
     soft chip grounds. Table: docs/dashboard-plan.md section 3.1. */
  --jm-ground: #FFFFFF;
  --jm-surface: #F7F7F7;
  --jm-ink: #121212;
  --jm-ink-soft: #3A3A3A;
  --jm-gray: #666666;
  --jm-accent: #F77817;
  --jm-accent-hover: #DA6A11;
  --jm-accent-text: #A34F0D;
  --jm-accent-soft: #FCE9D8;
  --jm-accent-contrast: #121212;
  --jm-focus-ring: #A34F0D;

  /* sidebar surface (near-black UI ground) */
  --jm-side-ground: #121212;
  --jm-side-hairline: #2A2A2A;
  --jm-side-text: #FFFFFF;
  --jm-side-text-muted: #B7B7B7;
  /* TODO 00100 (A15): lifted from the mockup's #7A7A7A (4.4:1 on #121212) so the Soon
     row label and badge text clear 4.5:1 on the sidebar ground. */
  --jm-side-disabled: #858585;
  --jm-side-selected-bg: #2A1B0E;

  /* state */
  --jm-success: #146C3A;
  --jm-success-soft: #E8F3EC;
  --jm-warning: #8A5A00;
  --jm-warning-soft: #FFF3DC;
  --jm-danger: #B42318;
  --jm-danger-soft: #FDECEA;

  /* lines and controls */
  --jm-hairline: #E1E1E1;
  --jm-row-rule: #D9D9D9;
  --jm-border-control: #8A8F91;
  --jm-text-disabled: #9AA0A3;

  /* overlays */
  --jm-scrim: rgba(18, 18, 18, 0.5);
  --jm-sheet-shadow: rgba(0, 0, 0, 0.18);

  /* type */
  --jm-font-heading: "JM Display", "JM Display Fallback", sans-serif;
  --jm-font-ui: "JM Display", "JM Display Fallback", sans-serif;
  --jm-font-body: -apple-system, "Segoe UI", Helvetica, Arial, sans-serif;
  --jm-text-xs: 12px;
  --jm-text-sm: 14px;
  --jm-text-base: 16px;
  --jm-text-lg: 20px;
  --jm-text-xl: 24px;
  --jm-text-2xl: 30px;

  /* shape and space */
  --jm-radius: 4px;
  --jm-radius-panel: 0px;
  --jm-control-height: 44px;

  /* app layout */
  --sidebar-w: 272px;
  --rail-w: 88px;
  --header-h: 72px;
  --header-h-phone: 64px;
  --nav-h: 40px;
  --gutter: 40px;
  --gutter-tablet: 24px;
  --gutter-phone: 20px;
}
