/*
 * Vikunja Custom Theme — ISOLED-CD-Anpassung
 * Eingespielt via nginx sub_filter auf tasks.thomaswinkler.art.
 * Versionsverwaltung: scripts/vikunja/custom.css → /opt/vikunja/custom.css
 *
 * Pflege-Hinweis: Selektoren wurden gegen Vikunja 2.3.0 verifiziert
 * (assets/index-CsHCAgIP.css, 20.05.2026). Bei Major-Update Selektoren
 * nachprüfen, insbesondere `.llama-cool[data-v-…]` (scoped data-attr).
 */

/* === 1) Accent-Farbe: ISOLED-Cyan (#00B9F1, HSL 195° 100% 47%) ============ */
:root {
  --primary-h: 195deg;
  --primary-s: 100%;
  --primary-l: 42%;
  --primary-light-l: 92%;
  --primary-dark-l: 28%;
  --primary-invert: #ffffff;
}

/* Im Dark-Theme leicht heller, damit der Cyan auf Anthrazit gut leuchtet */
.dark {
  --primary-h: 195deg;
  --primary-s: 100%;
  --primary-l: 55%;
}

/* === 2) Wärmeres, neutraleres Anthrazit statt blau-getöntes Dunkel ======== */
.dark {
  /* Original: 220.9° 39.3% 11%  → sehr blauer Cast
     Neu:     220°   6%   10%   → fast neutraler Anthrazit */
  --grey-50-hsl: 220, 6%, 10%;
  --grey-100-hsl: 220, 5%, 14%;
  --grey-200: hsl(220, 5%, 22%);
  --grey-300: hsl(220, 5%, 32%);
  --site-background: hsl(220, 6%, 10%);
}

/* Navigations-Sidebar leicht abgehoben, damit Cards/Content-Pane sich absetzen */
.dark .namespace-container,
.dark .navigation,
.dark aside.namespace-container {
  background-color: hsl(220, 7%, 8%) !important;
}

.dark .app-container,
.dark .app-container__content,
.dark .content-wrapper,
.dark .card,
.dark .modal-card-body {
  background-color: hsl(220, 5%, 14%);
}

/* === 3) Alpaka-Empty-State auf der Startseite ausblenden ================== */
.llama-cool { display: none !important; }
.message-illustration img[src*="llama"] { display: none !important; }

/* Stattdessen etwas Luft + zentrierter Status-Text */
.message-illustration { min-height: 1rem; }

/* === 4) Logo-Replacement ist in custom.js (DOM-Substitution per JS) ======= */
/* Reine CSS-Replacement-Versuche scheitern, weil `.logo` IST das SVG (kein
   Wrapper) und in mehreren Scopes existiert. Stattdessen ersetzt
   /custom.js alle <svg> mit `<title>Vikunja</title>` durch ein <span>Tasks</span>
   per MutationObserver. Hier nur dezente Typografie für den Ersatz-Span: */
span.vk-logo-replacement {
  font-size: 1.5rem;
  font-weight: 600;
  letter-spacing: -0.01em;
  padding-inline: 1rem;
  color: var(--logo-text-color, var(--text-strong));
  display: inline-flex;
  align-items: center;
  min-height: 48px;
}