/* WEB ANTON — Vikunja (Projekte), dunkel. Stand 2026-10-19.
 * Dunkelmodus ist Vikunjas eigener (Benutzereinstellung color_schema=dark),
 * die Logos kommen ueber VIKUNJA_SERVICE_CUSTOMLOGOURL(DARK). Hier nur:
 * Primaerfarbe = Marken-Akzent (#9fd3ff = hsl 207.5 100% 81%) mit dunkler
 * Schrift darauf, und die Markenschriften. Tokens: /brand/brand.css */
:root, html.dark, .dark {
  --primary: var(--brand-accent) !important;
  --primary-h: 207.5deg !important;
  --primary-s: 100% !important;
  --primary-l: 81% !important;
  --primary-hsl: 207.5, 100%, 81% !important;
  --primary-invert: var(--brand-on-accent) !important;
  --primary-light: var(--brand-accent-soft) !important;
  --primary-dark: var(--brand-accent-deep) !important;
}
body, .app-container, input, textarea, button, select { font-family: var(--brand-font-text) !important; }
.title, h1, h2, h3, .project-title, .navbar .project-title { font-family: var(--brand-font-display) !important; font-weight: 500 !important; }
.button.is-primary, .button.is-primary:hover { color: var(--brand-on-accent) !important; }

/* Neutrale Grautoene statt Vikunjas blaugrauer Dunkel-Skala (Werte = Marken-Neutrale).
 * Vikunja invertiert die Skala im Dunkelmodus: 50 = dunkelste Flaeche, 900 = hellste.
 * Die -hsl-Varianten nutzt Vikunja fuer transparente Toene. */
html.dark {
  --grey-50: hsl(240, 6.7%, 11.8%) !important;  --grey-50-hsl: 240, 6.7%, 11.8% !important;   /* #1c1c20 */
  --grey-100: hsl(240, 5.4%, 14.5%) !important; --grey-100-hsl: 240, 5.4%, 14.5% !important;  /* #232327 */
  --grey-200: #3a3a41 !important;
  --grey-300: #52525b !important;
  --grey-400: #71717a !important;
  --grey-500: hsl(240, 4.9%, 65.1%) !important; --grey-500-hsl: 240, 4.9%, 65.1% !important;  /* #a1a1aa */
  --grey-600: #d4d4d8 !important;
  --grey-700: #e4e4e7 !important;
  --grey-800: #f4f4f5 !important;
  --grey-900: hsl(0, 0%, 98%) !important;        --grey-900-hsl: 0, 0%, 98% !important;
  --scheme-invert: var(--grey-900) !important;
  --site-background: var(--brand-bg) !important;
  --scheme-main: var(--brand-surface) !important;
  --white: var(--brand-surface) !important;
  --scheme-main-bis: var(--brand-raised) !important;
  --scheme-main-ter: var(--brand-raised) !important;
  --border: var(--brand-line-strong) !important;
  --text: var(--brand-text) !important;
}