/* BlazorBlueprint theme (shadcn CSS variables, OKLCH) tuned to the Nuxt UI look of the portal:
   white background, neutral-950 text, black primary buttons, neutral-200 borders, neutral-50/500 muted,
   brand green #01BA76 available as --brand. Loaded BEFORE blazorblueprint.css. */
:root {
  --background: oklch(1 0 0);                  /* white */
  --foreground: oklch(0.145 0 0);              /* neutral-950 */
  --card: oklch(1 0 0);
  --card-foreground: oklch(0.145 0 0);
  --popover: oklch(1 0 0);
  --popover-foreground: oklch(0.145 0 0);
  --primary: oklch(0.145 0 0);                 /* #0a0a0a - the site's buttons are black */
  --primary-foreground: oklch(0.985 0 0);
  --secondary: oklch(0.97 0 0);                /* neutral-100 */
  --secondary-foreground: oklch(0.205 0 0);
  --muted: oklch(0.985 0 0);                   /* neutral-50 */
  --muted-foreground: oklch(0.556 0 0);        /* neutral-500 */
  --accent: oklch(0.97 0 0);
  --accent-foreground: oklch(0.205 0 0);
  --destructive: oklch(0.577 0.245 27.325);
  --destructive-foreground: oklch(1 0 0);
  --border: oklch(0.922 0 0);                  /* neutral-200 */
  --input: oklch(0.922 0 0);
  --ring: oklch(0.708 0 0);

  /* brand accent (Nuxt primary green #01BA76) */
  --brand: oklch(0.6977 0.1673 160.56);
  --brand-foreground: oklch(1 0 0);
  /* info blue #4B90F4 */
  --info: oklch(0.6451 0.1548 257.62);
  --info-foreground: oklch(1 0 0);

  /* alerts */
  --alert-success: oklch(0.6977 0.1673 160.56);
  --alert-success-foreground: oklch(0.35 0.09 160);
  --alert-success-bg: oklch(0.985 0.01 160);
  --alert-info: oklch(0.6451 0.1548 257.62);
  --alert-info-foreground: oklch(0.32 0.1 257);
  --alert-info-bg: oklch(0.985 0.008 257);
  --alert-warning: oklch(0.68 0.18 55);
  --alert-warning-foreground: oklch(0.35 0.10 55);
  --alert-warning-bg: oklch(0.99 0.01 55);
  --alert-danger: oklch(0.55 0.22 27);
  --alert-danger-foreground: oklch(0.30 0.12 27);
  --alert-danger-bg: oklch(0.99 0.008 27);

  --chart-1: oklch(0.6977 0.1673 160.56);
  --chart-2: oklch(0.6451 0.1548 257.62);
  --chart-3: oklch(0.49 0.19 295);
  --chart-4: oklch(0.68 0.18 55);
  --chart-5: oklch(0.55 0 0);

  /* sidebar (portal nav is neutral-100 like the Nuxt app) */
  --sidebar: oklch(0.97 0 0);
  --sidebar-foreground: oklch(0.145 0 0);
  --sidebar-primary: oklch(0.145 0 0);
  --sidebar-primary-foreground: oklch(0.985 0 0);
  --sidebar-accent: oklch(0.922 0 0);
  --sidebar-accent-foreground: oklch(0.145 0 0);
  --sidebar-border: oklch(0.922 0 0);
  --sidebar-ring: oklch(0.708 0 0);
  --sidebar-width: 16rem;
  --sidebar-width-mobile: 18rem;
  --sidebar-width-icon: 4.25rem;

  --radius: 0.5rem;
  --font-sans: Inter, ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --font-serif: ui-serif, Georgia, serif;
  --font-mono: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
}

html, body { font-family: var(--font-sans); background: var(--background); color: var(--foreground); }
html { height: 100%; }
body { min-height: 100%; margin: 0; -webkit-font-smoothing: antialiased; }
#app { min-height: 100dvh; }

/* Blazor error UI (kept neutral) */
#blazor-error-ui { display: none; position: fixed; bottom: 0; left: 0; right: 0; z-index: 1000; background: #fff3e6; color: #6c3809; border-top: 1px solid #f0b78e; padding: 0.75rem 1.25rem; font-size: 0.875rem; }
#blazor-error-ui .dismiss { position: absolute; right: 1rem; top: 0.6rem; cursor: pointer; }

/* Loading splash */
.le-splash { min-height: 100dvh; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 1rem; color: #737373; font-size: 0.875rem; }
.le-splash .le-splash-logo { width: 3rem; height: 3rem; border-radius: 0.5rem; background: #0a0a0a; color: #fff; display: flex; align-items: center; justify-content: center; font-weight: 700; letter-spacing: 0.05em; }
.le-splash .le-splash-bar { width: 10rem; height: 0.25rem; border-radius: 9999px; background: #e5e5e5; overflow: hidden; }
.le-splash .le-splash-bar > div { height: 100%; width: var(--blazor-load-percentage, 0%); background: #0a0a0a; transition: width 0.2s; }
