/*
  Kernlogik Theme Tokens v1
  Source of truth: kernplattform/docs/design/branding/theme-tokens-v1.md
  This file is module-neutral and may be copied into other modules unchanged.
*/

:root {
  --brand-primary: #4c7dff;
  --brand-primary-hover: #6f95ff;
  --brand-accent: #5ac97a;
  --theme-color: #0f1115;
}

[data-theme="light"] {
  --app-bg: #f6f8fb;
  --app-surface: #ffffff;
  --app-surface-muted: #eef2f7;
  --app-text: #121722;
  --app-text-muted: #667788;
  --app-border: #d7e0eb;
  --app-close-filter: none;
  color-scheme: light;
}

[data-theme="dark"] {
  --app-bg: #0f1115;
  --app-surface: #151922;
  --app-surface-muted: #1d2430;
  --app-text: #f4f7fb;
  --app-text-muted: #a9b6c7;
  --app-border: rgba(255,255,255,0.10);
  --app-close-filter: invert(1) grayscale(100%);
  color-scheme: dark;
}

[data-theme] {
  --bs-body-bg: var(--app-bg);
  --bs-body-color: var(--app-text);
  --bs-border-color: var(--app-border);
  --bs-secondary-color: var(--app-text-muted);
}

body {
  background: var(--app-bg);
  color: var(--app-text);
}

.theme-toggle {
  border: 1px solid var(--app-border);
  background: var(--app-surface-muted);
  color: var(--app-text);
  border-radius: 999px;
  font-weight: 700;
  line-height: 1;
  padding: .45rem .7rem;
}

.theme-toggle:hover,
.theme-toggle:focus-visible {
  border-color: var(--brand-primary);
  color: var(--app-text);
  outline: none;
}

.theme-toggle-label {
  font-size: .85rem;
}