/* ── Kasino-Übersicht: Gerichtzeilen (ab 15.3) ─────────────────────────────
       Ersetzt die frühere Karte-je-Gericht (.dish-row2/.dish-head2/.dcount/.wish2), die im
       Betrieb zu unruhig war: pro Gericht stapelten sich Kopfbalken, Namenszeile, Zähler-
       Widget, Wunsch-Überschrift und Preiszeile. Jetzt EINE Zeile je Gericht — links die
       offene Anzahl, Mitte Gericht + Besteller-Chips, rechts die Fertig-Bedienung. */
    .ko-box { border: 1px solid var(--line); border-radius: 8px; overflow: hidden; background: var(--card); margin-bottom: 10px; }
    .ko-part { font-size: 9.5px; font-weight: 800; letter-spacing: .2em; text-transform: uppercase; color: var(--gold-d); background: var(--card-2); border-bottom: 1px solid var(--line); padding: 7px 12px; }
    .ko-part.drinks { color: var(--moss); }
    .ko-row { display: flex; align-items: center; gap: 11px; padding: 10px 12px; border-bottom: 1px solid var(--line-soft); }
    .ko-row:last-child { border-bottom: 0; }
    .ko-row.wish { background: rgba(179,146,77,.06); }
    .ko-row.done { opacity: .55; }
    .ko-row.done .ko-name { text-decoration: line-through; }
    .ko-cnt { flex: none; min-width: 44px; height: 36px; display: flex; align-items: center; justify-content: center; background: var(--pine-2); color: var(--ivory); font-weight: 800; font-size: 15px; border-radius: 7px; font-variant-numeric: tabular-nums; }
    .ko-row.wish .ko-cnt { background: var(--cognac); }
    .ko-row.done .ko-cnt { background: #5f7d4e; }
    .ko-mid { flex: 1; min-width: 0; }
    .ko-name { display: block; font-family: var(--font-display); font-size: 1.15rem; font-weight: 600; color: var(--ink); line-height: 1.22; }
    .ko-var { font-size: .82em; color: var(--gold-d); font-style: italic; }
    .ko-chips { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 4px; }
    .ko-chip { font-size: 11px; color: #5e4a1c; background: var(--gold-pale); border: 1px solid #e0d3ad; border-radius: 999px; padding: 2px 9px; white-space: nowrap; }
    .ko-wtxt { display: block; font-size: 12.5px; color: var(--cognac-t); font-style: italic; margin-top: 4px; }
    /* Sonderwunsch: die Mitte ist ein Knopf und springt zum Einzeleingang (Telefonnummer!).
       Der Fertig-Schalter steht bewusst getrennt rechts — sonst vertippt man sich im Betrieb. */
    .ko-jump { text-align: left; background: none; border: 0; padding: 0; font-family: var(--font-ui); cursor: pointer; -webkit-tap-highlight-color: rgba(179,146,77,.25); }
    .ko-jump .ko-chip.who { background: #fff; border-color: var(--gold); color: var(--gold-d); font-weight: 700; display: inline-flex; align-items: center; gap: 5px; }
    .ko-arr { font-size: 13px; line-height: 1; }
    .ko-jump:hover .ko-chip.who { background: var(--gold-pale); }
    /* Preisspalte — nur in der Bestellübersicht/Verwaltung, das Kasino zeigt bewusst keine Preise */
    .ko-price { flex: none; font-size: 12px; color: var(--ink-soft); font-variant-numeric: tabular-nums; text-align: right; white-space: nowrap; }
    .ko-sum { color: var(--muted); }
    .ko-step { flex: none; display: flex; align-items: center; gap: 6px; }
    .ko-sb { width: 34px; height: 34px; border: 1px solid var(--line); background: #fff; border-radius: 7px; font-size: 17px; line-height: 1; color: var(--ink); cursor: pointer; touch-action: manipulation; display: inline-flex; align-items: center; justify-content: center; }
    .ko-sb:hover:not(:disabled) { border-color: var(--gold); background: var(--gold-pale); }
    .ko-sb:disabled { opacity: .3; cursor: default; }
    .ko-num { font-size: 12.5px; color: var(--ink-soft); font-variant-numeric: tabular-nums; min-width: 30px; text-align: center; }
    .ko-tog { flex: none; border: 1px solid var(--line); background: #fff; border-radius: 7px; padding: 10px 15px; font-size: 10px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; color: var(--ink-soft); cursor: pointer; white-space: nowrap; touch-action: manipulation; }
    .ko-row.wish.done .ko-tog { background: var(--moss); color: #fff; border-color: var(--moss); }
    /* Reservierung OHNE Tischzuweisung — dezent, aber nicht zu übersehen (ab 15.3) */
    .kr-table.none { color: var(--muted); background: var(--paper-deep); border: 1px dashed var(--line); font-weight: 600; }
    /* Ziel des Sonderwunsch-Sprungs kurz hervorheben */
    .entry.flash { animation: entryFlash 1.7s ease-out; }
    @keyframes entryFlash { 0% { box-shadow: 0 0 0 3px rgba(179,146,77,.65) } 70% { box-shadow: 0 0 0 3px rgba(179,146,77,.3) } 100% { box-shadow: 0 0 0 3px rgba(179,146,77,0) } }
    /* ── Einzeleingang mit Sonderwunsch: gleicher warmer Ton wie die Wunschzeile oben (15.4) ── */
    .entry.wish { background: rgba(179,146,77,.06); border-color: #e0cfa0; }
    .entry.wish .entry-head { box-shadow: inset 3px 0 0 var(--cognac-2); }
    .entry-wishtag { flex: none; font-size: 9.5px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; color: var(--cognac); background: var(--cognac-pale); border-radius: 999px; padding: 2px 8px; }
    /* ── Fertige Reservierungen (15.4): ans Ende, aber VOLL LESBAR ────────────────
       Bewusst weder ausgegraut noch durchgestrichen: das Essen ist fertig, die Gäste kommen
       aber erst — dann muss „FmZg — welcher Tisch?" im vollen Kasino sofort lesbar sein.
       Dass die Reservierung fertig ist, sagen Position, grüne Akzentkante und der ✓-Chip. */
    .kr.fin .kr-head { background: var(--paper-deep); box-shadow: inset 3px 0 0 #3f7d4f; }
    /* Ab 16.3 ein Aufklapper statt eines Trenners — Standard zu (wie „Fertige" in der Küche).
       Bewusst in der Form der beiden anderen Abschnittsbalken: als dünne Linie sah man ihm
       nicht an, dass er anzutippen ist, und am Tablet war er ein zu kleines Ziel. */
    .res-fin-div { display: flex; align-items: center; gap: 11px; width: 100%; text-align: left;
      min-height: 44px; padding: 9px 14px; margin: 22px 0 11px; border-radius: 7px;
      background: #eef4ec; border: 1px solid #cfe0d2; cursor: pointer;
      font-size: 11px; font-weight: 800; letter-spacing: .2em; text-transform: uppercase; color: #35664a; }
    .res-fin-div:hover { background: #e6efe4; border-color: #b9d3bf; }
    .rf-caret { flex: none; font-size: 13px; letter-spacing: 0; transition: transform .15s; }
    .res-fin-div.open .rf-caret { transform: rotate(90deg); }
    .rf-title { flex: none; }
    .rf-count { margin-left: auto; flex: none; font-size: 11.5px; font-weight: 700; letter-spacing: .04em;
      color: #fff; background: #4d7f5c; border-radius: 999px; padding: 3px 11px; }
    /* Tisch-Plakette in der rechten Liste (ab 16.3) */
    .ka-list-body .kr-table { align-self: flex-start; margin-top: 3px; }
    /* Reservierung war fertig und hat eine Nachbestellung bekommen */
    .kr-reopen { flex: none; font-size: 10px; font-weight: 800; letter-spacing: .04em; color: #fff; background: var(--cognac-2); border-radius: 999px; padding: 3px 9px; }
    .ka-list-row.fin { border-color: #bfd8c5; background: #f5f9f4; }
    .ka-list-row.fin .ka-list-n { color: #3f7d4f; }
    /* ── Halte-Bestätigung (15.4) ──────────────────────────────────────────────
       Ein einfaches confirm() wird im Betrieb reflexhaft weggeklickt. Der Knopf muss
       gedrückt GEHALTEN werden — das kann nicht versehentlich und nicht nebenbei passieren. */
    /* Füllung in Gold, Schrift durchgehend tannengrün (ab 15.5): vorher war die Schrift weiß und
       damit auf dem noch weißen Teil des Knopfes unsichtbar, bis der Balken sie eingeholt hatte.
       Das Rot als Warnsignal trägt weiterhin die Karte drumherum (Warnzeile + Spalte „Wird gelöscht"). */
    .hold-btn { position: relative; overflow: hidden; display: block; width: 100%; max-width: 340px; margin: 0 auto; padding: 17px 20px; border: 2px solid var(--gold); border-radius: 8px; background: #fff; color: var(--pine); font-family: var(--font-ui); font-size: 12px; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; cursor: pointer; user-select: none; -webkit-user-select: none; touch-action: none; -webkit-tap-highlight-color: transparent; }
    .hold-btn .hold-fill { position: absolute; left: 0; top: 0; bottom: 0; width: 0; background: var(--gold); }
    .hold-btn .hold-lbl { position: relative; }
    .hold-btn.holding { border-color: var(--gold-d); }
    .hold-btn:disabled { opacity: .5; cursor: default; }
    /* ── Reiter „Tag abschließen" (15.4) ── */
    .eod-page { max-width: 620px; }
    .eod-card { background: var(--card); border: 1px solid var(--line); border-radius: 10px; padding: 26px 24px 28px; box-shadow: var(--sh-sm); text-align: center; }
    .eod-card h2 { font-family: var(--font-display); font-size: 1.8rem; font-weight: 600; color: var(--ink); margin-bottom: 6px; }
    .eod-lead { font-size: 13.5px; color: var(--ink-soft); line-height: 1.6; max-width: 440px; margin: 0 auto 18px; }
    .eod-cols { display: flex; gap: 10px; text-align: left; margin-bottom: 18px; flex-wrap: wrap; }
    .eod-col { flex: 1 1 200px; border: 1px solid var(--line-soft); border-radius: 8px; padding: 12px 14px; background: var(--card-2); }
    .eod-col.gone { border-color: #e0c3bc; background: #faf1ee; }
    .eod-col h4 { font-size: 9.5px; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; margin-bottom: 8px; }
    .eod-col.gone h4 { color: var(--red); }
    .eod-col.stays h4 { color: var(--moss); }
    .eod-col ul { list-style: none; }
    .eod-col li { font-size: 12.5px; color: var(--ink-soft); padding: 3px 0 3px 15px; position: relative; line-height: 1.45; }
    .eod-col li::before { position: absolute; left: 0; top: 3px; }
    .eod-col.gone li::before { content: '×'; color: var(--red); font-weight: 800; }
    .eod-col.stays li::before { content: '✓'; color: var(--moss); font-weight: 800; }
    .eod-col b { color: var(--ink); font-weight: 700; }
    .eod-warn { font-size: 12.5px; color: var(--red); font-weight: 700; margin-bottom: 16px; }
    .eod-hint { font-size: 11.5px; color: var(--muted); font-style: italic; margin-top: 12px; }
    .eod-empty { font-size: 13px; color: var(--muted); font-style: italic; padding: 6px 0 14px; }
    /* ── Tagesstatistik (ab 16.3) — steht VOR „wird gelöscht", weil sie danach weg ist ── */
    .eod-stats { border: 1px solid var(--line-soft); border-radius: 8px; background: var(--card-2); padding: 14px 14px 12px; margin-bottom: 18px; }
    .eod-stats h4 { font-size: 9.5px; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; color: var(--gold-d); margin-bottom: 10px; }
    .eod-statgrid { display: grid; grid-template-columns: repeat(auto-fit, minmax(96px, 1fr)); gap: 8px; }
    .eod-stat { text-align: center; background: var(--card); border: 1px solid var(--line-soft); border-radius: 6px; padding: 9px 4px; }
    .eod-stat-n { display: block; font-family: var(--font-display); font-size: 1.6rem; font-weight: 700; color: var(--gold-d); line-height: 1; }
    .eod-stat-l { display: block; font-size: 9px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--muted); margin-top: 5px; }
    .eod-stat-s { display: block; font-size: 9.5px; font-weight: 700; color: var(--ink-soft); margin-top: 3px; }
    .eod-tops { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 12px; text-align: left; }
    .eod-top { flex: 1 1 190px; background: var(--card); border: 1px solid var(--line-soft); border-radius: 6px; padding: 10px 12px; }
    .eod-top h5 { font-size: 9px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; color: var(--muted); margin-bottom: 6px; }
    .eod-top-row { display: flex; align-items: baseline; gap: 7px; font-size: 12.5px; padding: 2px 0; }
    .eod-top-n { font-family: var(--font-display); font-weight: 700; color: var(--gold-d); flex: none; }
    .eod-top-name { color: var(--ink); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
    .eod-top-q { margin-left: auto; font-weight: 700; color: var(--ink-soft); flex: none; font-variant-numeric: tabular-nums; }
    .eod-top-empty { font-size: 12px; color: var(--muted); font-style: italic; }
    .eod-stats-hint { font-size: 11px; color: var(--muted); font-style: italic; margin-top: 10px; text-align: left; line-height: 1.45; }
    /* Absagen (ab 16.3) — erscheint nur, wenn heute wirklich etwas gelöscht wurde */
    .eod-cancel { display: flex; align-items: baseline; gap: 9px; flex-wrap: wrap; text-align: left;
      margin-top: 10px; padding: 8px 12px; border-radius: 6px;
      background: var(--warn-fill, #f7ece6); border: 1px solid #e0c3bc; }
    .eod-cancel-t { flex: none; font-size: 9px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; color: var(--red); }
    .eod-cancel-v { font-size: 12.5px; font-weight: 700; color: var(--ink); }
    .eod-cancel-n { flex-basis: 100%; font-size: 11px; color: var(--ink-soft); font-style: italic; }
    /* ── Reservierung bearbeiten (15.4): Speichern · Abbrechen · Löschen oben im Formular ── */
    .res-edit-actions { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-top: 12px; }
    .res-edit-del { margin-left: auto; width: auto; min-height: 0; padding: 9px 16px; }
    .kr-foot-actions { justify-content: center; }
    .order-edit { padding: 4px 2px; }
    .oe-title { font-family: var(--font-display); font-weight: 600; font-size: 1.05rem; margin-bottom: 8px; }
    .oe-item { border: 1px solid var(--line-soft); border-radius: 7px; padding: 8px 10px; margin-bottom: 8px; }
    .oe-name { display: flex; align-items: center; justify-content: space-between; font-weight: 600; font-size: 13.5px; margin-bottom: 6px; }
    .oe-fields { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
    .oe-fields label { font-size: 11px; color: var(--muted); text-transform: uppercase; letter-spacing: .06em; }
    .oe-fields input[type=text] { flex: 1; min-width: 130px; }
    .oe-actions { display: flex; gap: 8px; margin-top: 4px; }
    .cancel-btn {
      background: none;
      border: 1px solid var(--line);
      border-radius: 3px;
      padding: 6px 12px;
      font-size: 9.5px; font-weight: 800;
      letter-spacing: .16em; text-transform: uppercase;
      color: var(--ink-soft);
      cursor: pointer;
      transition: all .18s;
      touch-action: manipulation;
    }
    .cancel-btn:hover { border-color: rgba(162,58,46,.5); color: var(--red); }

    .toast-host { position: fixed; top: 14px; left: 50%; transform: translateX(-50%); z-index: 95; max-width: 92vw; }
    .toast {
      display: flex; align-items: center; gap: 10px;
      background: var(--pine);
      color: var(--ivory);
      border: 1px solid rgba(214,184,120,.5);
      border-radius: 3px;
      padding: 11px 18px;
      font-size: 12px; font-weight: 600;
      letter-spacing: .04em;
      margin-bottom: 6px;
      box-shadow: var(--sh-lg);
      animation: toastIn .25s ease-out both;
    }
    .toast.toast-out { animation: toastOut .3s ease-in both; }
    .toast.toast-success { border-color: rgba(141,182,154,.6); }
    @keyframes toastIn { from { opacity: 0; transform: translateY(-8px); } to { opacity: 1; transform: translateY(0); } }
    @keyframes toastOut { from { opacity: 1; } to { opacity: 0; transform: translateY(-8px); } }

    /* ══════════════════════════════════════════════════════════
       INFO-SEITE & LEGENDE
    ══════════════════════════════════════════════════════════ */
    .info-grid { display: grid; grid-template-columns: 1fr; gap: 16px; max-width: 760px; margin: 0 auto; }
    /* Die Aufzählung der Veranstaltungen (ab 16.2). Zwei Spalten, weil die Liste neun
       Einträge hat und einspaltig den halben Info-Block füllt; unter 620 px fällt sie
       automatisch auf eine Spalte zurück — am Handy ist das der Normalfall.
       Statt eines Aufzählungspunktes ein kurzer goldener Strich: ◆ ✦ ★ sind auf der
       Karte bereits als Tagesangebot / Wochengericht / Mitgliederpreis vergeben, ein
       viertes Zeichen würde diese drei Signale verwässern.
       WICHTIG — alle Maße sind GANZZAHLIG (Zeilenhöhe 24 px statt 1.5×15 = 22,5 px):
       bei krummer Zeilenhöhe liegt jede zweite Zeile auf einem halben Bildschirmpunkt,
       und der 1 px feine Strich wird dort weichgezeichnet — er wirkt dann abwechselnd
       dünner und dicker. Beim Ändern der Schriftgröße die Zeilenhöhe mit anpassen. */
    .ev-list { list-style: none; padding: 0; margin: 12px 0 2px; columns: 2; column-gap: 30px; }
    .ev-list li {
      position: relative;
      padding: 4px 0 4px 18px;
      break-inside: avoid;
      font-family: var(--font-display);
      font-size: 15px; line-height: 24px;
      color: var(--ink-soft);
    }
    .ev-list li::before {
      content: '';
      position: absolute; left: 0; top: 15px;
      width: 10px; height: 1px;
      background: var(--gold-d);
    }
    @media (max-width: 620px) { .ev-list { columns: 1; } }
    .contact-box {
      margin-top: 14px;
      padding: 12px 16px;
      background: var(--card-2);
      border-left: 3px solid var(--gold);
      border-radius: 0 4px 4px 0;
    }
    .contact-box strong {
      display: block;
      font-family: var(--font-ui);
      font-size: 9.5px; font-weight: 800;
      letter-spacing: .22em; text-transform: uppercase;
      color: var(--gold-d);
      margin-bottom: 4px;
    }
    .contact-box, .contact-box a {
      font-family: var(--font-display);
      font-size: 1.1rem; font-weight: 600;
      color: var(--ink);
      text-decoration: none;
    }
    .contact-box a:hover { color: var(--gold-d); }

    details.acc {
      background: var(--card);
      border: 1px solid var(--line);
      border-top: 3px solid var(--gold);
      border-radius: 4px;
      box-shadow: var(--sh-sm);
      overflow: hidden;
    }
    details.acc > summary {
      padding: 17px 22px;
      cursor: pointer;
      list-style: none;
      display: flex; justify-content: space-between; align-items: center;
      font-family: var(--font-display);
      font-size: 1.15rem; font-weight: 600;
      letter-spacing: .04em;
    }
    details.acc > summary::-webkit-details-marker { display: none; }
    details.acc > summary::after { content: '+'; font-family: var(--font-ui); font-size: 20px; font-weight: 300; color: var(--gold-d); transition: transform .2s; }
    details.acc[open] > summary::after { transform: rotate(45deg); }
    details.acc > .acc-body { padding: 0 22px 20px; }
    details.acc > .acc-body p { font-family: var(--font-display); font-size: 14.5px; line-height: 1.6; color: var(--ink-soft); }
    .legend-title {
      font-size: 10px; font-weight: 800;
      letter-spacing: .22em; text-transform: uppercase;
      color: var(--gold-d);
      margin: 18px 0 8px;
    }
    .legend-grid { display: grid; grid-template-columns: auto 1fr; gap: 6px 12px; font-size: 13.5px; color: var(--ink-soft); align-items: center; }
    @media (min-width: 700px) { .legend-grid.cols-2 { grid-template-columns: auto 1fr auto 1fr; } }
    .legend-code {
      display: inline-flex; align-items: center; justify-content: center;
      min-width: 25px; height: 21px;
      padding: 0 6px;
      background: var(--pine);
      color: var(--gold-l);
      border-radius: 3px;
      font-size: 10.5px; font-weight: 800;
      letter-spacing: .04em;
    }

    /* ══════════════════════════════════════════════════════════
       ADMIN-SHELL  (Desktop: Seitenleiste · Mobil: Band oben)
    ══════════════════════════════════════════════════════════ */
    .admin-shell { max-width: 1140px; margin: 0 auto; padding: 0 0 130px; }
    .admin-rail {
      position: sticky; top: 0; z-index: 40;
      background: rgba(29,42,34,.97);
      backdrop-filter: blur(8px);
      border-bottom: 1px solid rgba(214,184,120,.4);
    }
    .admin-content { padding: 26px 20px 0; max-width: 780px; margin: 0 auto; }
    @media (min-width: 1020px) {
      .admin-shell {
        display: grid;
        grid-template-columns: 236px minmax(0, 1fr);
        gap: 30px;
        padding: 28px 28px 130px;
        align-items: start;
      }
      .admin-rail {
        position: sticky; top: 22px;
        background: linear-gradient(180deg, var(--pine-2), var(--pine));
        border: 1px solid rgba(214,184,120,.45);
        border-radius: 6px;
        padding: 12px 10px;
        box-shadow: var(--sh);
      }
      .admin-rail .nav-scroll { flex-direction: column; gap: 3px; padding: 0; overflow: visible; }
      .admin-rail .nav-link {
        text-align: left;
        padding: 12px 14px;
        border-bottom: none;
        border-left: 2px solid transparent;
        border-radius: 3px;
      }
      .admin-rail .nav-link.active { border-left-color: var(--gold-l); background: rgba(255,255,255,.06); }
      .admin-content { padding: 0; margin: 0; max-width: none; }
    }
    .rail-head {
      display: none;
    }
    @media (min-width: 1020px) {
      .rail-head {
        display: block;
        padding: 10px 14px 14px;
        margin-bottom: 8px;
        border-bottom: 1px solid rgba(214,184,120,.3);
        font-size: 9.5px; font-weight: 800;
        letter-spacing: .26em; text-transform: uppercase;
        color: var(--gold-l);
      }
    }