/* CleanChain SYS — design tokens
 *
 * Source: req/ux/style_guide.md §2.1 (deep navy primary, mid-blue
 * secondary, olive accent).
 *
 * Scoped under [data-theme="sys"] so the same file can coexist with
 * the other three App themes (e.g. on the dev quick-login grid).
 *
 * App-chrome contract — every theme MUST expose:
 *   --app-header-bg, --app-header-fg, --app-header-hover-bg
 *   --app-primary,   --app-primary-hover
 *   --app-secondary, --app-secondary-hover
 *
 * Shadcn-style aliases (--primary / --background / etc.) also defined
 * so utility classes like `bg-primary` rebrand automatically.
 */

[data-theme="sys"] {
  /* App-chrome contract */
  --app-header-bg:        hsl(204, 38%, 28%);
  --app-header-fg:        hsl(0, 0%, 100%);
  --app-header-hover-bg:  hsl(204, 38%, 34%);
  --app-primary:          hsl(204, 38%, 28%);
  --app-primary-hover:    hsl(204, 38%, 34%);
  --app-secondary:        hsl(204, 24%, 47%);
  --app-secondary-hover:  hsl(204, 24%, 40%);

  /* Shadcn-style palette */
  --primary:              hsl(204, 38%, 28%);
  --primary-foreground:   hsl(0, 0%, 100%);
  --secondary:            hsl(204, 24%, 47%);
  --secondary-foreground: hsl(0, 0%, 100%);
  --accent:               hsl(71, 55%, 40%);
  --accent-foreground:    hsl(0, 0%, 100%);
  --destructive:          hsl(350, 80%, 46%);
  --destructive-foreground: hsl(0, 0%, 100%);
  --muted:                hsl(216, 14%, 93%);
  --muted-foreground:     hsl(220, 6%, 46%);
  --background:           hsl(216, 20%, 95%);
  --foreground:           hsl(204, 44%, 21%);
  --border:               hsl(0, 0%, 85%);
  --input:                hsl(0, 0%, 75%);
  --ring:                 hsl(204, 38%, 28%);
  --card:                 hsl(0, 0%, 100%);
  --card-foreground:      hsl(204, 44%, 21%);
  --card-border:          hsl(0, 0%, 90%);
  --sidebar:              hsl(0, 0%, 96%);
  --sidebar-primary:      hsl(204, 38%, 28%);
  --sidebar-primary-fg:   hsl(0, 0%, 100%);
  --sidebar-foreground:   hsl(204, 44%, 21%);
  --sidebar-border:       hsl(0, 0%, 88%);
  --popover:              hsl(0, 0%, 100%);
  --popover-border:       hsl(0, 0%, 90%);
  --elevate-1:            rgba(0,0,0,0.03);
  --elevate-2:            rgba(0,0,0,0.08);
}
