:root {
  /* ==========================================================================
     Grundfarben
     ========================================================================== */

  --color-white: #fff;
  --color-black: #000;

  --color-headline: #def2ff;
  --color-default-font: var(--color-headline);

  --color-background: #0c1014;
  --color-background-trans: rgba(15, 9, 46, 0.97);
  --color-border: #ffe0fd8f;

  --color-footer: #0c1014;
  --color-background-footer: #060708;
  --color-card-dark: #020a15;

  --special-font-color: #60a3cf;

  --hwt-muted: #686d74;

  /* ==========================================================================
     Brand- & Akzentfarben
     ========================================================================== */

  --color-accent: #60a3cf;
  --color-button-hover: #9fd9ff;
  --hwt-button-hover: #60a3cf;

  --hwt-spot: radial-gradient(
    ellipse at center,
    color-mix(in srgb, var(--color-button-hover) 44%, transparent) 0%,
    color-mix(in srgb, var(--color-button-hover) 15%, transparent) 42%,
    transparent 90%
  );

  --color-news-badge: #a84000;

  /* ==========================================================================
     Transparenzen & Overlays
     ========================================================================== */

  --menu-overlay-bg: rgba(0, 0, 0, 0.95);
  --color-overlay-light: rgba(255, 255, 255, 0.4);

  --color-white-65: rgba(255, 255, 255, 0.65);
  --color-white-40: rgba(255, 255, 255, 0.4);
  --color-white-35: rgba(255, 255, 255, 0.35);
  --color-white-30: rgba(255, 255, 255, 0.3);
  --color-white-18: rgba(255, 255, 255, 0.18);
  --color-white-15: rgba(255, 255, 255, 0.15);
  --color-white-08: rgba(255, 255, 255, 0.08);

  /* ==========================================================================
     Komponenten
     ========================================================================== */

  --infobox: rgba(15, 7, 54, 0.95);
  --color-loader-bg: rgba(255, 255, 255, 0.2);

  /* ==========================================================================
     Header & Navigation
     ========================================================================== */

  --header-bg: linear-gradient(
    180deg,
    rgba(0, 0, 0, 1) 0%,
    rgba(0, 0, 0, 0) 95%
  );

  /* ==========================================================================
     Tickets & Statusfarben
     ========================================================================== */

  --color-card-bg: #020a15;
  --color-overlay-hover: rgba(159, 217, 255, 0.1);

  --color-success: #50a000;
  --color-warning: #ffbb22;
  --color-error: #ff5555;

  /* ==========================================================================
     Effekte
     ========================================================================== */

  --text-shadow-glow:
    0 0 8px rgb(255 255 255 / 30%), 0 0 24px rgb(255 255 255 / 22%),
    0 0 56px rgb(255 255 255 / 14%), 0 0 96px rgb(255 255 255 / 8%);
}