/* Büro: Vorhersage, Teig-Rechner, Einkauf, Rezepte, KI-Speisekarte. Grundform hell; RestaurantExpress grau und eckig. */
.of { --of-card: #fcfcfb; --of-line: #e6e5e0; --of-mut: #52514e; --of-r: 12px; --of-acc: #1f6f43; --of-ink: #0b0b0b;
  display: flex; flex-direction: column; height: 100%; min-height: 0; color: var(--of-ink); }
.look-classic .of { --of-card: #fbfaf7; --of-line: #a8a49a; --of-r: 0; --of-acc: #0a246a; }
.look-modern .of { --of-acc: var(--brand, #1f6f43); }
.of-tabs { display: flex; gap: 4px; flex-wrap: wrap; padding-bottom: 8px; flex: none; }
.of-tabs button { border: 1px solid var(--of-line); background: var(--of-card); padding: 7px 14px; border-radius: var(--of-r); cursor: pointer; font-size: 14px; color: inherit; }
.of-tabs button.on { background: var(--of-acc); border-color: var(--of-acc); color: #fff; font-weight: 600; }
.look-classic .of-tabs button { box-shadow: inset -1px -1px 0 #808080, inset 1px 1px 0 #fff; }
.look-classic .of-tabs button.on { box-shadow: inset 1px 1px 0 #808080; }
.of-body { flex: 1; min-height: 0; overflow: auto; }
.of-page { display: flex; flex-direction: column; gap: 12px; padding-bottom: 12px; }
.of-wait, .of-err { padding: 30px; text-align: center; color: var(--of-mut); }
.of-err { color: #b3261e; }
.of-mut { color: var(--of-mut); font-size: 12.5px; }
.of-card { background: var(--of-card); border: 1px solid var(--of-line); border-radius: var(--of-r); padding: 12px 14px; }
.of-card-h { display: flex; gap: 10px; align-items: baseline; flex-wrap: wrap; margin-bottom: 8px; }
.of-card-h h3 { margin: 0; font-size: 15px; }
.of .grow { flex: 1; }
.of-tiles { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 12px; }
.of-tile { background: var(--of-card); border: 1px solid var(--of-line); border-radius: var(--of-r); padding: 10px 14px; display: flex; flex-direction: column; gap: 2px; }
.of-tile span { font-size: 12.5px; color: var(--of-mut); }
.of-tile b { font-size: 28px; font-weight: 600; line-height: 1.15; }
.of-tile small { color: var(--of-mut); font-size: 12px; }
.of-learn { background: #fff7e0; border: 1px solid #f0d58a; border-radius: var(--of-r); padding: 10px 14px; display: flex; flex-direction: column; gap: 6px; }
.of-meter { height: 8px; background: #f3e2ad; border-radius: 4px; overflow: hidden; }
.of-meter i { display: block; height: 100%; background: #c98500; border-radius: 4px; }
.of-bar { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.of-btn { border: 1px solid var(--of-line); background: var(--of-card); color: inherit; padding: 7px 14px; border-radius: var(--of-r); cursor: pointer; font-size: 14px; }
.of-btn.on, .of-btn.main { background: var(--of-acc); border-color: var(--of-acc); color: #fff; font-weight: 600; }
.of-btn:disabled { opacity: .45; cursor: default; }
.look-classic .of-btn { box-shadow: inset -1px -1px 0 #808080, inset 1px 1px 0 #fff; background: #ece9e2; }
.look-classic .of-btn.on, .look-classic .of-btn.main { background: #0a246a; color: #fff; }
.look-classic .of select, .look-classic .of .of-in, .look-classic .of .of-num, .look-classic .of .of-date { height: auto; padding: 4px 6px; }
.of-in, .of-date, .of select, .of-num { border: 1px solid var(--of-line); border-radius: calc(var(--of-r) / 2); padding: 6px 8px; font: inherit; background: #fff; color: inherit; }
.of-in { min-width: 200px; }
.of-num { width: 76px; text-align: right; }
.of-inline { display: inline-flex; gap: 6px; align-items: center; }
.of-day { font-size: 15px; }
.of-table { width: 100%; border-collapse: collapse; font-size: 13.5px; }
.of-table th { text-align: left; font-weight: 600; color: var(--of-mut); font-size: 12px; padding: 6px 8px; border-bottom: 1px solid var(--of-line); white-space: nowrap; }
.of-table td { padding: 6px 8px; border-bottom: 1px solid var(--of-line); font-variant-numeric: tabular-nums; }
.of-table .r { text-align: right; }
.of-table .b { font-weight: 700; }
.of-table th.sp { color: #b25a1a; }
.of-table tr.dough td { font-weight: 700; background: rgba(42, 120, 214, .06); }
.of-table tr.zero td { color: var(--of-mut); }
.of-scroll { overflow-x: auto; }
.of-tag { background: #e8eef7; color: #24527a; border-radius: 6px; padding: 1px 6px; font-size: 11px; }
.of-kind { border-radius: 6px; padding: 1px 7px; font-size: 12px; font-weight: 600; background: #eee; }
.of-kind.feiertag { background: #e2f0e5; color: #1d6b38; } .of-kind.event { background: #fde8dc; color: #9a3d12; }
.of-kind.ferien { background: #e5ecfa; color: #24527a; } .of-kind.geschlossen { background: #eee; color: #555; }
.of-x { border: 0; background: none; font-size: 20px; cursor: pointer; color: var(--of-mut); }
.of-hero { font-size: 48px; font-weight: 600; line-height: 1.1; margin: 4px 0 10px; }
.of-cols { display: grid; grid-template-columns: minmax(260px, 1fr) 2fr; gap: 12px; }
.of-balls { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 12px; }
.of-ball { background: var(--of-card); border: 1px solid var(--of-line); border-radius: var(--of-r); padding: 12px 14px; display: flex; flex-direction: column; gap: 2px; }
.of-ball-n { font-size: 52px; font-weight: 600; line-height: 1; }
.of-ball-l { font-size: 12.5px; color: var(--of-mut); margin-bottom: 6px; }
.of-ball small { color: var(--of-mut); }
.of-recipes { display: grid; grid-template-columns: 280px 1fr; grid-template-rows: auto auto; gap: 12px; align-items: start; }
.of-list { grid-row: span 2; display: flex; flex-direction: column; gap: 8px; max-height: 70vh; }
.of-list ul { list-style: none; margin: 0; padding: 0; overflow: auto; }
.of-list li { padding: 6px 8px; cursor: pointer; border-radius: 6px; display: flex; gap: 8px; align-items: baseline; }
.of-list li:hover { background: rgba(0, 0, 0, .05); }
.of-list li.on { background: var(--of-acc); color: #fff; }
.of-list li .nr { min-width: 26px; color: var(--of-mut); font-variant-numeric: tabular-nums; }
.of-list li.on .nr, .of-list li.on small { color: #fff; }
.of-list li small { color: var(--of-mut); font-size: 11px; }
.of-edit { display: flex; flex-direction: column; gap: 10px; }
.of-form { display: flex; gap: 6px; flex-wrap: wrap; align-items: center; margin-bottom: 8px; }
.of-stocklist { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 4px 12px; }
.of-stocklist li { display: flex; flex-direction: column; padding: 5px 0; border-bottom: 1px solid var(--of-line); cursor: pointer; }
.of-stocklist li span { font-size: 12px; color: var(--of-mut); }
@media (max-width: 900px) { .of-cols, .of-recipes { grid-template-columns: 1fr; } .of-list { grid-row: auto; max-height: 40vh; } }

/* Diagramme */
.ch { position: relative; }
.ch svg { width: 100%; height: auto; display: block; overflow: visible; }
.ch-bar { cursor: default; outline: none; }
.ch-bar.on path, .ch-bar:focus path { filter: brightness(1.12); }
.ch-legend { display: flex; gap: 14px; flex-wrap: wrap; font-size: 12px; color: #52514e; margin-bottom: 4px; }
.ch-legend span { display: inline-flex; gap: 6px; align-items: center; }
.ch-key { display: inline-block; width: 12px; height: 12px; border-radius: 3px; }
.ch-key.actual { background: #2a78d6; } .ch-key.forecast { background: #86b6ef; }
.ch-key.whisker { width: 2px; height: 12px; background: #52514e; border-radius: 0; }
.ch-key.mark { width: 8px; height: 8px; border-radius: 50%; background: #eb6834; }
.ch-tip { position: absolute; transform: translate(-50%, calc(-100% - 6px)); background: #fff; border: 1px solid #d9d8d2; border-radius: 8px; box-shadow: 0 4px 14px rgba(0, 0, 0, .12);
  padding: 6px 10px; pointer-events: none; display: flex; flex-direction: column; gap: 1px; white-space: nowrap; z-index: 5; font-size: 12px; color: #52514e; }
.ch-tip b { font-size: 15px; color: #0b0b0b; }

/* Fenster im RestaurantExpress-Aussehen und Bereich im modernen Aussehen */
.c-ops .of { padding: 0; }
.m-office { height: 100%; padding: 14px 18px; box-sizing: border-box; display: flex; flex-direction: column; gap: 8px; }
.m-office > .m-ops-h { flex: none; }

/* KI-Speisekarte */
.mi-keyline { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; font-size: 13.5px; color: var(--of-mut); }
.mi-ok { color: #1d6b38; font-weight: 700; }
.mi-keycard p { margin: 0 0 8px; font-size: 14px; }
.mi-keycard.demo { background: #fff7e0; border-color: #f0d58a; }
.mi-key { min-width: 320px; font-family: ui-monospace, monospace; }
.mi-drop { border: 2px dashed var(--of-line); border-radius: var(--of-r); padding: 28px 16px; display: flex; flex-direction: column; gap: 6px; align-items: center; text-align: center; cursor: pointer; background: rgba(0, 0, 0, .015); }
.mi-drop b { font-size: 16px; }
.mi-drop span { color: var(--of-mut); font-size: 13px; max-width: 520px; }
.mi-drop:hover, .mi-drop:focus, .mi-drop.over { border-color: var(--of-acc); background: rgba(42, 120, 214, .05); outline: none; }
.mi-drop.off { opacity: .5; cursor: not-allowed; }
.mi-files { display: flex; gap: 10px; flex-wrap: wrap; margin: 12px 0; }
.mi-files figure { margin: 0; position: relative; width: 120px; border: 1px solid var(--of-line); border-radius: var(--of-r); overflow: hidden; background: #fff; }
.mi-files img, .mi-pdf { width: 100%; height: 140px; object-fit: cover; display: block; }
.mi-pdf { display: grid; place-items: center; background: #f3f2ee; font-weight: 700; color: #b3261e; }
.mi-files figcaption { font-size: 11.5px; padding: 4px 6px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; display: flex; flex-direction: column; }
.mi-files figcaption small { color: var(--of-mut); }
.mi-files .of-x { position: absolute; top: 2px; right: 4px; background: rgba(255, 255, 255, .85); border-radius: 50%; width: 26px; height: 26px; line-height: 1; }
.mi-working { display: flex; gap: 16px; align-items: center; }
.mi-working h3 { margin: 0 0 4px; font-size: 16px; }
.mi-working p { margin: 0 0 4px; font-size: 14px; }
.mi-spin { width: 34px; height: 34px; border-radius: 50%; border: 4px solid #d8e6f7; border-top-color: #2a78d6; animation: mi-spin 1s linear infinite; flex: none; }
@keyframes mi-spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .mi-spin { animation-duration: 3s; } }
.mi-st { border-radius: 6px; padding: 1px 7px; font-size: 12px; font-weight: 600; background: #eee; white-space: nowrap; }
.mi-st.arbeitet { background: #e5ecfa; color: #24527a; } .mi-st.fertig { background: #fff1c9; color: #7a5600; }
.mi-st.uebernommen { background: #e2f0e5; color: #1d6b38; } .mi-st.fehler { background: #fbe4e2; color: #b3261e; }
.mi-err { color: #b3261e; }
.mi-sum { display: flex; gap: 8px 18px; flex-wrap: wrap; font-size: 14px; }
.mi-sum b { font-size: 18px; }
.mi-sum .new b { color: #1d6b38; } .mi-sum .hit b { color: #24527a; } .mi-sum .warn b { color: #9a6200; } .mi-sum .bad b { color: #b3261e; }
.mi-notes { margin: 10px 0 0; padding: 8px 12px 8px 28px; background: #f6f5f1; border-radius: var(--of-r); font-size: 13px; color: #3b3a37; }
.mi-groups { display: flex; flex-direction: column; gap: 8px; }
.mi-group > div { display: flex; gap: 6px; flex-wrap: wrap; margin-top: 4px; }
.mi-size { border: 1px solid var(--of-line); border-radius: 6px; padding: 2px 8px; font-size: 12.5px; background: #fff; }
.mi-size small { color: var(--of-mut); }
.mi-tag { border-radius: 6px; padding: 1px 7px; font-size: 11.5px; font-weight: 600; white-space: nowrap; }
.mi-tag.new { background: #e2f0e5; color: #1d6b38; } .mi-tag.hit { background: #e5ecfa; color: #24527a; } .mi-tag.bad { background: #fbe4e2; color: #b3261e; }
.mi-hit { display: block; color: var(--of-mut); font-size: 11px; margin-top: 2px; max-width: 140px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mi-table td { vertical-align: top; }
.mi-table .of-in { min-width: 0; width: 100%; padding: 4px 6px; box-sizing: border-box; }
.mi-table .mi-nr { width: 54px; text-align: right; }
.mi-name { min-width: 180px; width: 24%; }
.mi-name small { display: block; color: var(--of-mut); font-size: 11.5px; margin-top: 2px; }
.mi-unsure { margin-top: 4px; font-size: 12px; color: #7a5600; background: #fff1c9; border-radius: 6px; padding: 2px 6px; }
.mi-table tr.unsure td { background: #fffbef; }
.mi-table tr.off td { opacity: .45; }
.mi-cat td { background: #f3f2ee; font-weight: 700; font-size: 13px; }
.mi-prices { display: flex; gap: 4px; flex-wrap: nowrap; align-items: center; }
.mi-prices label { display: inline-flex; align-items: center; gap: 2px; }
.mi-prices label span { font-size: 11px; color: var(--of-mut); min-width: 12px; text-align: right; }
.mi-prices .of-num { width: 58px; padding: 4px 5px; }
.mi-prices label.miss .of-num { border-color: #e08a83; background: #fff6f5; }
.mi-ingr { min-width: 170px; }
.mi-codes { font-size: 12px; color: var(--of-mut); white-space: nowrap; }
.mi-opts { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 12px; }
.mi-opt { border: 1px solid var(--of-line); border-radius: var(--of-r); padding: 8px 10px; background: #fff; }
.mi-opt.off { opacity: .5; }
.mi-opt-h { display: flex; gap: 6px; align-items: center; flex-wrap: wrap; }
.mi-opt-h small { color: var(--of-mut); font-size: 12px; }
.mi-opt ul { list-style: none; margin: 6px 0 0; padding: 0; font-size: 13px; }
.mi-opt li { display: flex; justify-content: space-between; gap: 8px; padding: 2px 0; border-bottom: 1px dotted var(--of-line); }
.mi-foot { position: sticky; bottom: 0; display: flex; gap: 10px; align-items: center; flex-wrap: wrap; background: var(--of-card); border: 1px solid var(--of-line); border-radius: var(--of-r); padding: 10px 14px; box-shadow: 0 -4px 14px rgba(0, 0, 0, .06); }
.mi-done h3 { margin: 0 0 10px; font-size: 18px; color: #1d6b38; }
.look-classic .mi-drop, .look-classic .mi-opt, .look-classic .mi-files figure { border-radius: 0; }

/* Kasse: Tagesabschluss, Kassenbuch, Belege, Finanzamt */
.fi-cols { display: grid; grid-template-columns: repeat(auto-fit, minmax(340px, 1fr)); gap: 12px; align-items: start; }
.fi-warn { display: flex; flex-direction: column; gap: 6px; }
.fi-w { background: #fff7e0; border: 1px solid #f0d58a; border-radius: var(--of-r, 8px); padding: 8px 12px; font-size: 14px; color: #3a2f12; }
.fi-w.tse { background: #fde8e6; border-color: #e9a29b; }
.fi-amt.neg { color: #b3261e; }
.fi-amt.b { font-weight: 700; }
.of-table tr.fi-sum td { border-top: 2px solid var(--of-line); font-weight: 700; }
.fi-sub { margin-top: 14px; }
.fi-cash td:first-child { color: var(--of-mut); }
.fi-cash tr.fi-sum td:first-child { color: inherit; }
.fi-acts { white-space: nowrap; }
.fi-acts .of-btn, .of-btn.fi-small { padding: 3px 10px; font-size: 12.5px; margin-left: 4px; }
.fi-struck td { color: var(--of-mut); }
.fi-struck td:nth-child(3), .fi-struck td:nth-child(5) { text-decoration: line-through; }
.fi-counter td { color: var(--of-mut); font-style: italic; }
.fi-big b { font-size: 34px; }
.fi-form .fi-eur { width: 100px; font-size: 16px; }
.fi-form .fi-receipt { min-width: 110px; width: 110px; }
.fi-preview { font-weight: 600; color: #1d6b38; font-size: 13.5px; }
.fi-preview.neg { color: #b3261e; }
.fi-dlg { width: min(880px, 96vw); }
.fi-countwrap { display: grid; grid-template-columns: 1fr 250px; gap: 18px; }
.fi-count { display: grid; grid-template-columns: repeat(2, 1fr); gap: 6px 24px; align-content: start; }
.fi-group { display: grid; gap: 6px; align-content: start; }
.fi-group h4 { margin: 0 0 2px; font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: var(--of-mut); }
.fi-count.off { opacity: .35; }
.fi-den { display: grid; grid-template-columns: 52px 64px 1fr; align-items: center; gap: 6px; font-size: 14px; }
.fi-den span { font-weight: 700; text-align: right; }
.fi-den.note span { color: #1d5e3a; }
.fi-den.coin span { color: #7a5a12; }
.fi-den input { width: 64px; padding: 6px 8px; font-size: 16px; text-align: right; border: 1px solid #c8ced5; border-radius: 6px; font-variant-numeric: tabular-nums; }
.fi-den small { color: #5b636b; font-variant-numeric: tabular-nums; font-size: 12.5px; }
.fi-result { display: flex; flex-direction: column; gap: 6px; }
.fi-result > div { display: flex; justify-content: space-between; align-items: baseline; border-bottom: 1px solid #e3e6ea; padding: 4px 0; }
.fi-result span { color: #5b636b; font-size: 13.5px; }
.fi-result b { font-size: 22px; font-variant-numeric: tabular-nums; }
.fi-diff.neg b { color: #b3261e; }
.fi-diff.pos b { color: #9a6400; }
.fi-diff.zero b { color: #1d6b38; }
.fi-skip { margin-top: 6px; font-size: 14px; }
.fi-result p { margin: 4px 0 0; }
.fi-journal { display: grid; grid-template-columns: minmax(0, 1fr); gap: 12px; }
.fi-journal:has(.fi-detail) { grid-template-columns: minmax(0, 1.55fr) minmax(320px, 1fr); }
.fi-jt tbody tr { cursor: pointer; }
.fi-jt tbody tr:hover td { background: rgba(0, 0, 0, .03); }
.fi-jt tr.on td { background: rgba(42, 120, 214, .1); }
.fi-jt tr.fi-storno td { color: #a32b22; }
.fi-bt { font-size: 11.5px; font-weight: 600; padding: 1px 6px; border-radius: 5px; background: #e2f0e5; color: #1d6b38; white-space: nowrap; }
.fi-bt.AVBelegstorno { background: #fde8e6; color: #a32b22; }
.fi-bt.AVBelegabbruch { background: #eee; color: #555; }
.fi-bt.AVBestellung { background: #fff3d6; color: #8a5a00; }
.fi-tse { font-size: 12px; color: #1d6b38; font-weight: 600; }
.fi-tse.test { color: #9a6400; }
.fi-tse.bad { color: #b3261e; }
.fi-detail { position: sticky; top: 0; align-self: start; }
.fi-detail .of-table { margin-top: 8px; }
.fi-tsedata { display: grid; grid-template-columns: max-content 1fr; gap: 4px 12px; font-size: 13px; margin: 10px 0 0; }
.fi-tsedata dt { color: var(--of-mut); }
.fi-tsedata dd { margin: 0; word-break: break-all; }
.fi .mono { font-family: ui-monospace, Menlo, Consolas, monospace; font-size: 12px; }
.fi .bad { color: #b3261e; }
.fi-chain { font-weight: 600; font-size: 13.5px; }
.fi-chain.ok { color: #1d6b38; }
.fi-chain.bad { color: #b3261e; }
.fi-tsecard { border-left-width: 6px; }
.fi-tsecard.ok { border-left-color: #2e8b57; }
.fi-tsecard.test { border-left-color: #d9a400; }
.fi-tsecard.bad { border-left-color: #b3261e; }
.fi-tsestate { display: flex; flex-direction: column; gap: 2px; margin-bottom: 4px; }
.fi-tsestate b { font-size: 17px; }
.fi-tsestate span { font-size: 13.5px; color: var(--of-mut); }
.fi-tsecard .of-bar { margin-top: 10px; }
.fi-creds { display: flex; flex-direction: column; gap: 8px; margin-top: 10px; }
.fi-creds p { margin: 0; }
.fi-creds .of-in { max-width: 420px; }
.fi-exports { margin-top: 10px; }
.fi-meldung { margin-bottom: 10px; }
.fi .of-card p { margin: 0 0 8px; }
@media (max-width: 760px) { .fi-countwrap { grid-template-columns: 1fr; } .fi-count { grid-template-columns: 1fr; } .fi-journal:has(.fi-detail) { grid-template-columns: 1fr; } }

/* Kassenbuch: Beginnen, Buchen mit Foto, Buch/Monatsblatt, Steuerberater, Nachschau */
.kb-views .of-btn.on { font-weight: 700; }
.kb-start form { display: flex; flex-direction: column; gap: 12px; }
.kb-choice { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 10px; }
.kb-choice label { display: grid; grid-template-columns: auto 1fr; gap: 2px 8px; align-items: start; border: 1px solid var(--of-line); border-radius: var(--of-r, 8px); padding: 10px 12px; cursor: pointer; }
.kb-choice label.on { border-color: var(--of-acc); box-shadow: inset 0 0 0 1px var(--of-acc); }
.kb-choice input { grid-row: span 2; margin-top: 3px; }
.kb-choice span { color: var(--of-mut); font-size: 13.5px; }
.kb-grid { display: grid; grid-template-columns: max-content minmax(0, 420px); gap: 8px 14px; align-items: center; }
.kb-grid > label { font-size: 13.5px; color: var(--of-mut); font-weight: 600; }
.kb-form { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 10px 14px; align-items: end; }
.kb-form > label { display: flex; flex-direction: column; gap: 3px; font-size: 12.5px; font-weight: 600; color: var(--of-mut); }
.kb-form > label > select, .kb-form > label > input, .kb-form > label > span { font-weight: 400; color: var(--of-ink, inherit); }
.kb-form .kb-wide { grid-column: 1 / -1; }
.kb-photo { cursor: pointer; }
.kb-photo.on { background: #e3f4e9; border-color: #2e8b57; color: #1d6a3a; }
.of-btn.kb-miss { color: #9a6400; border-style: dashed; }
.of-btn.kb-add { opacity: .45; }
.of-btn.kb-add:hover { opacity: 1; }
.kb-list tr.fi-struck td { text-decoration: none; }
.kb-list tr.fi-struck td:nth-child(4), .kb-list tr.fi-struck td:nth-child(7) { text-decoration: line-through; }
.kb-book tr.kb-storno td { color: var(--of-mut); font-style: italic; }
.kb-rc { white-space: nowrap; }
.kb-counts { margin-top: 10px; }
.kb-counts summary { cursor: pointer; color: var(--of-mut); font-size: 13.5px; }
.kb-rv { width: min(900px, 96vw); }
.kb-imgs { display: flex; flex-wrap: wrap; gap: 10px; max-height: 64vh; overflow: auto; }
.kb-imgs img { max-width: 100%; max-height: 60vh; border: 1px solid var(--of-line); border-radius: 6px; }
.kb-pdf { display: inline-block; padding: 18px 22px; border: 1px dashed var(--of-line); border-radius: 8px; }
.kb-month { min-width: 150px; text-align: center; text-transform: capitalize; }
.kb-bookcard .of-card-h { flex-wrap: wrap; }
.kb-book td { font-variant-numeric: tabular-nums; }
.kb-book tr.kb-day td { background: rgba(0, 0, 0, .045); font-weight: 700; padding-top: 10px; }
.kb-book tr.kb-carry td { color: var(--of-mut); }
.kb-book tr.kb-end td { border-bottom: 2px solid var(--of-line); font-weight: 600; }
.kb-sums { display: flex; flex-wrap: wrap; gap: 14px; align-items: flex-start; margin-bottom: 12px; }
.kb-sums .of-table { width: auto; min-width: 280px; }
.kb-dl { display: grid; grid-template-columns: max-content 1fr; gap: 8px 12px; align-items: center; margin: 10px 0; }
.kb-acc { width: 90px; }
.kb-nr { width: 130px; }
.kb-konten td { padding-top: 3px; padding-bottom: 3px; }
.kb-steps { margin: 4px 0 0; padding-inline-start: 22px; display: grid; gap: 4px; font-size: 14.5px; }
.kb-ns-head { border-left: 6px solid #2a78d6; }
.kb-today { margin-top: 8px; font-size: 13px; }
.look-dos .kb-choice label, .look-dos .kb-imgs img { border-radius: 0; }
.look-dos .kb-book tr.kb-day td { background: #00aaaa; color: #000; }
@media (max-width: 760px) { .kb-grid { grid-template-columns: 1fr; } .kb-dl { grid-template-columns: 1fr; }
  .kb > .of-tiles { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; } .kb > .of-tiles .of-tile { padding: 6px 8px; } .kb > .of-tiles small { display: none; }
  .kb > .of-tiles .of-tile b, .kb > .of-tiles .fi-big b { font-size: 17px; } .kb-views { gap: 6px; } .kb-views .of-btn { padding: 6px 10px; } }

/* ---------- Lieferportale einrichten ---------- */
.pt .of-page { max-width: 1280px; }
.pt-intro p { margin: 4px 0 8px; font-size: 14px; line-height: 1.45; }
.pt-new { margin-top: 6px; }
.pt-conn.off { opacity: .6; }
.pt-mode { font-size: 11.5px; font-weight: 700; padding: 1px 8px; border-radius: 999px; }
.pt-mode.test { background: #eef3ff; color: #22407a; }
.pt-mode.live { background: #e3f4e9; color: #1d6a3a; }
.pt-red { color: #b3261e; }
.pt-help { margin: 0 0 10px; }
.pt-grid { display: grid; grid-template-columns: 170px 1fr; gap: 8px 14px; align-items: center; }
.pt-grid > label { font-weight: 600; font-size: 13.5px; color: var(--of-mut); }
.pt-url { flex: 1; min-width: 320px; font-family: ui-monospace, Menlo, Consolas, monospace; font-size: 12.5px; }
.pt-foot { margin-top: 12px; }
.of-btn.pt-del { color: #b3261e; }
.pt-log td { font-size: 12.5px; }
.pt-msg { color: var(--of-mut); max-width: 420px; }
.pt-st { font-size: 11.5px; font-weight: 700; padding: 1px 7px; border-radius: 999px; background: #eceae4; color: #52514e; }
.pt-st.ok { background: #e3f4e9; color: #1d6a3a; }
.pt-st.test { background: #eef3ff; color: #22407a; }
.pt-st.fehler, .pt-st.abgelehnt { background: #fde3e1; color: #b3261e; }
.pt-st.doppelt, .pt-st.wiederholen, .pt-st.ignoriert { background: #fff4e0; color: #6b4300; }
.pt-unmapped { border-color: #f0c27a; background: #fffaf0; }
.pt-format pre { background: #f4f3ef; border-radius: 8px; padding: 10px 12px; font-size: 12px; overflow: auto; }
.pt-format summary { cursor: pointer; }
@media (max-width: 760px) { .pt-grid { grid-template-columns: 1fr; } .pt-url { min-width: 0; } }

/* Reservierungen */
.rv { display: flex; flex-direction: column; gap: 8px; height: 100%; min-height: 0; }
.rv-bar { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
.rv-bar .sx-in { width: auto; }
.rv-day { font-size: 16px; margin-inline-start: 6px; }
.rv-views { display: flex; gap: 2px; }
.rv-bar kbd, .rv-dlg kbd { font-size: 10px; opacity: .7; border: 1px solid currentColor; border-radius: 3px; padding: 0 3px; margin-inline-start: 4px; }
.rv-body { flex: 1; min-height: 0; display: grid; grid-template-columns: 300px minmax(0, 1fr); gap: 10px; }
.rv-side { background: var(--of-card); border: 1px solid var(--of-line); border-radius: var(--of-r); padding: 10px; overflow: auto; display: flex; flex-direction: column; gap: 8px; }
.rv-side-h { display: flex; align-items: center; justify-content: space-between; }
.rv-count { min-width: 22px; text-align: center; border-radius: 11px; background: var(--of-line); padding: 1px 6px; font-weight: 700; }
.rv-count.on { background: #e5392b; color: #fff; }
.rv-req { border: 1px solid var(--of-line); border-inline-start: 4px solid #f39c12; border-radius: 8px; padding: 8px; display: flex; flex-direction: column; gap: 4px; }
.rv-req.new { background: #fff6e5; }
.rv-req-h { display: flex; justify-content: space-between; }
.rv-note { font-size: 13px; color: var(--of-mut); }
.rv-main { min-height: 0; overflow: auto; display: flex; flex-direction: column; gap: 6px; }
.rv-empty { padding: 30px; text-align: center; color: var(--of-mut); background: var(--of-card); border: 1px dashed var(--of-line); border-radius: var(--of-r); }
.rv-hint { font-size: 12px; color: var(--of-mut); }
.rv-list { width: 100%; border-collapse: separate; border-spacing: 0; background: var(--of-card); border: 1px solid var(--of-line); border-radius: var(--of-r); overflow: hidden; }
.rv-list th { text-align: start; font-size: 12px; color: var(--of-mut); font-weight: 600; padding: 6px 8px; border-bottom: 1px solid var(--of-line); }
.rv-list td { padding: 7px 8px; border-bottom: 1px solid var(--of-line); vertical-align: top; }
.rv-list td small { display: block; color: var(--of-mut); font-size: 12px; }
.rv-list tr { cursor: pointer; }
.rv-list tr.sel td { background: color-mix(in srgb, var(--of-acc) 12%, transparent); }
.rv-list tr.st-no td:not(.ac) { opacity: .5; text-decoration: line-through; }
.rv-list tr.st-done td:not(.ac) { opacity: .6; }
.rv-list .tm { font-weight: 700; font-size: 16px; white-space: nowrap; }
.rv-list .pp { font-weight: 700; font-size: 16px; text-align: center; }
.rv-list .tb { font-weight: 700; }
.rv-list .ac { white-space: nowrap; text-align: end; }
.rv-list .ac .sx-btn { margin-inline-start: 3px; }
.rv-web { color: #6b4fbb !important; }
.rv-warn { color: #c0392b; font-weight: 600; }
.rv-st { display: inline-block; border-radius: 999px; padding: 1px 9px; font-size: 12.5px; font-weight: 700; white-space: nowrap; background: var(--of-line); }
.rv-st.anfrage { background: #f39c12; color: #fff; }
.rv-st.ok { background: #2f6fb7; color: #fff; }
.rv-st.da { background: #1f8f5f; color: #fff; }
.rv-st.no { background: #c0392b; color: #fff; }
.rv-plan { background: var(--of-card); border: 1px solid var(--of-line); border-radius: var(--of-r); padding: 8px; display: flex; flex-direction: column; gap: 4px; }
.rv-row { display: grid; grid-template-columns: 70px 1fr; align-items: center; gap: 6px; }
.rv-tl { display: flex; flex-direction: column; font-size: 14px; }
.rv-tl small { color: var(--of-mut); font-size: 11px; }
.rv-track { position: relative; height: 34px; background: color-mix(in srgb, var(--of-line) 35%, transparent); border-radius: 6px; }
.rv-head .rv-track { height: 18px; background: none; }
.rv-head .rv-track span { position: absolute; transform: translateX(-50%); font-size: 11px; color: var(--of-mut); }
.rv-grid { position: absolute; top: 0; bottom: 0; width: 1px; background: var(--of-line); }
.rv-blk { position: absolute; top: 3px; bottom: 3px; border: 0; border-radius: 6px; background: #2f6fb7; color: #fff; font-size: 12px; text-align: start; padding: 0 6px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; cursor: pointer; }
.rv-blk.anfrage { background: #f39c12; }
.rv-blk.da { background: #1f8f5f; }
.rv-blk.done { background: #9aa0a6; }
.rv-blk.sel { outline: 3px solid #0b0b0b; outline-offset: 1px; }
.rv-dlg { width: min(760px, 96vw); }
.rv-form { display: flex; flex-direction: column; gap: 10px; }
.rv-tables-h { display: flex; align-items: center; gap: 10px; }
.rv-tables { display: grid; grid-template-columns: repeat(auto-fill, minmax(96px, 1fr)); gap: 6px; max-height: 240px; overflow: auto; }
.rv-tb { border: 2px solid var(--of-line); background: var(--of-card); border-radius: 10px; padding: 6px; display: flex; flex-direction: column; align-items: center; cursor: pointer; color: inherit; }
.rv-tb b { font-size: 18px; }
.rv-tb small { font-size: 11px; color: var(--of-mut); }
.rv-tb i { font-size: 10.5px; font-style: normal; color: #c0392b; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%; }
.rv-tb.busy { background: repeating-linear-gradient(135deg, transparent 0 6px, rgba(192, 57, 43, .08) 6px 12px); }
.rv-tb.on { border-color: var(--of-acc); background: color-mix(in srgb, var(--of-acc) 14%, var(--of-card)); }
.look-dos .rv-st, .look-dos .rv-blk, .look-dos .rv-tb, .look-dos .rv-req, .look-dos .rv-list, .look-dos .rv-plan, .look-dos .rv-side, .look-dos .rv-count { border-radius: 0; }
.look-dos .rv-req.new { background: #0000aa; color: #ffff55; }
.look-dos .rv-list tr.sel td { background: #00aaaa; color: #000; }
.look-dos .rv-blk { background: #00aaaa; color: #000; }
.look-dos .rv-blk.anfrage, .look-dos .rv-st.anfrage { background: #aa5500; color: #fff; }
.look-dos .rv-blk.da, .look-dos .rv-st.da { background: #00aa00; color: #fff; }
.look-dos .rv-st.ok { background: #00aaaa; color: #000; }
.look-dos .rv-st.no { background: #aa0000; }
.look-dos .rv-tb.busy { background: #000055; }
.look-dos .rv-tb i, .look-dos .rv-warn { color: #ff5555; }
@media (max-width: 1100px) { .rv-body { grid-template-columns: 1fr; } .rv-side { max-height: 220px; } }

/* Webshop-Einstellungen */
.sh-brand { display: flex; gap: 16px; align-items: flex-start; border-top: 1px solid var(--of-line); padding-top: 10px; }
.sh-brand-l { flex: 1; display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.sh-brand-l .sx-row { display: flex; gap: 6px; align-items: center; flex-wrap: wrap; }
.sh-brand-l .sx-in { max-width: 320px; }
.sh-dot { display: inline-block; width: 12px; height: 12px; border-radius: 50%; background: var(--bc); margin-inline-end: 6px; }
.sh-qr { width: 130px; flex: none; background: #fff; padding: 4px; border: 1px solid var(--of-line); border-radius: 8px; }
.sh-qr svg { display: block; width: 100%; height: auto; }
.sh-hours { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 6px 14px; }
.sh-hours label { display: grid; grid-template-columns: 96px 1fr; align-items: center; gap: 8px; }
.sh-off { border-color: #e8913a; background: #fff6e5; }
.sh-off p { margin: 0; }
.sh-pause { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; background: var(--of-card); border: 1px solid var(--of-line); border-radius: var(--of-r); padding: 8px 12px; }
.sh-pause.on { border-color: #e8913a; background: #fff3dc; }
.look-dos .sh-pause.on, .look-dos .sh-off { background: #aa5500; color: #fff; }
.look-dos .sh-qr { border-radius: 0; }

/* Altdaten-Archiv (Kasse → Altdaten) */
.ad-main { display: grid; grid-template-columns: 230px minmax(0, 1fr); gap: 12px; align-items: start; }
.ad-side { display: flex; flex-direction: column; gap: 4px; }
.ad-side button { text-align: start; border: 1px solid var(--of-line); background: var(--of-card); border-radius: calc(var(--of-r) / 2); padding: 6px 10px; cursor: pointer; display: flex; flex-direction: column; font: inherit; color: inherit; }
.ad-side button small { color: var(--of-mut); font-size: 11.5px; }
.ad-side button.on { border-color: var(--of-acc); box-shadow: inset 3px 0 0 var(--of-acc); }
.ad-grid { min-width: 0; }
.ad-scroll { max-height: 62vh; overflow: auto; }
.ad-t td, .ad-t th { white-space: nowrap; }
.ad-t thead th { position: sticky; top: 0; background: var(--of-card); z-index: 1; }
.ad-pager { margin-top: 8px; }
.ad-head p { margin: 8px 0 0; }
.look-dos .ad-side button { border-radius: 0; background: #0000aa; color: #fff; border-color: #55ffff; }
.look-dos .ad-side button.on { background: #00aaaa; color: #000; box-shadow: none; }
.look-dos .ad-side button small { color: inherit; }
@media (max-width: 860px) { .ad-main { grid-template-columns: 1fr; } .ad-side { flex-direction: row; flex-wrap: wrap; } }