/* ==========================================================================
   crAIze SmartCity – zentrales Erscheinungsbild (Issue #157)

   Alle Farben und Schriften des Viewers (Desktop, web-mobil, AR) kommen
   von hier. Neues Design = nur die Werte unten ändern, kein Code.
   Logo-Zeichen: brand/mark-smartcity.svg, Favicon: brand/favicon.svg.

   Die Variablennamen --bg, --panel, --line, --txt, --mut, --acc sind die
   bisherigen Namen aus index.html und bleiben gleich, damit vorhandenes
   CSS weiter funktioniert.
   ========================================================================== */

/* --- Schriften: selbst gehostet (keine Anfragen an Google, DSGVO) ------ */
@font-face{font-family:"Inter";font-style:normal;font-weight:400;font-display:swap;src:url("fonts/inter-latin-400-normal.woff2") format("woff2")}
@font-face{font-family:"Inter";font-style:normal;font-weight:500;font-display:swap;src:url("fonts/inter-latin-500-normal.woff2") format("woff2")}
@font-face{font-family:"Inter";font-style:normal;font-weight:600;font-display:swap;src:url("fonts/inter-latin-600-normal.woff2") format("woff2")}
@font-face{font-family:"Inter Tight";font-style:normal;font-weight:700;font-display:swap;src:url("fonts/inter-tight-latin-700-normal.woff2") format("woff2")}
@font-face{font-family:"Inter Tight";font-style:normal;font-weight:800;font-display:swap;src:url("fonts/inter-tight-latin-800-normal.woff2") format("woff2")}
@font-face{font-family:"Inter Tight";font-style:italic;font-weight:500;font-display:swap;src:url("fonts/inter-tight-latin-500-italic.woff2") format("woff2")}
@font-face{font-family:"JetBrains Mono";font-style:normal;font-weight:500;font-display:swap;src:url("fonts/jetbrains-mono-latin-500-normal.woff2") format("woff2")}
@font-face{font-family:"JetBrains Mono";font-style:normal;font-weight:600;font-display:swap;src:url("fonts/jetbrains-mono-latin-600-normal.woff2") format("woff2")}

:root{
  color-scheme:dark;

  /* Grundflächen */
  --bg:#0a0b14;                 /* Seitengrund (craize.de) */
  --bg-glow:#182347;            /* Navy-Schimmer, z. B. Ladebildschirm */
  --bg-glow-2:#111f26;          /* Petrol-Schimmer */
  --panel:rgba(14,19,36,.92);   /* schwebende Panels */
  --panel-solid:#0e1324;
  --scrim:rgba(6,8,14,.84);     /* Abdunklung hinter Dialogen */

  /* Linien */
  --line:rgba(170,180,198,.16);
  --line-soft:rgba(170,180,198,.10);
  --line-strong:rgba(170,180,198,.30);

  /* Text */
  --txt:#eef1f7;                /* Überschriften, wichtiger Text */
  --txt-2:#c3cbd8;              /* normaler Fließtext in Panels */
  --mut:#aab4c6;                /* Nebeninfos */
  --mut-2:#6f7a8f;              /* sehr leise Hinweise */

  /* Marke */
  --acc:#4ee0fd;                /* Akzent: aktiv, Links, Fokus */
  --acc-2:#3f7cfd;              /* Verlaufsende */
  --acc-hover:#8eebfe;
  --acc-ink:#0a0b14;            /* Schrift auf Akzentfläche */
  --acc-soft:rgba(78,224,253,.10);
  --grad:linear-gradient(90deg,#4ee0fd,#3f7cfd);
  --label:#40c4d0;              /* Mono-Beschriftungen, Rubriken */
  --pink:#fc4080;               /* nur sparsam: BETA, Live-Punkte */
  --warm:#4ee0fd;               /* früher Gelb: Sonnenstand-Regler, Uhrzeit */

  /* Bedienelemente */
  --btn:rgba(255,255,255,.04);
  --btn-hover:rgba(255,255,255,.08);
  --row-hover:rgba(78,224,253,.07);
  --pri-bg:#edf0f7;             /* Hauptaktion: weiße Pill */
  --pri-ink:#17191c;
  --pri-hover:#ffffff;
  --radius:10px;
  --radius-pill:999px;

  /* Status */
  --err:#ff6b8a;
  --chip-fg:#8eebfe;            /* Kategorie-Chips (z. B. Veranstaltungen) */
  --chip-bg:rgba(78,224,253,.10);
  --chip-line:rgba(78,224,253,.35);

  /* Schriften */
  --f-display:"Inter Tight","Inter","Segoe UI",system-ui,sans-serif;
  --f-body:"Inter","Segoe UI",system-ui,-apple-system,Roboto,sans-serif;
  --f-mono:"JetBrains Mono",ui-monospace,"Cascadia Mono",Consolas,monospace;
}

/* --- Wortmarke "crAIze SmartCity" (HTML + dieses CSS) ----------------- */
.brand-lockup{display:inline-flex;align-items:center;gap:.5em;font-family:var(--f-display);font-weight:800;letter-spacing:-.02em;color:var(--txt);line-height:1;white-space:nowrap}
.brand-lockup img{width:1.4em;height:1.4em;flex:none;display:block}
.brand-lockup b{font-weight:inherit;background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.brand-lockup i{font-style:italic;font-weight:500;letter-spacing:-.01em;color:var(--mut)}
.brand-sub{font-family:var(--f-body);font-size:11.5px;color:var(--mut);margin-top:3px}
.brand-badge{display:inline-flex;align-items:center;gap:5px;font:600 10px/1 var(--f-mono);letter-spacing:.06em;color:var(--pink);border:1px solid currentColor;border-radius:20px;padding:3px 8px;white-space:nowrap}
.brand-badge::before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor;box-shadow:0 0 8px currentColor}

/* --- Aufklapplisten: feste dunkle Flaeche. Ohne das zeichnet Windows die Liste
       weiss und uebernimmt die helle Schrift -> kaum lesbar. ---------------- */
select option,select optgroup{background-color:var(--panel-solid);color:var(--txt)}
