/* SCI shared design tokens. One set of colors, type, corners and spacing for
   every SCI app. The standard is written up in DESIGN.md (repo root); it is
   taken from the Manufacturing Jobs home that Rico approved.

   Loaded by Operations (index.html), CNC (cnc/index.html) and the Scheduler
   (scheduler/index.html). Tokens only: this file draws nothing by itself
   except the font face. */

/* Inter, self-hosted (same file Manufacturing ships). The page asks for any
   weight; these two faces make every request render as either 400 or 600, so
   older rules that still say 700/800/900 come out semibold, not heavy. */
@font-face {
  font-family: 'SCI Sans';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(fonts/inter-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'SCI Sans';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(fonts/inter-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

:root {
  /* Type: one family, two weights, one size scale. */
  --sci-font: 'SCI Sans', 'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
  --sci-font-mono: ui-monospace, 'SF Mono', Consolas, monospace;
  --sci-regular: 400;
  --sci-strong: 600;
  --sci-text-xs: 12px;   /* table headers, fine print */
  --sci-text-sm: 13px;   /* secondary lines under a title */
  --sci-text: 14px;      /* body on a computer */
  --sci-text-md: 15px;   /* list titles, menu */
  --sci-text-lg: 16px;   /* body on a phone, section titles */
  --sci-text-xl: 18px;   /* top bar title */
  --sci-text-2xl: 22px;  /* page title on a phone */
  --sci-text-3xl: 28px;  /* page title on a computer */
  --sci-leading: 1.5;

  /* Color: neutrals do the work, SCI red is the one accent. */
  --sci-ink: #1D1D1F;
  --sci-muted: #63636A;          /* 5.7:1 on white, 5.3:1 on ground */
  --sci-accent: #C00000;
  --sci-accent-hover: #A30000;
  --sci-accent-ink: #C00000;     /* red text and links */
  --sci-pale: rgba(192, 0, 0, .08);
  --sci-ground: #F5F5F7;
  --sci-surface: #FFFFFF;
  --sci-surface-2: #F8F8FA;
  --sci-hover: rgba(120, 120, 128, .09);
  --sci-line: rgba(0, 0, 0, .09);
  --sci-line-strong: rgba(0, 0, 0, .16);
  --sci-control-border: #8A8A90;
  --sci-focus: #1D5FB8;

  /* Status colors are for words and thin outlines, never big fills. */
  --sci-amber: #92470A;
  --sci-amber-bg: rgba(180, 83, 9, .09);
  --sci-red: #B00000;
  --sci-red-bg: rgba(192, 0, 0, .07);
  --sci-blue: #1D5FB8;
  --sci-blue-bg: rgba(0, 113, 227, .08);
  --sci-green: #17703F;
  --sci-green-bg: rgba(26, 127, 75, .09);
  --sci-pale-line: rgba(192, 0, 0, .28);
  --sci-amber-line: rgba(180, 83, 9, .32);
  --sci-red-line: rgba(192, 0, 0, .28);
  --sci-blue-line: rgba(29, 95, 184, .3);
  --sci-green-line: rgba(26, 127, 75, .3);

  /* Shape: small corners, hairlines, no shadows. */
  --sci-radius-control: 6px;   /* buttons, fields, tags */
  --sci-radius: 8px;           /* panels, lists, menus */
  --sci-hairline: 1px solid var(--sci-line);
  --sci-float-shadow: 0 8px 24px rgba(0, 0, 0, .12);  /* menus and dialogs only */

  /* Space: 4px steps. */
  --sci-space-1: 4px;
  --sci-space-2: 8px;
  --sci-space-3: 12px;
  --sci-space-4: 16px;
  --sci-space-5: 24px;
  --sci-space-6: 32px;
  --sci-control-height: 44px;  /* touch target */
}

:root[data-theme="dark"] {
  --sci-ink: #F5F5F7;
  --sci-muted: #AEB3BC;
  --sci-accent-ink: #FF8A8A;
  --sci-pale: rgba(255, 69, 58, .14);
  --sci-ground: #1C1C1E;
  --sci-surface: #21242B;
  --sci-surface-2: #2A2D35;
  --sci-hover: rgba(255, 255, 255, .07);
  --sci-line: rgba(255, 255, 255, .13);
  --sci-line-strong: rgba(255, 255, 255, .24);
  --sci-control-border: #7D838E;
  --sci-focus: #93C5FD;
  --sci-amber: #FBBF24;
  --sci-amber-bg: rgba(255, 159, 10, .14);
  --sci-red: #FF8A8A;
  --sci-red-bg: rgba(255, 69, 58, .14);
  --sci-blue: #93C5FD;
  --sci-blue-bg: rgba(10, 132, 255, .16);
  --sci-green: #4ADE80;
  --sci-green-bg: rgba(48, 209, 88, .14);
  --sci-pale-line: rgba(255, 138, 138, .4);
  --sci-amber-line: rgba(255, 159, 10, .4);
  --sci-red-line: rgba(255, 138, 138, .4);
  --sci-blue-line: rgba(147, 197, 253, .4);
  --sci-green-line: rgba(74, 222, 128, .4);
  --sci-float-shadow: 0 8px 24px rgba(0, 0, 0, .45);
}