/*
 * Simsalon official-site theme overlay.
 *
 * Re-skins the modern Betriebsliste to match https://www.simsalon.info/
 * (black background, golden yellow #FFCE52 accent, "SimsalonBold" headings
 * from /shared/Nightclub_20BTN_20Bold.woff, Arial body text).
 *
 * Loaded *after* styles.css so its rules win without touching the base file.
 */

@font-face {
  font-family: SimsalonBold;
  src: url('./fonts/Nightclub_20BTN_20Bold.woff') format('woff'),
       url('./fonts/Nightclub_20BTN_20Bold.ttf') format('truetype');
  font-display: swap;
}

:root {
  --bg: #000000;
  --surface: #111111;
  --surface-2: #1c1c1c;
  --ink: #ffffff;
  --muted: #cfcfcf;
  --accent: #ffce52;
  --accent-ink: #000000;
  --line: #333333;
  --ok: #4caf50;
  --warn: #ffce52;
  --danger: #e53935;
  --shadow: 0 14px 30px rgba(0, 0, 0, 0.55);
}

body {
  font-family: Arial, Helvetica, sans-serif;
  color: var(--ink);
  background:
    radial-gradient(1400px 600px at 10% -20%, rgba(255, 206, 82, 0.18), transparent 70%),
    radial-gradient(1200px 700px at 90% -30%, rgba(255, 206, 82, 0.10), transparent 64%),
    var(--bg);
}

/* Headings use the official Simsalon display font */
h1, h2, h3,
.hero h1,
.bereich__head h2,
.card h3 {
  font-family: SimsalonBold, "Trebuchet MS", Arial, sans-serif;
  color: var(--accent);
  letter-spacing: 0.02em;
}

.hero__kicker {
  color: var(--accent);
}

/* Panels / cards on dark surface */
.panel,
.bereich {
  background: var(--surface);
  border: 1px solid var(--line);
  color: var(--ink);
}

.bereich__head {
  border-bottom: 1px solid var(--line);
  background: linear-gradient(90deg, rgba(255, 206, 82, 0.18), rgba(255, 206, 82, 0.04));
}

.bereich__meta {
  color: var(--muted);
}

.card {
  background: var(--surface-2);
  border: 1px solid var(--line);
  color: var(--ink);
}

label {
  color: var(--accent);
}

select,
input {
  background: #000;
  color: var(--ink);
  border: 1px solid var(--accent);
  border-radius: 6px;
}

select:focus,
input:focus {
  outline: 2px solid var(--accent);
  outline-offset: 1px;
}

.stats {
  color: var(--muted);
}

/* Metric pills */
.metric {
  color: var(--accent);
  background: #000;
  border: 1px solid var(--line);
}

/* Availability chips / dots: keep red / yellow / green semantics,
   but use the Simsalon yellow for the "in Verhandlung" middle state. */
.chip {
  border-radius: 5px; /* matches site button radius */
  font-weight: 700;
}
.chip--1 { background: var(--danger); color: #fff; }
.chip--2 { background: var(--accent); color: var(--accent-ink); }
.chip--3 { background: var(--ok);     color: #fff; }

.dot--1 { background: var(--danger); }
.dot--2 { background: var(--accent); }
.dot--3 { background: var(--ok); }

/* Secondary text inside cards */
.text,
.text-list li {
  color: var(--muted);
}

.text-section__title {
  color: var(--accent);
}

.panel--error {
  background: #2a0d0a;
  color: #ffb4a8;
  border-color: var(--danger);
}
