/* TerritoryCommand design tokens.
   Import once at the app root. Components reference variables, never raw hex. */

:root {
  /* Neutrals */
  --tc-ink: #121417;
  --tc-graphite: #1E2328;
  --tc-line: #343B42;
  --tc-bone: #F4F1EA;
  --tc-sand: #E3DDD1;
  --tc-line-light: #E0DACE;
  --tc-white: #FFFFFF;

  /* Text */
  --tc-text: #121417;
  --tc-text-muted: #596067;
  --tc-text-on-dark: #F4F1EA;
  --tc-text-muted-on-dark: #9AA5AE;

  /* The one accent */
  --tc-signal: #E05A2B;
  --tc-signal-deep: #B33F19;
  --tc-on-signal: #121417;

  /* Surfaces — light theme default */
  --tc-bg: var(--tc-bone);
  --tc-surface: var(--tc-white);
  --tc-border: var(--tc-line-light);

  /* Type */
  --tc-font-display: 'Archivo Black', 'Helvetica Neue', sans-serif;
  --tc-font-body: 'Archivo', 'Helvetica Neue', sans-serif;
  --tc-font-data: 'Space Mono', ui-monospace, SFMono-Regular, monospace;

  --tc-text-xs: 12px;
  --tc-text-sm: 14px;
  --tc-text-base: 16px;
  --tc-text-lg: 20px;
  --tc-text-xl: 26px;
  --tc-text-2xl: 34px;
  --tc-text-3xl: 48px;

  --tc-tracking-tight: -0.015em;
  --tc-tracking-data: 0.14em;
  --tc-leading-tight: 1.1;
  --tc-leading-body: 1.5;

  /* Shape */
  --tc-radius-sm: 9px;
  --tc-radius-md: 12px;
  --tc-radius-lg: 14px;
  --tc-radius-pill: 999px;

  /* Spacing — multiples of 4 */
  --tc-space-1: 4px;
  --tc-space-2: 8px;
  --tc-space-3: 12px;
  --tc-space-4: 16px;
  --tc-space-5: 20px;
  --tc-space-6: 24px;
  --tc-space-8: 32px;
  --tc-space-12: 48px;

  --tc-tap-min: 44px;
}

[data-theme="dark"] {
  --tc-bg: var(--tc-ink);
  --tc-surface: var(--tc-graphite);
  --tc-border: var(--tc-line);
  --tc-text: var(--tc-bone);
  --tc-text-muted: var(--tc-text-muted-on-dark);
}

body {
  background: var(--tc-bg);
  color: var(--tc-text);
  font-family: var(--tc-font-body);
  font-size: var(--tc-text-base);
  line-height: var(--tc-leading-body);
}

h1, h2, h3 {
  font-family: var(--tc-font-display);
  letter-spacing: var(--tc-tracking-tight);
  line-height: var(--tc-leading-tight);
}

/* Data: counts, lot numbers, part numbers, timestamps */
.tc-data {
  font-family: var(--tc-font-data);
  font-weight: 700;
  letter-spacing: var(--tc-tracking-data);
  text-transform: uppercase;
}

.tc-wordmark {
  font-family: var(--tc-font-display);
  letter-spacing: var(--tc-tracking-tight);
  line-height: 1;
  white-space: nowrap;
}
.tc-wordmark-light {
  font-family: var(--tc-font-body);
  font-weight: 600;
}

/* Primary action. One per screen. */
.tc-button-primary {
  background: var(--tc-signal);
  color: var(--tc-on-signal);
  border: 0;
  border-radius: var(--tc-radius-sm);
  padding: 13px 22px;
  min-height: var(--tc-tap-min);
  font-family: var(--tc-font-body);
  font-size: var(--tc-text-sm);
  font-weight: 600;
  cursor: pointer;
}
.tc-button-primary:hover { background: var(--tc-signal-deep); color: var(--tc-bone); }
.tc-button-primary:focus-visible { outline: 3px solid var(--tc-signal-deep); outline-offset: 2px; }

@media (prefers-reduced-motion: reduce) {
  * { animation-duration: 0.01ms !important; transition-duration: 0.01ms !important; }
}