/* Copied from app_pipelines/templates/brand/harbor.tokens.css.
   Do not edit here. Change the template, then re-copy into every consumer
   in the same commit. Cross-repo sharing is by copy on purpose: a shared
   npm package would add a build step to a zero-dependency static console. */
/* Harbor Media platform tokens.
   The single source of truth for every Harbor-branded web surface: the admin
   console, the Keycloak login theme, status pages, and any internal tool.

   PRODUCTS DO NOT USE THIS FILE. Kitchenry and Link'd carry their own palettes;
   a product should look like itself, not like its parent company. What ships
   across all of them is the *structure* below (scale, radius, motion, focus),
   not the hues.

   No webfont. An operator tool loads on a hotel wifi at 2am and the system
   stack is already resident on every platform we support. */

:root {
  color-scheme: light dark;

  /* Surfaces, lightest to deepest. Borders carry separation, not shadows:
     shadow-heavy chrome is the single most common tell of a templated admin. */
  --hm-bg: #f7f8fa;
  --hm-surface: #ffffff;
  --hm-sunken: #eef1f5;
  --hm-border: #dde2e9;
  --hm-border-strong: #7c8697;

  /* Ink. Navy rather than black: black on white is a screen artifact,
     nothing printed has ever been #000. */
  --hm-ink: #0b1f3a;
  --hm-ink-muted: #55637a;
  --hm-ink-subtle: #646f85;

  /* Channel-marker amber. --hm-accent is the only one cleared for text
     (5.1:1 on --hm-surface). --hm-accent-bright is the beacon in the mark and
     nothing else: at 2.7:1 it is below every WCAG threshold, and it is legal
     only because a logotype is exempt from 1.4.11. Never set type in it and
     never use it as the sole boundary of a control. */
  --hm-accent: #a05f16;
  --hm-accent-bright: #d98a3d;
  --hm-accent-wash: #fdf4e8;

  /* State. */
  --hm-ok: #1a7f52;
  --hm-warn: #8a5d00;
  --hm-danger: #b3261e;
  --hm-danger-wash: #fdf0ef;

  /* Type scale, 1.2 ratio off a 15px base. rem so a user's browser zoom and
     OS text-size setting both still work. */
  --hm-font: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue",
    Arial, sans-serif;
  --hm-font-mono: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas,
    "Liberation Mono", monospace;
  --hm-text-xs: 0.75rem;
  --hm-text-sm: 0.8125rem;
  --hm-text-base: 0.9375rem;
  --hm-text-md: 1.0625rem;
  --hm-text-lg: 1.3125rem;
  --hm-text-xl: 1.625rem;
  --hm-leading-tight: 1.25;
  --hm-leading: 1.55;
  --hm-tracking-tight: -0.015em;
  --hm-tracking-caps: 0.06em;

  /* Space, 4px base. Every gap in a Harbor surface is one of these. */
  --hm-1: 0.25rem;
  --hm-2: 0.5rem;
  --hm-3: 0.75rem;
  --hm-4: 1rem;
  --hm-5: 1.5rem;
  --hm-6: 2rem;
  --hm-7: 3rem;

  --hm-radius-sm: 6px;
  --hm-radius: 10px;
  --hm-radius-lg: 14px;

  /* Motion. Short and near-linear. Anything springy on an operator tool reads
     as a toy, and every duration here is inside the 200ms budget where a
     transition still feels like a direct response to the click. */
  --hm-motion-fast: 120ms;
  --hm-motion: 180ms;
  --hm-ease: cubic-bezier(0.2, 0, 0.2, 1);
}

@media (prefers-color-scheme: dark) {
  :root {
    --hm-bg: #0a1120;
    --hm-surface: #111a2b;
    --hm-sunken: #070d19;
    --hm-border: #1f2c42;
    --hm-border-strong: #5f708a;

    --hm-ink: #e8edf5;
    --hm-ink-muted: #9dabc0;
    --hm-ink-subtle: #7a879c;

    --hm-accent: #e3a662;
    --hm-accent-bright: #d98a3d;
    --hm-accent-wash: #1d1a12;

    --hm-ok: #4fbf8b;
    --hm-warn: #e0b04a;
    --hm-danger: #f2917d;
    --hm-danger-wash: #23120f;
  }
}

/* Respect the OS setting. Users who set this have vestibular disorders or
   simply do not want the movement; honouring it is not optional. */
@media (prefers-reduced-motion: reduce) {
  :root {
    --hm-motion-fast: 0ms;
    --hm-motion: 0ms;
  }
}

/* Forced-colors (Windows High Contrast). System colors must win outright,
   which is why the ring is drawn with `outline` rather than a box-shadow. */
@media (forced-colors: active) {
  :root {
    --hm-border: CanvasText;
    --hm-border-strong: CanvasText;
  }
}