/* Framework-neutral starter tokens. Adapt to the existing app theme provider.
   Paths below are relative to this stylesheet, not the HTML document. */
:root,
.ytms-root {
  --ytms-font: "Noto Sans Armenian", "Segoe UI", Arial, sans-serif;
  --ytms-font-mono: ui-monospace, SFMono-Regular, Consolas, monospace;
  --ytms-text-xs: 12px;
  --ytms-text-sm: 13px;
  --ytms-text-md: 14px;
  --ytms-text-lg: 16px;
  --ytms-text-xl: 20px;
  --ytms-text-title: clamp(23px, 1.85vw, 32px);
  --ytms-text-kpi: clamp(36px, 3.1vw, 52px);
  --ytms-line-height: 1.5;
  --ytms-space-1: 4px;
  --ytms-space-2: 8px;
  --ytms-space-3: 12px;
  --ytms-space-4: 16px;
  --ytms-space-5: 20px;
  --ytms-space-6: 24px;
  --ytms-space-8: 32px;
  --ytms-radius-sm: 8px;
  --ytms-radius-md: 11px;
  --ytms-radius-lg: 14px;
  --ytms-radius-pill: 999px;
  --ytms-control-height: 42px;
  --ytms-transition: 140ms ease;
  --ytms-focus-width: 3px;
}
:root,
:root[data-theme="dark"],
.ytms-root[data-theme="dark"] {
  color-scheme: dark;
  --ytms-bg: #021b2e;
  --ytms-header: #001b30;
  --ytms-surface: #032339;
  --ytms-surface-raised: #092e43;
  --ytms-surface-hover: #103b51;
  --ytms-field: #05283d;
  --ytms-text: #eff7ff;
  --ytms-text-muted: #acc7db;
  --ytms-text-faint: #94b5cb;
  --ytms-border: #1b4c64;
  --ytms-border-soft: #123a50;
  --ytms-primary: #23e1d3;
  --ytms-on-primary: #002332;
  --ytms-in: #24e4d7;
  --ytms-out: #ffb440;
  --ytms-in-tint: #073b48;
  --ytms-out-tint: #382f26;
  --ytms-in-surface: #002e3d;
  --ytms-out-surface: #20282e;
  --ytms-in-line: #08cdbd;
  --ytms-out-line: #ffae26;
  --ytms-success: #43d6a0;
  --ytms-warning: #ffb440;
  --ytms-danger: #ff838a;
  --ytms-info: #82ceff;
  --ytms-focus: #72f8ef;
  --ytms-grid: #23475c;
  --ytms-selection: #134857;
  --ytms-backdrop: rgb(0 8 20 / 76%);
  --ytms-shadow: 0 5px 18px rgb(0 8 20 / 18%);
  --ytms-in-shadow: 0 0 17px rgb(0 227 212 / 11%);
  --ytms-out-shadow: 0 0 17px rgb(255 169 46 / 9%);
  --ytms-skyline: url("assets/backgrounds/skyline-dark.webp");
  --ytms-road-in: url("assets/backgrounds/in-road-dark.webp");
  --ytms-road-out: url("assets/backgrounds/out-road-dark.webp");
  --ytms-art-empty-chart: url("assets/illustrations/empty-chart-dark.svg");
  --ytms-art-empty-list: url("assets/illustrations/empty-list-dark.svg");
  --ytms-art-disconnected: url("assets/illustrations/disconnected-dark.svg");
  --ytms-art-no-access: url("assets/illustrations/no-access-dark.svg");
}
:root[data-theme="light"],
.ytms-root[data-theme="light"] {
  color-scheme: light;
  --ytms-bg: #f3f9fc;
  --ytms-header: #fbfdff;
  --ytms-surface: #ffffff;
  --ytms-surface-raised: #f9fcfe;
  --ytms-surface-hover: #edf6fa;
  --ytms-field: #ffffff;
  --ytms-text: #0c2348;
  --ytms-text-muted: #486787;
  --ytms-text-faint: #5e7790;
  --ytms-border: #d1e1ec;
  --ytms-border-soft: #e4edf4;
  --ytms-primary: #27dcd3;
  --ytms-on-primary: #042c42;
  --ytms-in: #006f77;
  --ytms-out: #a85900;
  --ytms-in-tint: #dff8f8;
  --ytms-out-tint: #fff2df;
  --ytms-in-surface: #f5fdfd;
  --ytms-out-surface: #fffaf3;
  --ytms-in-line: #008e86;
  --ytms-out-line: #b96b00;
  --ytms-success: #097c59;
  --ytms-warning: #9c5900;
  --ytms-danger: #b52e41;
  --ytms-info: #176c9d;
  --ytms-focus: #087b8c;
  --ytms-grid: #dae7ef;
  --ytms-selection: #dff4f5;
  --ytms-backdrop: rgb(10 36 63 / 40%);
  --ytms-shadow: 0 4px 20px rgb(25 81 113 / 6%);
  --ytms-in-shadow: 0 4px 18px rgb(0 176 174 / 8%);
  --ytms-out-shadow: 0 4px 18px rgb(193 126 20 / 7%);
  --ytms-skyline: url("assets/backgrounds/skyline-light.webp");
  --ytms-road-in: url("assets/backgrounds/in-road-light.webp");
  --ytms-road-out: url("assets/backgrounds/out-road-light.webp");
  --ytms-art-empty-chart: url("assets/illustrations/empty-chart-light.svg");
  --ytms-art-empty-list: url("assets/illustrations/empty-list-light.svg");
  --ytms-art-disconnected: url("assets/illustrations/disconnected-light.svg");
  --ytms-art-no-access: url("assets/illustrations/no-access-light.svg");
}

:root{--ytms-auth-art:url("assets/illustrations/auth-backdrop-dark.svg");--ytms-camera-art:url("assets/illustrations/camera-unavailable-dark.svg");--ytms-service-art:url("assets/illustrations/service-unavailable-dark.svg")}
:root[data-theme="light"]{--ytms-auth-art:url("assets/illustrations/auth-backdrop-light.svg");--ytms-camera-art:url("assets/illustrations/camera-unavailable-light.svg");--ytms-service-art:url("assets/illustrations/service-unavailable-light.svg")}

:root{--ytms-danger-tint:#382231}:root[data-theme="light"]{--ytms-danger-tint:#fff0f2}
