/* Filialkasse (GaiGo.Kasse) — Tablet im Querformat, Bedienung mit dem Finger: große Flächen, klare Kontraste. */
:root {
    --kasse-ink: #12203a;
    --kasse-muted: rgba(18, 32, 58, 0.62);
    --kasse-primary: #1f5eff;
    --kasse-ok: #2e7d32;
    --kasse-warn: #b26a00;
    --kasse-error: #c62828;
    --kasse-bg: #f4f6fa;
}

* { box-sizing: border-box; }

html, body {
    margin: 0;
    height: 100%;
    font-family: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
    font-size: 18px;
    color: var(--kasse-ink);
    background: var(--kasse-bg);
    -webkit-tap-highlight-color: transparent;
}

.kasse-boot { padding: 48px 24px; text-align: center; color: var(--kasse-muted); }

.kasse-shell { min-height: 100%; display: flex; flex-direction: column; }

.kasse-head {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px 20px;
    background: var(--kasse-ink);
    color: #fff;
}
.kasse-logo { width: 32px; height: 32px; border-radius: 8px; }
.kasse-brand { font-weight: 700; }
.kasse-where { margin-left: auto; font-weight: 600; }
.kasse-offline {
    margin-left: 12px;
    padding: 2px 10px;
    border-radius: 999px;
    background: var(--kasse-warn);
    font-size: 14px;
}

.kasse-main { flex: 1; display: flex; align-items: flex-start; justify-content: center; padding: 32px 16px; }

.kasse-card {
    width: 100%;
    max-width: 640px;
    padding: 28px 28px 24px;
    border-radius: 16px;
    background: #fff;
    box-shadow: 0 1px 3px rgba(18, 32, 58, 0.12);
}
.kasse-card h1 { margin: 0 0 8px; font-size: 28px; }
.kasse-card p { line-height: 1.5; }
.kasse-card--ok { border-top: 6px solid var(--kasse-ok); }
.kasse-card--warn { border-top: 6px solid var(--kasse-warn); }
.kasse-sub { margin-top: 0; color: var(--kasse-muted); font-size: 20px; }
.kasse-note { padding: 10px 14px; border-radius: 10px; background: rgba(178, 106, 0, 0.1); color: var(--kasse-warn); }
.kasse-error { color: var(--kasse-error); font-weight: 600; }

.kasse-button {
    display: inline-block;
    min-height: 56px;
    padding: 14px 28px;
    border: 0;
    border-radius: 12px;
    background: var(--kasse-primary);
    color: #fff;
    font: inherit;
    font-weight: 600;
    text-decoration: none;
    cursor: pointer;
}
.kasse-button:disabled { opacity: 0.45; cursor: default; }
.kasse-button--secondary { background: #e3e8f2; color: var(--kasse-ink); }

.kasse-video { display: block; width: 100%; max-height: 360px; margin: 8px 0 12px; border-radius: 12px; background: #000; object-fit: cover; }
.kasse-hidden { display: none; }

.kasse-code { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin-top: 24px; }
.kasse-code label { width: 100%; color: var(--kasse-muted); font-size: 15px; }
.kasse-code input {
    flex: 1;
    min-width: 0;
    min-height: 56px;
    padding: 0 14px;
    border: 1px solid rgba(18, 32, 58, 0.25);
    border-radius: 12px;
    font: inherit;
    font-family: ui-monospace, monospace;
}

#blazor-error-ui {
    display: none;
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    padding: 12px 20px;
    background: #fff3cd;
    box-shadow: 0 -1px 4px rgba(0, 0, 0, 0.2);
    z-index: 1000;
}
#blazor-error-ui .reload { margin-left: 12px; }

/* Kassierer-Anmeldung (#74): Kacheln und Ziffernblock, für den Finger. */
.kasse-cashier {
    margin-left: 12px;
    padding: 4px 12px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.16);
    font-weight: 600;
    white-space: nowrap;
}
.kasse-signin { max-width: 900px; }
.kasse-tiles {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
    gap: 14px;
    margin: 16px 0;
}
.kasse-tile {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    min-height: 140px;
    padding: 18px 10px;
    border: 2px solid transparent;
    border-radius: 16px;
    background: #eef2fb;
    color: var(--kasse-ink);
    font: inherit;
    cursor: pointer;
}
.kasse-tile:active { background: #dfe6f7; }
.kasse-tile--active { border-color: var(--kasse-ok); }
.kasse-tile-initials {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 56px;
    height: 56px;
    border-radius: 50%;
    background: var(--kasse-primary);
    color: #fff;
    font-size: 22px;
    font-weight: 700;
}
.kasse-tile-name { font-weight: 600; text-align: center; }
.kasse-tile-role { font-size: 14px; color: var(--kasse-muted); }

.kasse-pin { display: flex; flex-direction: column; align-items: center; text-align: center; }
.kasse-pin-dots { display: flex; gap: 14px; margin: 8px 0 16px; min-height: 22px; }
.kasse-pin-dot { width: 18px; height: 18px; border: 2px solid var(--kasse-ink); border-radius: 50%; }
.kasse-pin-dot--set { background: var(--kasse-ink); }
.kasse-keypad {
    display: grid;
    grid-template-columns: repeat(3, 96px);
    gap: 12px;
    margin-bottom: 16px;
}
.kasse-key {
    height: 76px;
    border: 0;
    border-radius: 14px;
    background: #eef2fb;
    color: var(--kasse-ink);
    font: inherit;
    font-size: 28px;
    font-weight: 600;
    cursor: pointer;
}
.kasse-key:active { background: #dfe6f7; }
.kasse-key:disabled { opacity: 0.45; cursor: default; }
.kasse-key--muted { font-size: 24px; }
.kasse-key--ok { background: var(--kasse-primary); color: #fff; font-size: 22px; }
.kasse-wide { min-width: 312px; }
.kasse-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 8px; }

/* Verkauf am Kassenplatz (#75) — Components/SaleScreen.razor, CashPayment.razor. Querformat: Artikel links,
   Warenkorb rechts; Hochformat: untereinander. */
.kasse-sale-wrap { width: 100%; max-width: 1400px; display: flex; flex-direction: column; gap: 12px; }
.kasse-toolbar { display: flex; flex-wrap: wrap; align-items: center; gap: 18px; font-size: 16px; color: var(--kasse-muted); }
.kasse-toolbar b { color: var(--kasse-ink); }
.kasse-link {
    min-height: 44px;
    padding: 0 6px;
    border: 0;
    background: none;
    color: var(--kasse-primary);
    font: inherit;
    font-weight: 600;
    cursor: pointer;
}
.kasse-link:disabled { opacity: 0.45; cursor: default; }
.kasse-muted { color: var(--kasse-muted); }

.kasse-sale { display: grid; grid-template-columns: minmax(0, 1fr) 420px; gap: 16px; align-items: start; }
.kasse-sale-products, .kasse-sale-cart {
    padding: 16px;
    border-radius: 16px;
    background: #fff;
    box-shadow: 0 1px 3px rgba(18, 32, 58, 0.12);
}
.kasse-sale-cart { position: sticky; top: 16px; display: flex; flex-direction: column; }

.kasse-search { position: relative; margin-bottom: 14px; }
.kasse-search input {
    width: 100%;
    min-height: 56px;
    padding: 0 52px 0 16px;
    border: 1px solid rgba(18, 32, 58, 0.25);
    border-radius: 12px;
    font: inherit;
}
.kasse-search-clear {
    position: absolute;
    top: 6px;
    right: 6px;
    width: 44px;
    height: 44px;
    border: 0;
    border-radius: 10px;
    background: #eef2fb;
    font-size: 24px;
    cursor: pointer;
}

.kasse-products {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
    gap: 10px;
    max-height: calc(100vh - 230px);
    overflow-y: auto;
}
.kasse-product {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 8px;
    min-height: 96px;
    padding: 12px;
    border: 0;
    border-radius: 14px;
    background: #eef2fb;
    color: var(--kasse-ink);
    font: inherit;
    text-align: left;
    cursor: pointer;
}
.kasse-product:active { background: #dfe6f7; }
.kasse-product:disabled { opacity: 0.45; cursor: default; }
.kasse-product-name { font-weight: 600; line-height: 1.25; overflow-wrap: anywhere; }
.kasse-product-meta { display: flex; justify-content: space-between; align-items: baseline; gap: 6px; font-size: 15px; }
.kasse-product-no { color: var(--kasse-muted); }
.kasse-product-price { margin-left: auto; font-weight: 700; }

/* Schnelltasten (#77) — Components/QuickKeyPad.razor: Seiten-Leiste (Favoriten, Ordner), darunter die Kacheln. */
/* contain: die Leiste scrollt quer, statt die Spalte (und im Hochformat die Seite) zu verbreitern. */
.kasse-qk { display: flex; flex-direction: column; gap: 12px; contain: inline-size; }
.kasse-qk-tabs { display: flex; gap: 8px; overflow-x: auto; padding-bottom: 2px; scrollbar-width: none; }
.kasse-qk-tabs::-webkit-scrollbar { display: none; }
.kasse-qk-tab {
    flex: none;
    min-height: 52px;
    padding: 0 18px;
    border: 2px solid #d6dded;
    border-radius: 999px;
    background: #fff;
    color: var(--kasse-ink);
    font: inherit;
    font-weight: 600;
    white-space: nowrap;
    cursor: pointer;
}
.kasse-qk-tab--active { border-color: var(--kasse-primary); background: var(--kasse-primary); color: #fff; }
.kasse-qk-keys { max-height: calc(100vh - 300px); }
@media (max-width: 960px) {
    .kasse-qk-keys { max-height: 40vh; }
}

.kasse-cart-head { display: flex; align-items: center; justify-content: space-between; }
.kasse-cart-head h2 { margin: 0 0 8px; font-size: 22px; }
.kasse-lines { margin: 0; padding: 0; list-style: none; max-height: calc(100vh - 380px); overflow-y: auto; }
.kasse-line {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto 84px;
    align-items: center;
    gap: 8px;
    padding: 8px 0;
    border-bottom: 1px solid rgba(18, 32, 58, 0.08);
}
.kasse-line-text { display: flex; flex-direction: column; min-width: 0; }
.kasse-line-name { font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.kasse-line-unit { font-size: 14px; color: var(--kasse-muted); }
.kasse-line-total { text-align: right; font-weight: 600; font-variant-numeric: tabular-nums; }
.kasse-qty { display: flex; align-items: center; gap: 4px; }
.kasse-qty-btn {
    width: 48px;
    height: 48px;
    border: 0;
    border-radius: 12px;
    background: #eef2fb;
    color: var(--kasse-ink);
    font-size: 26px;
    font-weight: 700;
    cursor: pointer;
}
.kasse-qty-btn:active { background: #dfe6f7; }
.kasse-qty-value { min-width: 36px; text-align: center; font-weight: 700; font-variant-numeric: tabular-nums; }

.kasse-cart-foot { margin-top: 12px; display: flex; flex-direction: column; gap: 10px; }
.kasse-total { display: flex; justify-content: space-between; align-items: baseline; font-size: 22px; }
.kasse-total b { font-size: 30px; font-variant-numeric: tabular-nums; }
.kasse-pay { width: 100%; min-height: 68px; font-size: 22px; background: var(--kasse-ok); }

.kasse-sums { display: grid; grid-template-columns: auto 1fr; gap: 6px 16px; margin: 8px 0 12px; font-size: 20px; }
.kasse-sums dt { color: var(--kasse-muted); }
.kasse-sums dd { margin: 0; text-align: right; font-weight: 700; font-variant-numeric: tabular-nums; }
.kasse-sums--big { font-size: 24px; }
.kasse-sums .kasse-change { color: var(--kasse-ok); font-size: 1.15em; }
.kasse-sums .kasse-change--low { color: var(--kasse-error); }

.kasse-quick { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; margin-bottom: 10px; }
.kasse-quick-btn {
    min-height: 52px;
    border: 2px solid var(--kasse-primary);
    border-radius: 12px;
    background: #fff;
    color: var(--kasse-primary);
    font: inherit;
    font-weight: 700;
    cursor: pointer;
}
.kasse-keypad--pay { grid-template-columns: repeat(3, 1fr); margin: 0 0 12px; }
.kasse-keypad--pay .kasse-key { height: 64px; }

.kasse-done { display: flex; flex-direction: column; align-items: stretch; text-align: center; }
.kasse-done-title { margin: 8px 0 0; font-size: 28px; font-weight: 700; color: var(--kasse-ok); }
.kasse-done-number { margin: 4px 0 8px; font-size: 22px; }
.kasse-done .kasse-sums { text-align: left; }
.kasse-done .kasse-wide { min-width: 0; width: 100%; }

/* Bon-Druck und Vorschau (#76) — Components/SaleScreen.razor; der Bon selbst: _content/GaiGo.Documents.Layout/bon/bon.css */
.kasse-print { display: flex; flex-direction: column; align-items: stretch; gap: 8px; margin: 4px 0 12px; }
.kasse-print p { margin: 0; }
.kasse-print-msg { color: var(--kasse-muted); }
.kasse-print-msg--ok { color: var(--kasse-ok); font-weight: 600; }
.kasse-print .kasse-link { align-self: center; }
.kasse-bon-overlay {
    position: fixed;
    inset: 0;
    z-index: 50;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 16px;
    background: rgba(18, 32, 58, 0.55);
}
.kasse-bon-dialog {
    display: flex;
    flex-direction: column;
    max-height: 100%;
    border-radius: 16px;
    background: var(--kasse-bg);
    box-shadow: 0 12px 40px rgba(0, 0, 0, 0.3);
}
.kasse-bon-head { display: flex; align-items: center; justify-content: space-between; gap: 24px; padding: 12px 16px; }
.kasse-bon-head h2 { margin: 0; font-size: 20px; }
.kasse-bon-paper { overflow: auto; padding: 0 16px 16px; }
.kasse-bon-paper .bon-sheet { margin: 0 auto; box-shadow: 0 1px 4px rgba(0, 0, 0, 0.15); }

@media (max-width: 960px) {
    .kasse-main { padding: 16px; }
    .kasse-sale { grid-template-columns: 1fr; }
    /* Hochformat: Warenkorb bzw. Zahlung oben, Artikel darunter. */
    .kasse-sale-cart { position: static; order: -1; }
    .kasse-products { max-height: 40vh; }
    .kasse-lines { max-height: none; }
}

/* Kundenkarte (#88) — Components/CustomerDesk.razor, CustomerCard.razor, CustomerCardLines.razor. Ebene über dem
   Verkauf (der Warenkorb bleibt stehen); Querformat drei Spalten, Hochformat untereinander. */
.kasse-toolbar-customer { min-height: 48px; padding: 8px 20px; margin-left: auto; }
.kasse-cust {
    position: fixed;
    inset: 0;
    z-index: 50;
    display: flex;
    justify-content: center;
    align-items: flex-start;
    padding: 24px 16px;
    background: rgba(18, 32, 58, 0.35);
    overflow-y: auto;
}
.kasse-cust-panel {
    width: 100%;
    max-width: 1400px;
    padding: 18px 20px 24px;
    border-radius: 16px;
    background: #fff;
    box-shadow: 0 8px 28px rgba(18, 32, 58, 0.25);
}
.kasse-cust-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 12px; }
.kasse-cust-head h2 { margin: 0; font-size: 24px; }
.kasse-cust-close { min-height: 48px; padding: 8px 20px; }
.kasse-cust-search { display: flex; gap: 12px; align-items: flex-start; }
.kasse-cust-search .kasse-search { flex: 1; }
.kasse-cust-hits { margin: 8px 0 0; padding: 0; list-style: none; display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: 10px; }
.kasse-cust-hit {
    display: flex;
    flex-direction: column;
    gap: 4px;
    width: 100%;
    min-height: 72px;
    padding: 12px 14px;
    border: 0;
    border-radius: 14px;
    background: #eef2fb;
    color: var(--kasse-ink);
    font: inherit;
    text-align: left;
    cursor: pointer;
}
.kasse-cust-hit:active { background: #dfe6f7; }
.kasse-cust-hit-name { font-weight: 700; }
.kasse-cust-hit-meta { display: flex; flex-wrap: wrap; gap: 4px 14px; font-size: 15px; color: var(--kasse-muted); }

.kasse-cust-card-head h2 { margin: 0; font-size: 28px; }
.kasse-cust-card-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 16px; margin: 6px 0 14px; color: var(--kasse-muted); font-size: 16px; }
.kasse-cust-cols { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; align-items: start; }
.kasse-cust-col { padding: 14px; border-radius: 14px; background: var(--kasse-bg); }
.kasse-cust-col h3 { margin: 0 0 10px; font-size: 20px; }
.kasse-cust-day { font-weight: 400; color: var(--kasse-muted); }
.kasse-cust-item { margin-bottom: 10px; padding: 10px 12px; border-radius: 12px; background: #fff; }
.kasse-cust-item-head { display: flex; justify-content: space-between; align-items: baseline; gap: 8px; }
.kasse-cust-amount { font-weight: 700; font-variant-numeric: tabular-nums; white-space: nowrap; }
.kasse-cust-sub { margin: 4px 0; font-size: 15px; color: var(--kasse-muted); }
.kasse-cust-badge { display: inline-block; padding: 1px 10px; border-radius: 999px; background: #e3e8f2; color: var(--kasse-ink); font-size: 14px; font-weight: 600; }
.kasse-cust-badge--warn { background: rgba(178, 106, 0, 0.14); color: var(--kasse-warn); }
.kasse-cust-lines { margin: 6px 0 0; padding: 0; list-style: none; font-size: 16px; }
.kasse-cust-lines li { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 8px; padding: 3px 0; }
.kasse-cust-qty { font-variant-numeric: tabular-nums; color: var(--kasse-muted); }
.kasse-cust-line-name { overflow-wrap: anywhere; }
.kasse-cust-line-amount { text-align: right; font-variant-numeric: tabular-nums; }
.kasse-cust-total { margin-top: 4px; font-size: 18px; }
.kasse-cust-total b { font-size: 24px; }

@media (max-width: 960px) {
    .kasse-cust { padding: 12px; }
    .kasse-cust-cols { grid-template-columns: 1fr; }
}
.kasse-cust-discount { display: flex; justify-content: space-between; margin: 2px 0 0; font-size: 16px; color: var(--kasse-muted); font-variant-numeric: tabular-nums; }

/* Artikel mit Preiseingabe (#78) — Components/PriceEntryPad.razor: Ziffernblock als Dialog über dem Verkauf. */
.kasse-price-backdrop {
    position: fixed;
    inset: 0;
    z-index: 60;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 16px;
    background: rgba(18, 32, 58, 0.45);
}
.kasse-price {
    width: 100%;
    max-width: 380px;
    padding: 20px;
    border-radius: 18px;
    background: #fff;
    box-shadow: 0 12px 40px rgba(18, 32, 58, 0.3);
}
.kasse-price-hint { margin: 0; font-size: 15px; color: var(--kasse-muted); }
.kasse-price-name { margin: 2px 0 10px; font-size: 22px; overflow-wrap: anywhere; }
.kasse-price-amount {
    margin-bottom: 12px;
    padding: 10px 14px;
    border-radius: 12px;
    background: var(--kasse-bg);
    font-size: 36px;
    font-weight: 700;
    text-align: right;
    font-variant-numeric: tabular-nums;
}
.kasse-price-amount--empty { color: var(--kasse-muted); }
.kasse-keypad--price { grid-template-columns: repeat(3, 1fr); margin: 0 0 14px; }
.kasse-keypad--price .kasse-key { height: 64px; }
.kasse-price-actions { display: grid; grid-template-columns: 1fr 1.4fr; gap: 10px; }
.kasse-price-actions .kasse-button { min-width: 0; }

/* Eröffnung und Tagesabschluss (#82) — Components/DayOpening.razor, DayClosing.razor, AmountPad.razor */
.kasse-day { max-width: 520px; }
.kasse-day-row { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin: 8px 0; font-size: 18px; color: var(--kasse-muted); }
.kasse-day-row .kasse-link { font-size: 20px; font-weight: 700; }
.kasse-day-warn p { margin: 0 0 8px; }
.kasse-day-warn .kasse-button { margin-top: 4px; }
.kasse-day-dialog { width: min(560px, 100%); overflow: auto; padding-bottom: 16px; }
.kasse-day-dialog > :not(.kasse-bon-head):not(.kasse-bon-paper) { margin-left: 16px; margin-right: 16px; }
.kasse-day-dialog .kasse-tiles { margin-bottom: 12px; }
.kasse-amount-value {
    margin: 8px 0 12px;
    padding: 10px 16px;
    border-radius: 12px;
    background: #fff;
    font-size: 32px;
    font-weight: 700;
    text-align: right;
    font-variant-numeric: tabular-nums;
}

/* Verkauf an Stammkunden (#89) — SaleScreen, CashPayment, CustomerCard: Lieferschein bar oder auf Rechnung */
.kasse-cust-card-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 14px; margin: 0 0 14px; }
.kasse-sale-customer { display: flex; justify-content: space-between; align-items: center; gap: 8px; margin: 0 0 10px; padding: 8px 12px; border-radius: 12px; background: rgba(31, 94, 255, 0.08); font-size: 17px; }
.kasse-sale-customer .kasse-cust-badge { margin-left: 6px; }
.kasse-discount-hint { margin: 2px 0 8px; font-size: 15px; text-align: right; }
.kasse-pay-row { display: flex; gap: 10px; }
.kasse-pay-row .kasse-pay { flex: 1 1 0; min-width: 0; }
.kasse-pay--account { background: var(--kasse-primary); }
.kasse-onaccount-text { margin: 8px 0 12px; font-size: 18px; }
.kasse-done-customer { margin: 2px 0 0; font-size: 20px; font-weight: 600; }
.kasse-pay-customer { margin: 0 0 6px; font-size: 17px; color: var(--kasse-muted); }

/* Belegsuche und Nachdruck (#86) — Components/ReceiptSearch.razor. Ebene wie die Kundenkarte (kasse-cust*). */
.kasse-rcpt-filter { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 10px 12px; margin-bottom: 14px; }
.kasse-rcpt-filter label { display: flex; flex-direction: column; gap: 4px; font-size: 15px; color: var(--kasse-muted); }
.kasse-rcpt-filter input {
    min-height: 48px;
    padding: 6px 12px;
    border: 1px solid #c9d2e3;
    border-radius: 12px;
    font: inherit;
    font-size: 18px;
    color: var(--kasse-ink);
    background: #fff;
}
.kasse-rcpt-filter input[inputmode="decimal"] { width: 130px; }
.kasse-rcpt-number { flex: 1; min-width: 180px; }
.kasse-rcpt-filter .kasse-button { min-height: 48px; padding: 8px 24px; }
.kasse-rcpt-hits { margin: 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 8px; }
.kasse-rcpt-hit {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto auto;
    align-items: center;
    gap: 14px;
    padding: 10px 14px;
    border-radius: 14px;
    background: #eef2fb;
}
.kasse-rcpt-time { font-size: 20px; font-weight: 700; font-variant-numeric: tabular-nums; }
.kasse-rcpt-main { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.kasse-rcpt-no { font-weight: 700; overflow-wrap: anywhere; }
.kasse-rcpt-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 10px; font-size: 15px; color: var(--kasse-muted); }
.kasse-rcpt-amount { font-size: 20px; font-weight: 700; font-variant-numeric: tabular-nums; white-space: nowrap; }
.kasse-rcpt-copy { min-height: 48px; padding: 8px 18px; }
.kasse-rcpt-status { display: flex; align-items: center; gap: 10px; margin-left: auto; font-size: 15px; }
@media (max-width: 700px) {
    .kasse-rcpt-hit { grid-template-columns: auto minmax(0, 1fr) auto; }
    .kasse-rcpt-actions { grid-column: 1 / -1; }
}

/* Rechte der Filialleitung (#83) — Rabatt/Preis je Zeile (SaleScreen), DiscountPad, fehlende Freigabe */
.kasse-line-discount { font-size: 14px; color: var(--kasse-ok); font-weight: 600; }
.kasse-line-actions { display: flex; gap: 6px; margin-top: 4px; }
.kasse-line-action {
    min-height: 36px;
    padding: 4px 12px;
    border: 1px solid rgba(18, 32, 58, 0.18);
    border-radius: 999px;
    background: #fff;
    color: var(--kasse-primary);
    font: inherit;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
}
.kasse-discount-modes { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin: 12px 0; }
.kasse-discount-mode {
    min-height: 48px;
    border: 2px solid rgba(18, 32, 58, 0.15);
    border-radius: 12px;
    background: #fff;
    font: inherit;
    font-weight: 700;
    cursor: pointer;
}
.kasse-discount-mode--active { border-color: var(--kasse-primary); color: var(--kasse-primary); }
.kasse-approval-missing { display: flex; align-items: center; justify-content: space-between; gap: 12px; }

/* Beleg per Mail (#81) — Components/ReceiptMail.razor, Knopf im Abschluss (SaleScreen) */
.kasse-mail { display: flex; flex-direction: column; gap: 8px; margin: 4px 0 12px; }
.kasse-mail-form { display: flex; flex-direction: column; gap: 10px; }
.kasse-mail-form label { display: flex; flex-direction: column; gap: 6px; font-size: 15px; color: var(--kasse-muted); }
.kasse-mail-form input {
    width: 100%;
    min-height: 56px;
    padding: 0 16px;
    border: 1px solid rgba(18, 32, 58, 0.25);
    border-radius: 12px;
    font: inherit;
    font-size: 20px;
    color: var(--kasse-ink);
    background: #fff;
}
.kasse-mail-hint { margin: 0; font-size: 15px; }

/* Abholungen (#91) — Components/PickupDesk.razor („Heute abzuholen“), SaleScreen (übernommene Abholung). Ebene wie die
   Kundenkarte (kasse-cust-*); Karten je Abholung im Raster, schon abgeholte als kurze Liste darunter. */
.kasse-pk-reload { margin-left: auto; }
/* Fünf Knöpfe in der Leiste (mit „Abholungen“): kompakter, damit sie im Querformat in eine Zeile passen. */
.kasse-toolbar .kasse-button { min-height: 48px; padding: 8px 18px; }
.kasse-pk-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 12px; align-items: start; }
.kasse-pk { display: flex; flex-direction: column; gap: 4px; margin: 0; padding: 14px; background: var(--kasse-bg); }
.kasse-pk-time { font-size: 20px; }
.kasse-pk-name { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 10px; margin: 0; font-size: 19px; font-weight: 700; }
.kasse-pk-name .kasse-cust-sub { margin: 0; font-weight: 400; }
.kasse-pk .kasse-wide { margin-top: 8px; }
.kasse-pk-done-head { margin: 20px 0 6px; font-size: 18px; color: var(--kasse-muted); }
.kasse-pk-done { margin: 0; padding: 0; list-style: none; font-size: 16px; }
.kasse-pk-done li { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 4px 12px; padding: 6px 0; border-top: 1px solid #e3e8f2; }
.kasse-sale-pickup { background: rgba(46, 125, 50, 0.1); }
.kasse-line-unit--missing { color: var(--kasse-warn); font-weight: 600; }
.kasse-cust-item .kasse-wide { margin-top: 8px; min-height: 48px; }

@media (max-width: 700px) {
    .kasse-pk-list { grid-template-columns: 1fr; }
}

/* Trinkgeld (#84) — Components/CashPayment.razor (Trinkgeld-Knopf, „Stimmt so“, Aufteilung), Components/DayClosing.razor */
.kasse-pay-field {
    padding: 2px 8px;
    margin: -4px 0 -4px -10px;
    border: 2px solid transparent;
    border-radius: 10px;
    background: none;
    color: inherit;
    font: inherit;
    cursor: pointer;
}
.kasse-pay-field--active { border-color: var(--kasse-primary); color: var(--kasse-primary); font-weight: 700; }
.kasse-sums .kasse-pay-split { grid-column: 1 / -1; margin-top: -6px; font-size: 16px; font-weight: 400; color: var(--kasse-muted); }
.kasse-pay-split span { font-weight: 700; color: var(--kasse-ink); }
.kasse-pay-split .kasse-pay-split-tip--active { color: var(--kasse-primary); text-decoration: underline; }
.kasse-quick--pay { grid-template-columns: repeat(4, 1fr); }
.kasse-quick-btn--tip { border-color: var(--kasse-ok); color: var(--kasse-ok); line-height: 1.1; }
.kasse-quick-btn--active { background: var(--kasse-ok); color: #fff; }
.kasse-day-tips { padding: 10px 14px; border-radius: 10px; background: rgba(46, 125, 50, 0.1); font-size: 20px; }
/* Querformat-Tablet (800 px hoch): Bezahlknopf ohne Scrollen erreichbar. */
@media (max-height: 820px) and (orientation: landscape) {
    .kasse-keypad--pay .kasse-key { height: 56px; }
    .kasse-payment .kasse-sums--big { gap: 4px 16px; margin: 4px 0 8px; }
}

/* Mehrere Abholungen, überfällig/heute/morgen, neue Abholung (#92) — PickupDesk (Abschnitte, „Dazunehmen“), SaleScreen
   (mehrere übernommene Abholungen, Zeilen-Kennzeichen, „Als Abholung anlegen“), PickupCreate (Dialog). */
.kasse-pk-section { display: flex; align-items: center; gap: 8px; margin: 18px 0 8px; font-size: 18px; }
.kasse-pk-section--0 { color: var(--kasse-error); }
.kasse-pk-section--2 { color: var(--kasse-muted); }
.kasse-pk-count { min-width: 26px; padding: 1px 8px; border-radius: 999px; background: #e3e8f2; color: var(--kasse-ink); font-size: 14px; text-align: center; }
.kasse-pk--overdue { border-left: 5px solid var(--kasse-error); }
.kasse-pk--in-cart { outline: 2px solid var(--kasse-ok); }
.kasse-pk-day { font-weight: 600; color: var(--kasse-muted); }
.kasse-pk-hint { margin: 0 0 8px; }
.kasse-pk-new-hint { margin-top: 18px; font-size: 15px; }
.kasse-pk-tag { display: inline-block; margin-left: 6px; padding: 0 7px; border-radius: 8px; background: #dfe7fb; color: var(--kasse-primary); font-size: 13px; font-weight: 600; vertical-align: middle; }
.kasse-pk-more { display: block; margin: 2px 0 8px; }
.kasse-pk-create { display: block; margin: 10px auto 0; }
.kasse-pkc-form { align-items: flex-start; }
.kasse-pkc-wide { flex: 1 1 100%; }
.kasse-pkc-wide input { width: 100%; box-sizing: border-box; }
.kasse-pkc-days { display: flex; flex-direction: column; gap: 4px; font-size: 15px; color: var(--kasse-muted); }
.kasse-pkc-chips { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.kasse-pkc-chip { min-height: 48px; padding: 6px 14px; flex-direction: row; font-size: 16px; }
.kasse-pkc-lines { flex: 1 1 100%; margin: 0; padding: 8px 12px; border-radius: 12px; background: #eef2fb; list-style: none; font-size: 16px; color: var(--kasse-ink); }
.kasse-sale-pickups { flex-wrap: wrap; gap: 4px 12px; }
.kasse-sale-pickups > span:first-child { flex: 1 1 100%; }
.kasse-sale-pickup-row { display: inline-flex; align-items: center; gap: 6px; font-size: 15px; }
.kasse-sale-pickup-row .kasse-pk-tag { margin-left: 0; }

/* Offene Lieferscheine im Warenkorb (#90) — SaleScreen (über der Ware, „Zurücklegen“), CustomerCard („In den Warenkorb“,
   „Alle offenen kassieren“). */
.kasse-open-notes { margin-bottom: 4px; padding: 0 10px; border-radius: 12px; background: #fff7e6; }
.kasse-open-note:last-child { border-bottom: none; }
.kasse-open-note { grid-template-columns: minmax(0, 1fr) 84px; }
.kasse-cust-incart { color: var(--kasse-ok); font-weight: 600; }
.kasse-cust-col .kasse-cust-item .kasse-button { margin-top: 8px; }

/* Storno an der Filialkasse (#87) — ReceiptSearch: Knopf je Beleg, Rückfrage mit Grund, Ergebnis mit Auszahlung */
.kasse-rcpt-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px; }
.kasse-rcpt-storno { min-height: 48px; padding: 8px 18px; color: var(--kasse-error); }
.kasse-rcpt-reason { display: flex; flex-direction: column; gap: 4px; margin: 12px 0; font-size: 15px; color: var(--kasse-muted); }
.kasse-rcpt-reason input {
    box-sizing: border-box;
    min-height: 48px;
    padding: 8px 12px;
    border: 1px solid rgba(18, 32, 58, 0.2);
    border-radius: 10px;
    font: inherit;
    font-size: 18px;
    color: var(--kasse-ink);
    background: #fff;
}
.kasse-rcpt-storno-ok { min-height: 56px; margin-top: 8px; background: var(--kasse-error); }
.kasse-rcpt-payout { margin: 0 16px 10px; font-size: 24px; font-weight: 700; font-variant-numeric: tabular-nums; }
[data-testid="receipt-storno-done"] .kasse-muted,
[data-testid="receipt-storno-done"] .kasse-note { margin: 0 16px 10px; }

/* Tagesbestellung (#68) — Components/DailyOrderEditor.razor (Dialog über der Kundenkarte), CustomerCard („Ändern“ je
   Lieferung von morgen, „Tagesbestellung …“). Querformat: Bestellung links, Artikel rechts; Hochformat untereinander. */
.kasse-cust-order-edit { min-height: 44px; margin-top: 8px; padding: 6px 18px; }
.kasse-cust-order-new { display: block; width: 100%; margin-top: 4px; }
.kasse-do { width: min(1180px, 100%); overflow: auto; }
.kasse-do .kasse-bon-head h2 .kasse-muted { font-weight: 400; }
.kasse-do-body { display: grid; grid-template-columns: minmax(0, 3fr) minmax(0, 2fr); gap: 16px; padding: 0 16px 16px; }
.kasse-do-main { display: flex; flex-direction: column; gap: 12px; min-width: 0; }
.kasse-do-main input[type="date"],
.kasse-do-note input {
    min-height: 48px;
    padding: 6px 12px;
    border: 1px solid #c9d2e3;
    border-radius: 12px;
    font: inherit;
    font-size: 18px;
    color: var(--kasse-ink);
    background: #fff;
}
.kasse-do-hint { font-size: 16px; color: var(--kasse-ink); }
/* Der Hinweis nach dem Bestellschluss muss auffallen: kräftige Warnfarbe, groß. */
.kasse-do-cutoff {
    margin: 0;
    padding: 12px 16px;
    border-radius: 12px;
    background: var(--kasse-warn);
    color: #fff;
    font-size: 20px;
    font-weight: 700;
}
.kasse-do-cutoff--big { font-size: 26px; text-align: center; padding: 18px 16px; }
.kasse-do-state { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 0; font-size: 15px; }
.kasse-do-lines { max-height: none; overflow: visible; padding: 0 12px; border-radius: 12px; background: #fff; }
.kasse-do-lines .kasse-line { grid-template-columns: minmax(0, 1fr) auto 96px; }
.kasse-do-qty {
    width: 76px;
    min-height: 48px;
    border: 1px solid #c9d2e3;
    border-radius: 12px;
    font: inherit;
    font-size: 20px;
    font-weight: 700;
    text-align: center;
    color: var(--kasse-ink);
    background: #fff;
}
.kasse-do-removed { margin: 0; font-size: 15px; color: var(--kasse-warn); }
.kasse-do-total { padding: 0 4px; }
.kasse-do-note { display: flex; flex-direction: column; gap: 4px; font-size: 15px; color: var(--kasse-muted); }
.kasse-do-actions { position: sticky; bottom: 0; display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: 10px; padding: 8px 0; background: var(--kasse-bg); }
.kasse-do-save { background: var(--kasse-ok); }
.kasse-do-delete-ok { background: var(--kasse-error); }
.kasse-do-products { min-width: 0; padding: 12px; border-radius: 14px; background: #fff; }
.kasse-do-product-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 8px; max-height: 60vh; overflow-y: auto; }
.kasse-do-product {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 2px;
    min-height: 64px;
    padding: 8px 12px;
    border: 0;
    border-radius: 12px;
    background: #eef2fb;
    color: var(--kasse-ink);
    font: inherit;
    font-size: 16px;
    text-align: left;
    cursor: pointer;
}
.kasse-do-product:active { background: #dfe6f7; }
.kasse-do-done { display: flex; flex-direction: column; gap: 14px; padding: 8px 16px 20px; }
.kasse-do-done-title { margin: 0; font-size: 22px; font-weight: 700; }

@media (max-width: 960px) {
    .kasse-do-body { grid-template-columns: 1fr; }
    .kasse-do-product-list { max-height: 40vh; }
}

/* Verkauf parken (#85) — SaleScreen („Parken“ im Warenkorb-Kopf, Hinweis im leeren Warenkorb), Home (Toolbar „Geparkt“ mit
   Anzahl), ParkedDesk (Liste, Ebene wie die Abholungen), DayClosing (Warnung vor dem Zählen). */
.kasse-cart-head-actions { display: inline-flex; align-items: center; gap: 18px; }
.kasse-park-count { display: inline-block; min-width: 24px; margin-left: 6px; padding: 0 7px; border-radius: 999px; background: #e3e8f2; color: var(--kasse-muted); font-size: 14px; text-align: center; }
.kasse-park-count--some { background: var(--kasse-primary); color: #fff; }
.kasse-park-hint { display: block; margin: 6px 0 0; }
.kasse-park-summary { margin: 4px 0; font-size: 17px; }
.kasse-day-parked { display: flex; flex-direction: column; gap: 10px; }
.kasse-day-parked .kasse-error, .kasse-day-parked .kasse-sub { margin: 0; }
/* Sechs Toolbar-Knöpfe (mit „Geparkt“) passen bei 1280 px in eine Zeile. */
.kasse-toolbar { gap: 10px; }
.kasse-toolbar .kasse-button { padding: 8px 12px; }
.kasse-toolbar .kasse-park-count { margin-left: 4px; }

/* Offline-Start (#95) — Components/OfflineBanner.razor, Sperrhinweise in SaleScreen/CashPayment/CashierSignIn. */
.kasse-offline-banner {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 12px 16px;
    border-radius: 12px;
    border-left: 6px solid var(--kasse-warn);
    background: #fff4e0;
    color: var(--kasse-ink);
}
.kasse-offline-text { flex: 1; display: flex; flex-direction: column; gap: 2px; font-size: 16px; line-height: 1.4; }
.kasse-offline-text b { font-size: 20px; color: var(--kasse-warn); }
.kasse-offline-age { color: var(--kasse-muted); }
.kasse-offline-banner .kasse-button { flex: none; }
.kasse-offline-note { margin: 0 0 10px; font-size: 16px; }
.kasse-signin .kasse-offline-note { margin: 0 0 16px; }
@media (max-width: 900px) {
    .kasse-offline-banner { flex-direction: column; align-items: stretch; }
}
.kasse-signin .kasse-tile:disabled { opacity: 0.55; cursor: default; }