/* 12-venues.css · Teil 12 von 19 · Venue-Evaluation, -Standorte, -Detail. Reihenfolge der Dateien = Kaskade (index.html), nicht umsortieren. */
/* ── Venue-Evaluation ── */
.ve-b { display:inline-block; padding:2px 8px; border-radius:99px; font-size:11.5px; font-weight:600; white-space:nowrap; }
/* Auf `.ve-b.XXX` gescopt (evalBadge() traegt immer beide Klassen) -
   sonst wuerde dieselbe blasse Pillenfarbe auch auf den Punkt/Balken der
   neuen Kennzahlkarten durchschlagen, die eine kraeftige Farbe brauchen. */
.ve-b.ve-open { background:#EEF0F4; color:#5A6276; }
.ve-b.ve-shared { background:#EAF3FF; color:#1B4E8F; }
.ve-b.ve-kontakt { background:#E7F6F6; color:#0B6E6E; }
.ve-b.ve-anfrage { background:#FFF3E0; color:#96590B; }
.ve-b.ve-reminder { background:#FDECC8; color:#8A5B00; }
.ve-b.ve-verhandlung { background:#E9F7EC; color:#1F6B3A; }
.ve-b.ve-zusage { background:#D9F2E3; color:#0A6B49; }
.ve-b.ve-tot { background:#F3F4F8; color:#8A8F9C; }
.ve-b.ve-gebucht { background:#FFE9EF; color:#B4123F; }
/* Kraeftige Variante fuer Punkt (.ve-t-p) und Anteilsbalken (.ve-stat-bar i)
   der Kennzahlkarten - dieselben Farben wie oben, nur als Volltonflaeche
   statt blasser Pille. */
.ve-t-p.ve-open, .ve-stat-bar i.ve-open { background:#5A6276; }
.ve-t-p.ve-shared, .ve-stat-bar i.ve-shared { background:#1B4E8F; }
.ve-t-p.ve-kontakt, .ve-stat-bar i.ve-kontakt { background:#0B6E6E; }
.ve-t-p.ve-anfrage, .ve-stat-bar i.ve-anfrage { background:#96590B; }
.ve-t-p.ve-reminder, .ve-stat-bar i.ve-reminder { background:#8A5B00; }
.ve-t-p.ve-verhandlung, .ve-stat-bar i.ve-verhandlung { background:#1F6B3A; }
.ve-t-p.ve-zusage, .ve-stat-bar i.ve-zusage { background:#0A6B49; }
.ve-prio { font-weight:700; font-size:11px; border-radius:4px; padding:1px 5px; background:#FFF4F7; color:#B4123F; }
.ve-prio.p2 { background:#EEF0FB; color:#3A4A8F; }
.ve-prio.p3 { background:#F3F4F8; color:#6B7280; }
/* Frueher `.ve-chips`/`.ve-c` (Kachelleiste ersetzt durch Filter-Chips) —
   Evaluation und Standorte nutzen inzwischen beide `.seg-filter` (s.u.). */
.ve-t-p { display:inline-block; width:7px; height:7px; border-radius:99px; align-self:center; }

/* Segmentierte Filterleiste - generisches Muster (nicht nur Venues, auch
   Showtimings und Crew): helle Spur, aktiver Abschnitt als weisse
   Pille mit dezentem Schatten, wie ein iOS-Segmented-Control. */
/* Spur #ECEAE4 (dunkler als die Grundfarbe) — mit var(--bg) verschwaende
   die Leiste auf der Flaeche der Vorlagen-Seiten. */
.seg-filter { display:inline-flex; gap:2px; background:#ECEAE4; border:0;
  border-radius:8px; padding:3px; flex-wrap:wrap; }
.seg-filter-i { border:none; background:none; border-radius:6px; height:30px; padding:0 12px; font-size:13px;
  font-weight:400; color:#45434F; cursor:pointer; font-family:inherit; white-space:nowrap; }
.seg-filter-i b { font-weight:600; margin-right:4px; font-variant-numeric:tabular-nums; }
.seg-filter-i:hover { color:#1C1B22; }
.seg-filter-i.aktiv { background:#fff; color:#1C1B22; font-weight:600; box-shadow:0 1px 2px rgba(0,0,0,.08); }

/* Stufen-Uebersicht als Kennzahlkarten statt Kachelleiste: Punkt+Label,
   grosse Zahl, duenner Anteilsbalken relativ zur staerksten Stufe. */
.ve-stat-grid { display:flex; gap:10px; flex-wrap:wrap; margin:14px 0 4px; }
.ve-stat { flex:1 1 118px; min-width:104px; text-align:left; background:#fff; border:1px solid var(--border);
  border-radius:10px; padding:11px 14px; cursor:pointer; font-family:inherit; }
.ve-stat:hover { border-color:var(--muted); }
.ve-stat.aktiv { border-color:var(--pink); box-shadow:0 0 0 1px var(--pink); }
.ve-stat-top { display:flex; align-items:center; gap:6px; font-size:12.5px; color:var(--muted); font-weight:500; }
.ve-stat-n { display:block; font-size:23px; font-weight:700; color:var(--navy); margin:5px 0 9px;
  font-variant-numeric:tabular-nums; }
.ve-stat-bar { display:block; height:3px; border-radius:99px; background:#EEF0F4; overflow:hidden; }
.ve-stat-bar i { display:block; height:100%; border-radius:99px; }
/* `.ve-stat` ist generisch (wie `.seg-filter`) — Material und Showtimings
   nutzen dieselben Kennzahlkarten fuer reine Anzeige statt eines Anteils-
   balkens: `.ro` (read-only) nimmt den Klick-Cursor weg, `.ve-stat-sub`
   ist die Textzeile an der Stelle des Balkens. */
.ve-stat.ro { cursor:default; }
.ve-stat.ro:hover { border-color:var(--border); }
.ve-stat-sub { display:block; font-size:12px; color:var(--muted); }
/* Die Evaluation steht als **Liste** da (das Board mit einer Spalte je Stufe
   ist raus: bei 90 Venues scrollte man waagrecht und verglich nichts). Die
   Tabelle selbst ist jetzt identisch mit der Venue-Liste (`venueZeileHtml`
   in hub-venue.js) — eigene Spalten-CSS braucht sie darum nicht mehr. */
/* ── Venue-Standorte ── */
.vs-p { display:inline-block; width:9px; height:9px; border-radius:99px; margin-right:6px; vertical-align:middle; }
.vs-p.g { background:var(--pink,#E8185A); }          /* mit Projekt */
.vs-p.e { background:#49A86B; }                      /* in Evaluation */
.vs-p.t { background:#C3C9D6; }                      /* gestorben */
.vs-legende { font-size:11.5px; color:var(--muted); margin-top:10px; }
.vs-zeile { display:flex; gap:14px; flex-wrap:wrap; align-items:center; font-size:12.5px;
  color:var(--muted); margin:0 0 10px; }
.vs-zeile b { color:var(--navy); font-variant-numeric:tabular-nums; }
.vs-karte { height:430px; border:1px solid #E4E7F0; border-radius:12px; overflow:hidden; margin-bottom:10px; background:#EEF0F4; }
.vs-karte .leaflet-container { font:inherit; }
.vs-laender { display:grid; grid-template-columns:repeat(auto-fill,minmax(320px,1fr)); gap:10px; align-items:start; }
.vs-land { border:1px solid #E4E7F0; border-radius:10px; background:#FAFBFF; overflow:hidden; }
.vs-land-k { display:flex; align-items:center; gap:10px; width:100%; padding:9px 12px; background:none;
  border:0; font:inherit; cursor:pointer; text-align:left; }
.vs-land-k:hover { background:#F3F5FC; }
.vs-land-n { font-weight:700; color:var(--navy); flex:none; }
.vs-land-z { font-size:12px; color:var(--muted); flex:none; }
.vs-ar { color:var(--muted); font-size:12px; flex:none; }
.vs-bar { flex:1; display:flex; height:7px; border-radius:99px; overflow:hidden; background:#EEF0F4; min-width:60px; }
.vs-bar-g { background:var(--pink,#E8185A); } .vs-bar-e { background:#49A86B; } .vs-bar-t { background:#C3C9D6; }
.vs-land-b { padding:2px 12px 10px; background:#fff; border-top:1px solid #EEF0F4; }
.vs-stadt { padding:7px 0; border-bottom:1px solid #F3F4F8; }
.vs-stadt:last-child { border-bottom:none; }
.vs-stadt-k { font-size:11px; text-transform:uppercase; letter-spacing:.4px; color:var(--muted); margin-bottom:4px; }
.vs-v { display:inline-flex; align-items:center; gap:2px; background:#fff; border:1px solid #E7E9F0; border-radius:99px;
  padding:3px 10px; margin:0 5px 5px 0; font-size:12.5px; color:var(--navy); cursor:pointer; }
.vs-v:hover { border-color:var(--pink,#E8185A); }

/* ── Venue-Detail ── */
/* Venue-Kopf: links Titel und Ort, rechts Stand und Links — eine Achse.
   Die Kennzahlen-Kacheln (.vd-kpi/.vd-k) sind raus: drei von vier zeigten
   „—", und Stand wie Projektzahl standen ohnehin schon im Kopf. */
/* Steht im Detailkopf `.dk` (Flaechen-Modus): `.dk-zeile` liefert die Achse,
   `.vd-head` bleibt als Anker fuer die Tests. */
.vd-head { margin:0; }
.vd-head-r { display:flex; flex-direction:column; align-items:flex-end; gap:7px; flex:none; }
.vd-ort { font-size:14px; color:var(--muted); margin-top:4px; }
.vd-badges { display:flex; gap:10px; flex-wrap:wrap; align-items:center; justify-content:flex-end; }
.vd-badges .ve-b { display:inline-flex; align-items:center; gap:7px; height:30px; padding:0 12px;
  border-radius:15px; font-size:13px; font-weight:600; }
.vd-badges .ve-b::before { content:''; width:8px; height:8px; border-radius:50%; background:currentColor; opacity:.75; }
.vd-links { display:flex; gap:12px; flex-wrap:wrap; font-size:13px; justify-content:flex-end; }
/* Projektzeilen im Venue-Detail als ruhige weisse Kartenzeilen (Vorlage) —
   nur hier; `.lp` in Show-Detail/Venue-Liste bleibt unveraendert. */
.fl-sek .lp { height:56px; padding:0 16px; gap:14px; border-radius:10px; margin:0; }
.fl-sek .lp + .lp { margin-top:8px; }
.fl-sek .lp:hover { border-color:#C9C5BA; background:#fff; }
.fl-sek .lp .wb-id { color:var(--muted); width:56px; flex:none; }
.fl-sek .lp b { font-size:15px; font-weight:600; color:#1C1B22; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.fl-sek .lp .lp-meta { font-size:13px; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.fl-sek .lp .wb-badge { border-radius:5px; padding:3px 8px; font-size:12px; }
.lp-pfeil { color:#B3B0BA; display:flex; }
.lp-pfeil .psub-i { width:16px; height:16px; }
.vd-feld { margin-top:11px; }
.vd-feld textarea { width:100%; min-height:64px; padding:8px 10px; border:1px solid var(--border);
  border-radius:8px; font:inherit; font-size:13.5px; resize:vertical; }
.vd-feld textarea:focus { outline:none; border-color:var(--cyan); }
.vd-leer { font-size:11.5px; color:var(--muted); }
.vd-hinweis { font-size:12.5px; color:var(--muted); border-left:2px solid var(--border);
  padding-left:9px; margin-bottom:11px; }
/* Links die Fakten (Projekte, Notizen & Verlauf), rechts ein schmaleres
   Seitenpanel (Stammdaten, Evaluation) — Vorlage `vorschlag-a-ruhig-
   praezise.html` (lokal, nicht Teil des Repos). Die Vorlage zeigt dieses
   Panel bewusst **randlos**: kein Card-Rahmen/-Radius/eigener Hintergrund
   um "Stammdaten"/"Evaluation" (das gab im echten Rendering exakt den vom
   Team gemeldeten Eindruck "eckig, andere Hintergrundfarbe" — es WAR keine
   Karte, sondern ein Vollflaechen-Panel mit `border-left` statt Umrandung,
   reines Weiss statt des App-Kartentons `#FCFCFE`). `align-items:stretch`
   zieht das Panel auf die Hoehe der laengeren linken Spalte, damit der
   `border-left` durchgehend bis ans Ende reicht. Dasselbe Muster gilt fuer
   jede aehnliche Seitenleiste (aktuell auch `.bm-side` bei Bemerkungen). */
.vd-2 { display:grid; grid-template-columns:minmax(0,1fr) 340px; gap:0; align-items:stretch; }
.vd-side { background:#fff; border-left:1px solid var(--border); padding:24px; display:flex; flex-direction:column; gap:26px; }
@media (max-width:900px) {
  .vd-2 { grid-template-columns:1fr; }
  .vd-side { border-left:0; border-top:1px solid var(--border); padding:20px var(--fx); }
  .vd-head { flex-direction:column; }
  .vd-head-r { align-items:flex-start; }
  .vd-badges, .vd-links { justify-content:flex-start; }
}
@media (max-width:640px) {
  .pstep-lbl { font-size:9px; }
  .ag-it { grid-template-columns:36px 14px minmax(0,1fr); padding:8px 12px; }
  .ag-it + .ag-it::before { left:86px; right:12px; }
  .ag-dt, .ag-rail { grid-row:1 / span 3; }
  .ag-mid { grid-column:3; grid-row:2; }
  .ag-rt { grid-column:3; grid-row:3; justify-content:flex-start; padding-top:4px; }
}
.vd-sek { display:flex; flex-direction:column; gap:12px; }
.vd-sek-kopf { display:flex; justify-content:space-between; align-items:baseline; gap:10px; }
.vd-sek-kopf h2 { margin:0; font-size:13px; font-weight:600; color:#45434F; }
.vd-sek-kopf span { font-size:12px; color:var(--muted); }
.vd-voll-bar { height:4px; background:var(--bg); border-radius:2px; overflow:hidden; }
.vd-voll-bar i { display:block; height:100%; background:var(--pink); border-radius:2px; }
/* Stammdaten-Zeilen: Label links, Wert rechts, Trennlinie statt Kartenrahmen
   je Zeile — generischer Name, damit weitere Detailseiten dieselbe Liste
   nutzen koennen (`.dgrid`/`.di` bleibt fuer die uebrigen Detailseiten
   unveraendert, das ist eine andere, aeltere Zwei-Spalten-Kachel-Optik). */
.kv-list { display:flex; flex-direction:column; }
.kv-row { display:grid; grid-template-columns:130px minmax(0,1fr); gap:12px; align-items:center;
  min-height:34px; border-bottom:1px solid #F3F1EC; font-size:13px; }
.kv-row:last-child { border-bottom:none; }
.kv-l { color:var(--muted); }
.kv-w { font-weight:500; }
.kv-sub { display:block; font-size:12.5px; font-weight:400; color:var(--muted); margin-top:2px; }
.kv-sub b { color:#1C1B22; font-weight:600; }
.vd-erg { border:0; background:none; padding:0; font:inherit; font-size:13px; font-weight:600;
  color:var(--pink); cursor:pointer; }
.vd-erg:hover { text-decoration:underline; }
/* Notizen & Verlauf teilt sich die Karten-Optik mit den Projekt-
   Bemerkungen (`.bm-*`); `.sys` markiert automatische Eintraege
   (Kontakt-/Stufenaenderung) mit einem dezenten Seitenstrich statt Text. */
.bm-z.sys { border-left:3px solid var(--border); }
.bud-num { text-align:right; font-family:"IBM Plex Mono",monospace; white-space:nowrap; }
.bud-alt { color:#B4232A; }
.bud-warn { color:#B4232A; font-size:12px; }
@media (max-width:640px){ .bud-z { grid-template-columns:1fr auto; } .bud-bar { display:none; } }
/* ── Venue-Formular: Kontakte mit Suche (Teamwunsch 20.10.2026) ── Liste in zwei Spalten über die volle Breite, gefiltert wird nur durch
   Ein-/Ausblenden (`hidden`, daher die [hidden]-Regeln: .vf-k und .vf-kleer setzen selbst display). */
.vf-kn { font-weight:400; color:var(--muted); text-transform:none; letter-spacing:0; }
.vf-ksuche { display:flex; align-items:center; gap:14px; margin-bottom:8px; }
.vf-ksuche input[type="search"] { flex:1; min-width:0; }
.frm-row label.vf-nur { display:inline-flex; align-items:center; gap:6px; margin:0; font-size:12.5px; font-weight:500; color:#45434F;
  text-transform:none; letter-spacing:0; white-space:nowrap; cursor:pointer; }
.vf-kliste { display:grid; grid-template-columns:repeat(3, 1fr); gap:0 10px; max-height:200px; overflow-y:auto; padding:6px;
  border:1px solid var(--border); border-radius:8px; background:#fff; }
.frm-row label.vf-k { display:flex; align-items:center; gap:8px; min-width:0; margin:0; padding:4px 8px; border-radius:6px;
  font-size:13px; font-weight:400; color:#1C1B22; text-transform:none; letter-spacing:0; cursor:pointer; }
.frm-row label.vf-k:hover { background:#F3F1EC; }
.frm-row label.vf-k:has(input:checked) { background:#EEF0FB; font-weight:600; }
.frm-row label.vf-k span { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.frm-row .vf-k input, .frm-row .vf-nur input { width:auto; flex:none; padding:0; margin:0; border:0; }
.frm-row label.vf-k[hidden] { display:none; }
.vf-kleer { padding:12px; font-size:13px; color:var(--muted); text-align:center; }
.vf-kleer[hidden] { display:none; }
@media (max-width:780px) { .vf-kliste { grid-template-columns:1fr 1fr; } }
@media (max-width:520px) { .vf-kliste { grid-template-columns:1fr; } }
/* Formular kompakt (26.10.2026): engere Abstände und flachere Felder; das Fenster ist breit (modal-breit), die Felder stehen in .frm-2/.frm-3 */
.vf-form .frm-row { margin-bottom:9px; }
.vf-form .frm-row label { margin-bottom:3px; }
.vf-form .frm-row input, .vf-form .frm-row textarea { padding:7px 10px; font-size:13.5px; }
.vf-form .frm-row textarea { min-height:46px; }
.vf-form .frm-row select { padding:7px 32px 7px 10px; font-size:13.5px; }
.vf-form .frm-row .vf-k input, .vf-form .frm-row .vf-nur input { padding:0; }