/* ITB design tokens - COPIED from ITB_CLIENT/itb-client/src/app.css, verbatim.
 *
 * Copied and not imported, because this service must not carry a Node tool chain: it runs
 * in the pod that holds the private signing key k9, and node_modules there would be a
 * supply-chain surface for three views. The price is that this file can drift from the
 * client's, so it says where it came from and the README says to re-copy it when the
 * client's palette moves.
 *
 * WHY THE ITB PALETTE AND NOT THE BANIAN ONE: this is product surface, not a document.
 * `--primary` is the ITB brand pink #E9337F from the ITB corporate deck, the same value
 * the modeller uses, so the two read as one product. The Banian wordmark appears in the
 * footer as the operator, which is what it is.
 *
 * The `.dark` block is the client's, unchanged. The media query below applies the same
 * values when the visitor's system asks for dark and nothing set the class - this page is
 * server-rendered and has no script to set it.
 */

:root {
	/* The accent is the ITB brand pink #E9337F, from the corporate-design deck
	   (Marketing/Logo/Information Toolbench_phili01.pdf, "Concept 2"), which also
	   defines the tint ramp 10/50/70/100 %. It is written at four decimals because
	   fewer does not round-trip to the brand hex. The same value is used in light
	   and dark: it is a brand colour, and the deck defines no dark variant.
	   `DEFAULT_TYPE_COLOR` in helpers/color.ts is the sRGB copy of it — keep both
	   in step. The neutrals below are still shadcn's violet-tinted greys. */
	--radius: 0.65rem;
	--background: oklch(1 0 0);
	--foreground: oklch(0.141 0.005 285.823);
	--card: oklch(1 0 0);
	--card-foreground: oklch(0.141 0.005 285.823);
	--popover: oklch(1 0 0);
	--popover-foreground: oklch(0.141 0.005 285.823);
	--primary: oklch(0.6255 0.2214 1.3381);
	--primary-foreground: oklch(1 0 0);
	--secondary: oklch(0.967 0.001 286.375);
	--secondary-foreground: oklch(0.21 0.006 285.885);
	--muted: oklch(0.967 0.001 286.375);
	--muted-foreground: oklch(0.552 0.016 285.938);
	--accent: oklch(0.967 0.001 286.375);
	--accent-foreground: oklch(0.21 0.006 285.885);
	--destructive: oklch(0.577 0.245 27.325);
	--border: oklch(0.92 0.004 286.32);
	--input: oklch(0.92 0.004 286.32);
	--ring: oklch(0.6255 0.2214 1.3381);
	--chart-1: oklch(0.646 0.222 41.116);
	--chart-2: oklch(0.6 0.118 184.704);
	--chart-3: oklch(0.398 0.07 227.392);
	--chart-4: oklch(0.828 0.189 84.429);
	--chart-5: oklch(0.769 0.188 70.08);
	--sidebar: oklch(0.985 0 0);
	--sidebar-foreground: oklch(0.141 0.005 285.823);
	--sidebar-primary: oklch(0.6255 0.2214 1.3381);
	--sidebar-primary-foreground: oklch(1 0 0);
	--sidebar-accent: oklch(0.967 0.001 286.375);
	--sidebar-accent-foreground: oklch(0.21 0.006 285.885);
	--sidebar-border: oklch(0.92 0.004 286.32);
	--sidebar-ring: oklch(0.6255 0.2214 1.3381);

	/**********************************************************
    CUSTOM COLORS
   **********************************************************/
	--danger: oklch(0.63 0.24 29.23);
	--warn: oklch(0.76 0.15 85.87);
	--success: oklch(0.64 0.17 145.7);
	--info: oklch(0.64 0.17 225.83);
	--constructive: oklch(0.69 0.15 164.25);
}


.dark {
	--background: oklch(0.141 0.005 285.823);
	--foreground: oklch(0.985 0 0);
	--card: oklch(0.21 0.006 285.885);
	--card-foreground: oklch(0.985 0 0);
	--popover: oklch(0.21 0.006 285.885);
	--popover-foreground: oklch(0.985 0 0);
	--primary: oklch(0.6255 0.2214 1.3381);
	--primary-foreground: oklch(1 0 0);
	--secondary: oklch(0.274 0.006 286.033);
	--secondary-foreground: oklch(0.985 0 0);
	--muted: oklch(0.274 0.006 286.033);
	--muted-foreground: oklch(0.705 0.015 286.067);
	--accent: oklch(0.274 0.006 286.033);
	--accent-foreground: oklch(0.985 0 0);
	--destructive: oklch(0.704 0.191 22.216);
	--border: oklch(1 0 0 / 10%);
	--input: oklch(1 0 0 / 15%);
	--ring: oklch(0.6255 0.2214 1.3381);
	--chart-1: oklch(0.488 0.243 264.376);
	--chart-2: oklch(0.696 0.17 162.48);
	--chart-3: oklch(0.769 0.188 70.08);
	--chart-4: oklch(0.627 0.265 303.9);
	--chart-5: oklch(0.645 0.246 16.439);
	--sidebar: oklch(0.21 0.006 285.885);
	--sidebar-foreground: oklch(0.985 0 0);
	--sidebar-primary: oklch(0.6255 0.2214 1.3381);
	--sidebar-primary-foreground: oklch(1 0 0);
	--sidebar-accent: oklch(0.274 0.006 286.033);
	--sidebar-accent-foreground: oklch(0.985 0 0);
	--sidebar-border: oklch(1 0 0 / 10%);
	--sidebar-ring: oklch(0.6255 0.2214 1.3381);

	/**********************************************************
    CUSTOM COLORS
   **********************************************************/
	--danger: oklch(0.63 0.24 29.23);
	--warn: oklch(0.76 0.15 85.87);
	--success: oklch(0.64 0.17 145.7);
	--info: oklch(0.64 0.17 225.83);
	--constructive: oklch(0.69 0.15 164.25);
}


/* Same values as `.dark`, for a page with no script to toggle a class. Every colour is
 * already defined on bare `:root` above, so nothing here is a colour's only definition. */
@media (prefers-color-scheme: dark) {
  :root:not(.light) {
    --background: oklch(0.141 0.005 285.823);
    --foreground: oklch(0.985 0 0);
    --card: oklch(0.21 0.006 285.885);
    --card-foreground: oklch(0.985 0 0);
    --popover: oklch(0.21 0.006 285.885);
    --popover-foreground: oklch(0.985 0 0);
    --primary: oklch(0.6255 0.2214 1.3381);
    --primary-foreground: oklch(1 0 0);
    --secondary: oklch(0.274 0.006 286.033);
    --secondary-foreground: oklch(0.985 0 0);
    --muted: oklch(0.274 0.006 286.033);
    --muted-foreground: oklch(0.705 0.015 286.067);
    --accent: oklch(0.274 0.006 286.033);
    --accent-foreground: oklch(0.985 0 0);
    --destructive: oklch(0.704 0.191 22.216);
    --border: oklch(1 0 0 / 10%);
    --input: oklch(1 0 0 / 15%);
    --ring: oklch(0.6255 0.2214 1.3381);
    --chart-1: oklch(0.488 0.243 264.376);
    --chart-2: oklch(0.696 0.17 162.48);
    --chart-3: oklch(0.769 0.188 70.08);
    --chart-4: oklch(0.627 0.265 303.9);
    --chart-5: oklch(0.645 0.246 16.439);
    --sidebar: oklch(0.21 0.006 285.885);
    --sidebar-foreground: oklch(0.985 0 0);
    --sidebar-primary: oklch(0.6255 0.2214 1.3381);
    --sidebar-primary-foreground: oklch(1 0 0);
    --sidebar-accent: oklch(0.274 0.006 286.033);
    --sidebar-accent-foreground: oklch(0.985 0 0);
    --sidebar-border: oklch(1 0 0 / 10%);
    --sidebar-ring: oklch(0.6255 0.2214 1.3381);
    /**********************************************************
    CUSTOM COLORS
    **********************************************************/
    --danger: oklch(0.63 0.24 29.23);
    --warn: oklch(0.76 0.15 85.87);
    --success: oklch(0.64 0.17 145.7);
    --info: oklch(0.64 0.17 225.83);
    --constructive: oklch(0.69 0.15 164.25);
  }
}

:root {
	--radius-sm: calc(var(--radius) - 4px);
	--radius-md: calc(var(--radius) - 2px);
	--radius-lg: var(--radius);
	--radius-xl: calc(var(--radius) + 4px);

  /* The type stack. The files are shipped with the service - the client self-hosts them
   * too, with the reason in its own app.css: "no CDN - app must work in offline/customer
   * networks". An admin page next to a signing key has the same requirement twice over. */
  --font-sans: 'IBM Plex Sans', ui-sans-serif, system-ui, sans-serif;
  --font-mono: 'IBM Plex Mono', ui-monospace, monospace;
}

@font-face {
  font-family: 'IBM Plex Sans'; font-style: normal; font-weight: 400; font-display: swap;
  src: url('/admin/static/fonts/ibm-plex-sans-latin-400-normal.woff2') format('woff2');
}
@font-face {
  font-family: 'IBM Plex Sans'; font-style: normal; font-weight: 500; font-display: swap;
  src: url('/admin/static/fonts/ibm-plex-sans-latin-500-normal.woff2') format('woff2');
}
@font-face {
  font-family: 'IBM Plex Sans'; font-style: normal; font-weight: 600; font-display: swap;
  src: url('/admin/static/fonts/ibm-plex-sans-latin-600-normal.woff2') format('woff2');
}
@font-face {
  font-family: 'IBM Plex Mono'; font-style: normal; font-weight: 400; font-display: swap;
  src: url('/admin/static/fonts/ibm-plex-mono-latin-400-normal.woff2') format('woff2');
}