/* Basic colours */
:root {
  color-scheme: light dark;

  /* Primärpalette – Tailwind Zinc (Neutral) */
  --color-zinc-50:  oklch(98.5% 0 0);
  --color-zinc-100: oklch(96.7% .001 286.375);
  --color-zinc-200: oklch(92% .004 286.32);
  --color-zinc-300: oklch(87.1% .006 286.286);
  --color-zinc-400: oklch(70.5% .015 286.067);
  --color-zinc-500: oklch(55.2% .016 285.938);
  --color-zinc-600: oklch(44.2% .017 285.786);
  --color-zinc-700: oklch(37% .013 285.805);
  --color-zinc-800: oklch(27.4% .006 286.033);
  --color-zinc-900: oklch(21% .006 285.885);
  --color-zinc-950: oklch(14.1% .005 285.823);

  /* Signalfarben – Tailwind Rose (Fehler) */
  --color-rose-50:  oklch(96.9% .015 12.422);
  --color-rose-100: oklch(94.1% .03 12.58);
  --color-rose-200: oklch(89.2% .058 10.001);
  --color-rose-300: oklch(81% .117 11.638);
  --color-rose-400: oklch(71.2% .194 13.428);
  --color-rose-500: oklch(64.5% .246 16.439);
  --color-rose-600: oklch(58.6% .253 17.585);
  --color-rose-700: oklch(51.4% .222 16.935);
  --color-rose-800: oklch(45.5% .188 13.697);
  --color-rose-900: oklch(41% .159 10.272);
  --color-rose-950: oklch(27.1% .105 12.094);

  /* Signalfarben – Tailwind Emerald (OK/Success) */
  --color-emerald-50:  oklch(97.9% .021 166.113);
  --color-emerald-100: oklch(95% .052 163.051);
  --color-emerald-200: oklch(90.5% .093 164.15);
  --color-emerald-300: oklch(84.5% .143 164.978);
  --color-emerald-400: oklch(76.5% .177 163.223);
  --color-emerald-500: oklch(69.6% .17 162.48);
  --color-emerald-600: oklch(59.6% .145 163.225);
  --color-emerald-700: oklch(50.8% .118 165.612);
  --color-emerald-800: oklch(43.2% .095 166.913);
  --color-emerald-900: oklch(37.8% .077 168.94);
  --color-emerald-950: oklch(26.2% .051 172.552);

  /* Signalfarben – Tailwind Amber (Warnungen) */
  --color-amber-50:  oklch(98.7% .022 95.277);
  --color-amber-100: oklch(96.2% .059 95.617);
  --color-amber-200: oklch(92.4% .12 95.746);
  --color-amber-300: oklch(87.9% .169 91.605);
  --color-amber-400: oklch(82.8% .189 84.429);
  --color-amber-500: oklch(76.9% .188 70.08);
  --color-amber-600: oklch(66.6% .179 58.318);
  --color-amber-700: oklch(55.5% .163 48.998);
  --color-amber-800: oklch(47.3% .137 46.201);
  --color-amber-900: oklch(41.4% .112 45.904);
  --color-amber-950: oklch(27.9% .077 45.635);

  /* TV-Variablen – Light Theme, möglichst nah an den Original-Tönen */
  /* Text auf hellem Hintergrund ≈ #000000 */
  --tv-fg:    var(--color-zinc-950);
  /* Seitenhintergrund ≈ #ffffff */
  --tv-bg:    var(--color-zinc-50);
  /* Primär-Akzent ≈ #666699 (mittleres, kühles Dunkel) */
  --tv-foreg: var(--color-zinc-700);
  /* Panel-Hintergründe ≈ #dfdfff (sehr hell) */
  --tv-backg: var(--color-zinc-100);

  /* Link-Farbe nah am Original belassen (Blau) */
  --tv-link:#659D98;

  /* Signalfarben – dicht an ursprünglichen Eindrücken */
  /* kräftiges Fehler-Rot ≈ #c70000 */
  --tv-error: var(--color-rose-600);
  /* „Probable error“ etwas dunkler als normaler Text */
  --tv-poss:  var(--color-rose-700);
  /* Warnungen mit warmem Amber-Ton */
  --tv-warn:  var(--color-amber-700);
  /* OS/HTML-spezifische Fehler – eher orange-rot wie bisher */
  --tv-os:    var(--color-amber-700);
  --tv-tv:    var(--color-emerald-600);
  --tv-ht:    var(--color-rose-600);

  /* Neutrale Töne / Rahmen */
  --tv-inv:  var(--color-zinc-900);
  --tv-grey: var(--color-zinc-200);
  --tv-grey2:var(--color-zinc-300);
}
/* Dark theme colours */
@media (prefers-color-scheme: dark) {
  :root {
    color:            var(--color-zinc-50);
    background-color: var(--color-zinc-950);

    /* TV-Variablen – Dark Theme, Kontrast gewahrt */
    --tv-fg:    var(--color-zinc-50);
    --tv-bg:    var(--color-zinc-950);
    --tv-foreg: var(--color-zinc-200);
    --tv-backg: var(--color-zinc-900);

    /* Links im Dark Mode leicht aufgehellt */
    --tv-link:#659D98;

    /* Signale im Dark Mode etwas heller für bessere Lesbarkeit */
    --tv-error: var(--color-rose-400);
    --tv-poss:  var(--color-rose-300);
    --tv-warn:  var(--color-amber-300);
    --tv-os:    var(--color-amber-400);
    --tv-tv:    var(--color-emerald-400);
    --tv-ht:    var(--color-rose-400);

    /* Neutrale Töne im Dark Mode */
    --tv-inv:  var(--color-zinc-50);
    --tv-grey: var(--color-zinc-800);
    --tv-grey2:var(--color-zinc-700);
  }
  .feature, .use {
    color:unset;
  }
  img:not(.dark), object {
    filter: brightness(.8) contrast(1.2);
  }
  img.vdark {
    filter: brightness(1.4);
  }
}