/*
  QuantCargo theme for SharpCompose (2026-10-03 redesign: docs/design/portal-redesign/).

  SharpCompose ships the shadcn neutral theme as CSS custom properties inside @layer sharpcompose; its documented
  way to re-theme is to redeclare those tokens unlayered (docs/design-system.md → "Theme tokens and dark mode").
  This file is that one place: colours, radius and fonts (the framework reads --font-sans / --font-mono). Swap or
  edit this file to change the theme; components and pages never define their own colours.

  Fundamentals (control heights, type scale, shadows) stay SharpCompose's. Two small changes from the design:
  body text is 14px (SharpCompose's own text-sm), and the five status tones get tokens of their own.
*/

:root {
    --background: oklch(0.985 0.002 250);
    --foreground: oklch(0.18 0.02 258);
    --card: oklch(1 0 0);
    --card-foreground: oklch(0.18 0.02 258);
    --popover: oklch(1 0 0);
    --popover-foreground: oklch(0.18 0.02 258);
    --primary: oklch(0.27 0.065 258);
    --primary-foreground: oklch(0.985 0 0);
    --secondary: oklch(0.96 0.005 250);
    --secondary-foreground: oklch(0.22 0.03 258);
    --muted: oklch(0.965 0.004 250);
    --muted-foreground: oklch(0.47 0.015 258);
    --accent: oklch(0.955 0.008 250);
    --accent-foreground: oklch(0.22 0.03 258);
    --destructive: oklch(0.53 0.2 27);
    --border: oklch(0.91 0.006 250);
    --input: oklch(0.88 0.008 250);
    --ring: oklch(0.55 0.1 258);
    --sidebar: oklch(0.235 0.05 258);
    --sidebar-foreground: oklch(0.9 0.01 258);
    --sidebar-primary: oklch(0.72 0.18 50);
    --sidebar-primary-foreground: oklch(0.985 0 0);
    --sidebar-accent: oklch(0.315 0.06 258);
    --sidebar-accent-foreground: oklch(0.985 0 0);
    --sidebar-border: oklch(0.3 0.05 258);
    --sidebar-ring: oklch(0.72 0.18 50);
    --sidebar-muted: oklch(0.7 0.025 258);
    --brand: oklch(0.72 0.18 50);
    --tone-info-bg: oklch(0.95 0.03 250);
    --tone-info-fg: oklch(0.42 0.13 258);
    --tone-success-bg: oklch(0.95 0.04 165);
    --tone-success-fg: oklch(0.4 0.09 165);
    --tone-warning-bg: oklch(0.96 0.06 80);
    --tone-warning-fg: oklch(0.46 0.11 60);
    --tone-danger-bg: oklch(0.95 0.03 25);
    --tone-danger-fg: oklch(0.5 0.19 27);
    --tone-neutral-bg: oklch(0.95 0.004 250);
    --tone-neutral-fg: oklch(0.42 0.015 258);
    --radius: 0.625rem;
    --font-sans: "Geist", ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
    --font-mono: "Geist Mono", ui-monospace, SFMono-Regular, Menlo, monospace;
}

/* Status tones: five tones, one meaning each (info / success / warning / danger / neutral); a tone badge is a dot
   plus a word. */
.cn-badge-tone-info { background: var(--tone-info-bg); color: var(--tone-info-fg); }
.cn-badge-tone-success { background: var(--tone-success-bg); color: var(--tone-success-fg); }
.cn-badge-tone-warning { background: var(--tone-warning-bg); color: var(--tone-warning-fg); }
.cn-badge-tone-danger,
.cn-badge-tone-destructive { background: var(--tone-danger-bg); color: var(--tone-danger-fg); }
.cn-badge-tone-neutral { background: var(--tone-neutral-bg); color: var(--tone-neutral-fg); }

.cn-badge[class*="cn-badge-tone-"]::before {
    content: "";
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: currentColor;
    flex: none;
}

.cn-badge.pui-badge-count::before { display: none; }
.cn-badge.pui-badge-count { font-family: var(--font-mono); font-variant-numeric: tabular-nums; }