:root,
html[data-pe-theme="light"] {
  --pe-primary: #1c1d23;
  --pe-primary-hover: #2c2d35;
  --pe-on-primary: #ffffff;
  --pe-secondary: #34353d;
  --pe-accent: #b8960c;
  --pe-accent-light: #d4af37;
  --pe-accent-ink: #7a6408;
  --pe-bg: #f3f2ef;
  --pe-bg-glow: rgba(184, 150, 12, 0.07);
  --pe-surface: #ffffff;
  --pe-surface-2: #faf9f6;
  --pe-surface-soft: #f7f6f3;
  --pe-tabs-bg: #eceae5;
  --pe-input-bg: #ffffff;
  --pe-text: #1c1d23;
  --pe-muted: #6b6b70;
  --pe-line: #e7e5e0;
  --pe-border: var(--pe-line);
  --pe-border-strong: #cfcbc3;
  --pe-radius-sm: 6px;
  --pe-radius-md: 10px;
  --pe-radius-lg: 14px;
  --pe-radius: var(--pe-radius-lg);
  --pe-space-1: 4px;
  --pe-space-2: 8px;
  --pe-space-3: 12px;
  --pe-space-4: 16px;
  --pe-space-5: 24px;
  --pe-space-6: 32px;
  --pe-font-size-xs: 0.78rem;
  --pe-font-size-sm: 0.88rem;
  --pe-font-size-md: 0.95rem;
  --pe-font-size-lg: 1.1rem;
  --pe-font-weight-medium: 600;
  --pe-font-weight-bold: 700;
  --pe-shadow: 0 1px 2px rgba(28, 29, 35, 0.05), 0 6px 20px rgba(28, 29, 35, 0.06);
  --pe-shadow-lift: 0 4px 10px rgba(28, 29, 35, 0.08), 0 16px 36px rgba(28, 29, 35, 0.12);
  --pe-shadow-pos: 0 1px 2px rgba(28, 29, 35, 0.04);
  --pe-focus: 0 0 0 3px rgba(184, 150, 12, 0.28);
  --pe-info-bg: #f2f0e6;
  --pe-info-border: #e3ddc4;
  --pe-info-text: #4d431a;
  --pe-error-bg: #fdeceb;
  --pe-error-border: #f5c8c4;
  --pe-error-text: #90261b;
  --pe-brand-red: #a12d22;
  --pe-danger: var(--pe-brand-red);
  --pe-danger-hover: #b9382c;
  --pe-success-bg: #ecf7ee;
  --pe-success-border: #c6e6cd;
  --pe-success-text: #1d5e2c;
  --pe-nav-icon-bg: linear-gradient(145deg, #faf6e9, #f1e7c4);
  --pe-nav-icon-border: rgba(184, 150, 12, 0.25);
  --pe-nav-icon-inset: rgba(255, 255, 255, 0.8);
  --pe-modal-scrim: rgba(18, 20, 26, 0.48);
  color-scheme: light;
}

html[data-pe-theme="dark"] {
  --pe-primary: #d4af37;
  --pe-primary-hover: #e8c95a;
  --pe-on-primary: #15161a;
  --pe-secondary: #a8abb4;
  --pe-accent: #d4af37;
  --pe-accent-light: #f0d878;
  --pe-accent-ink: #f0d878;
  --pe-bg: #0f1116;
  --pe-bg-glow: rgba(212, 175, 55, 0.09);
  --pe-surface: #1a1d26;
  --pe-surface-2: #222632;
  --pe-surface-soft: #161922;
  --pe-tabs-bg: #14171f;
  --pe-input-bg: #12151c;
  --pe-text: #eef0f4;
  --pe-muted: #9aa0ad;
  --pe-line: #2d3340;
  --pe-border: var(--pe-line);
  --pe-border-strong: #454d5c;
  --pe-radius-sm: 6px;
  --pe-radius-md: 10px;
  --pe-radius-lg: 14px;
  --pe-radius: var(--pe-radius-lg);
  --pe-space-1: 4px;
  --pe-space-2: 8px;
  --pe-space-3: 12px;
  --pe-space-4: 16px;
  --pe-space-5: 24px;
  --pe-space-6: 32px;
  --pe-shadow: 0 1px 2px rgba(0, 0, 0, 0.35), 0 8px 24px rgba(0, 0, 0, 0.35);
  --pe-shadow-lift: 0 6px 16px rgba(0, 0, 0, 0.4), 0 18px 40px rgba(0, 0, 0, 0.45);
  --pe-shadow-pos: 0 1px 2px rgba(0, 0, 0, 0.35);
  --pe-focus: 0 0 0 3px rgba(212, 175, 55, 0.35);
  --pe-info-bg: #2a2618;
  --pe-info-border: #5a4e28;
  --pe-info-text: #f0d878;
  --pe-error-bg: #3a1c1a;
  --pe-error-border: #7a3530;
  --pe-error-text: #ffb4ab;
  --pe-brand-red: #e07066;
  --pe-danger: var(--pe-brand-red);
  --pe-danger-hover: #f08a80;
  --pe-success-bg: #16301f;
  --pe-success-border: #2f6b42;
  --pe-success-text: #9dd9ad;
  --pe-nav-icon-bg: linear-gradient(145deg, #2a2414, #3a3218);
  --pe-nav-icon-border: rgba(212, 175, 55, 0.35);
  --pe-nav-icon-inset: rgba(255, 255, 255, 0.06);
  --pe-modal-scrim: rgba(0, 0, 0, 0.65);
  color-scheme: dark;
}

.pe-app, .pe-super-wrap { font-family: "Segoe UI Variable Text", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif; color: var(--pe-text); -webkit-font-smoothing: antialiased; }
.pe-app,
.pe-super-wrap {
  width: 100%;
  max-width: min(1120px, 100%);
  margin-left: auto;
  margin-right: auto;
  min-height: 0;
  background: var(--pe-bg);
  background-image: radial-gradient(1100px 500px at 50% -10%, var(--pe-bg-glow), transparent 60%);
  padding: clamp(8px, 1.2vw, 16px) clamp(.75rem, 2.5vw, 1.5rem) clamp(1.25rem, 3vw, 2.5rem);
  box-sizing: border-box;
  align-items: stretch;
  justify-content: flex-start;
}
/* POS: flacher Hintergrund ohne Glow */
.pe-app.pe-kasse,
.pe-app.pe-verkauf,
.pe-app.pe-bestellung,
.pe-app.pe-station {
  background-image: none;
  max-width: none;
}
.pe-app * { box-sizing: border-box; }
body.pe-fullscreen-app {
  background: var(--pe-bg);
  color: var(--pe-text);
  margin: 0;
  width: 100%;
  min-height: 100dvh;
}

/* Theme-Container: volle Viewport-Breite (kein Linksbündeln in schmalen Spalten) */
body.pe-fullscreen-app #page,
body.pe-fullscreen-app .site,
body.pe-fullscreen-app .wp-site-blocks,
body.pe-fullscreen-app .wp-block-group,
body.pe-fullscreen-app .wp-block-post-content,
body.pe-fullscreen-app .site-content,
body.pe-fullscreen-app .content-area,
body.pe-fullscreen-app main,
body.pe-fullscreen-app article,
body.pe-fullscreen-app .entry-content,
body.pe-fullscreen-app .page-content,
body.pe-fullscreen-app .entry-header {
  width: 100% !important;
  max-width: none !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  box-sizing: border-box;
}
body.pe-fullscreen-app .entry-header .entry-title,
body.pe-fullscreen-app .page-title,
body.pe-fullscreen-app .wp-block-post-title {
  /* Theme-Seitentitel ausblenden — App hat eigenen Header */
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  overflow: hidden !important;
  clip: rect(0 0 0 0) !important;
}

.pe-app-header { display: flex !important; align-items: center; gap: var(--pe-space-2); flex-wrap: wrap; margin-bottom: clamp(8px, 1vw, 14px); padding: var(--pe-space-2) var(--pe-space-3); background: var(--pe-surface); border: 1px solid var(--pe-border); border-radius: var(--pe-radius-md); box-shadow: none; }
.pe-app-header h1 { margin: 0; font-size: 1.2rem; font-weight: var(--pe-font-weight-bold); letter-spacing: -.01em; flex: 1; }
.pe-app-header-text { flex: 1; min-width: 0; }
.pe-app-header-actions { display: flex; align-items: center; gap: var(--pe-space-2); margin-left: auto; }
.pe-app.pe-kasse .pe-app-header,
.pe-app.pe-verkauf .pe-app-header,
.pe-app.pe-bestellung .pe-app-header,
.pe-app.pe-station .pe-app-header {
  gap: var(--pe-space-2);
  padding: var(--pe-space-2) var(--pe-space-3);
  border-radius: var(--pe-radius-md);
  box-shadow: none;
  background: var(--pe-surface);
  border-color: var(--pe-border);
}
.pe-app.pe-kasse .pe-app-header h1,
.pe-app.pe-verkauf .pe-app-header h1,
.pe-app.pe-bestellung .pe-app-header h1,
.pe-app.pe-station .pe-app-header h1 {
  flex: 0 1 auto;
}
.pe-pos-kiosk-btn {
  display: inline-flex !important;
  align-items: center;
  gap: .3rem;
  flex: 0 0 auto;
  visibility: visible !important;
  opacity: 1 !important;
}
.pe-app.pe-kasse .pe-app-header .pe-btn,
.pe-app.pe-verkauf .pe-app-header .pe-btn,
.pe-app.pe-bestellung .pe-app-header .pe-btn,
.pe-app.pe-station .pe-app-header .pe-btn {
  min-height: 44px;
  padding: .45rem .75rem;
}
.pe-logo { height: 40px; width: auto; }
.pe-sub { margin: 0; color: var(--pe-muted); font-size: .88rem; }

.pe-theme-btn {
  min-width: 44px;
  min-height: 44px;
  padding: .45rem .7rem !important;
  font-size: 1.15rem !important;
  line-height: 1;
}

/* Portal-Header (Gold-Branding) */
.pe-portal-header {
  position: relative;
  overflow: hidden;
  background: linear-gradient(120deg, #15161a 0%, #1e1f26 55%, #2a2109 130%);
  border: 1px solid rgba(212,175,55,.25);
  color: #fff;
  padding: 1.1rem 1.4rem;
}
.pe-portal-header::after {
  content: "";
  position: absolute; left: 0; right: 0; bottom: 0; height: 3px;
  background: linear-gradient(90deg, transparent, #d4af37 18%, #f0d878 50%, #d4af37 82%, transparent);
}
.pe-portal-header h1 { color: #fff; font-size: 1.3rem; font-weight: 700; letter-spacing: -.01em; }
.pe-portal-header .pe-sub { color: #d4af37; font-weight: 600; letter-spacing: .02em; }
.pe-portal-header .pe-logo { height: 54px; filter: drop-shadow(0 3px 8px rgba(0,0,0,.55)); }
.pe-portal-header .pe-user { color: rgba(255,255,255,.85); font-size: .9rem; font-weight: 600; white-space: nowrap; }
.pe-btn-logout {
  background: rgba(212,175,55,.12); color: #e8c95a; border: 1px solid rgba(212,175,55,.55);
  padding: .5rem 1.1rem; border-radius: 999px; font-weight: 700; font-size: .9rem; text-decoration: none;
  transition: background .18s, color .18s, border-color .18s;
}
.pe-login-form-wrap .login-remember {
  display: none !important;
}
.pe-pos-fs-hint {
  position: fixed;
  left: 50%;
  bottom: calc(14px + env(safe-area-inset-bottom, 0px));
  transform: translateX(-50%);
  z-index: 2147483000;
  margin: 0;
  padding: .55rem 1.15rem;
  min-height: 44px;
  border: 0;
  border-radius: 999px;
  background: #d4af37;
  color: #15161a;
  font-weight: 700;
  font-size: 1rem;
  box-shadow: 0 8px 24px rgba(0, 0, 0, .35);
  cursor: pointer;
}
.pe-pos-fs-hint:hover,
.pe-pos-fs-hint:focus-visible {
  background: #e8c95a;
  outline: none;
}

.pe-card-title { display: flex; align-items: center; gap: .5rem; margin: 0 0 .75rem; font-size: .78rem; font-weight: 700; color: var(--pe-muted); text-transform: uppercase; letter-spacing: .09em; }
.pe-visually-hidden { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

.pe-btn { display: inline-flex; align-items: center; justify-content: center; gap: .4rem; padding: .6rem 1.05rem; min-height: 44px; border-radius: var(--pe-radius-md); border: none; cursor: pointer; font-weight: var(--pe-font-weight-medium); text-decoration: none; font-size: var(--pe-font-size-md); line-height: 1.2; transition: transform .12s, box-shadow .18s, background .18s, filter .18s, border-color .15s; }
.pe-btn:active { transform: scale(.98); }
.pe-btn:focus-visible { outline: none; box-shadow: var(--pe-focus); }
.pe-btn-primary { background: var(--pe-primary); color: var(--pe-on-primary); box-shadow: none; }
.pe-btn-primary:hover { background: var(--pe-primary-hover); }
.pe-btn-secondary { background: var(--pe-surface); color: var(--pe-text); border: 1px solid var(--pe-border); box-shadow: none; }
.pe-btn-secondary:hover { border-color: var(--pe-accent-light); color: var(--pe-accent-ink); }
.pe-btn-ghost { background: transparent; color: var(--pe-text); border: 1px solid var(--pe-border); }
.pe-btn-ghost:hover { border-color: var(--pe-accent-light); color: var(--pe-accent-ink); background: var(--pe-surface-soft); }
.pe-btn-danger { background: var(--pe-danger); color: #fff; }
.pe-btn-danger:hover { background: var(--pe-danger-hover); filter: none; }
.pe-card-danger {
  margin-top: 1rem;
  border: 1px solid var(--pe-error-border);
  background: var(--pe-error-bg);
}
.pe-card-danger h3 { color: var(--pe-error-text); }
.pe-btn-sm { padding: .4rem .8rem; font-size: var(--pe-font-size-sm); min-height: 36px; }
.pe-btn-lg { width: 100%; padding: .85rem; font-size: var(--pe-font-size-lg); margin-top: .5rem; min-height: 52px; border-radius: var(--pe-radius-md); }
.pe-btn-label { line-height: 1; }

.pe-icon {
  display: inline-block;
  width: 1.25rem;
  height: 1.25rem;
  flex: 0 0 auto;
  vertical-align: middle;
}
.pe-icon--sm { width: 1rem; height: 1rem; }
.pe-icon--lg { width: 1.5rem; height: 1.5rem; }
.pe-mute-btn { position: relative; }
.pe-mute-icon { display: inline-flex; align-items: center; justify-content: center; }
.pe-mute-icon[hidden] { display: none !important; }

.pe-card { background: var(--pe-surface); border: 1px solid var(--pe-border); border-radius: var(--pe-radius-lg); padding: var(--pe-space-4); box-shadow: var(--pe-shadow); margin-bottom: var(--pe-space-4); }
.pe-app.pe-kasse .pe-card,
.pe-app.pe-verkauf .pe-card,
.pe-app.pe-bestellung .pe-card,
.pe-app.pe-station .pe-card {
  border-radius: var(--pe-radius-md);
  box-shadow: var(--pe-shadow-pos);
  padding: var(--pe-space-3);
  margin-bottom: var(--pe-space-3);
  background: var(--pe-surface);
}
.pe-card-head { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: .5rem; margin-bottom: 1rem; }
.pe-card-head h2 { margin: 0; font-size: 1.1rem; font-weight: 700; letter-spacing: -.01em; }

.pe-nav-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: .85rem; margin: 1.25rem 0; }
.pe-nav-tile { position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: .65rem; padding: 1.4rem .75rem 1.2rem; background: var(--pe-surface); border: 1px solid var(--pe-line); border-radius: var(--pe-radius); box-shadow: var(--pe-shadow); text-decoration: none; color: var(--pe-text); transition: transform .16s, box-shadow .2s, border-color .2s; }
.pe-nav-tile:hover { transform: translateY(-3px); box-shadow: var(--pe-shadow-lift); border-color: rgba(212,175,55,.6); color: var(--pe-text); }
.pe-nav-icon { display: flex; align-items: center; justify-content: center; width: 58px; height: 58px; font-size: 1.7rem; border-radius: 18px; background: var(--pe-nav-icon-bg); border: 1px solid var(--pe-nav-icon-border); box-shadow: inset 0 1px 0 var(--pe-nav-icon-inset); }
.pe-nav-label { font-weight: 650; font-size: .95rem; text-align: center; letter-spacing: -.005em; }

.pe-tabs { display: flex; flex-wrap: wrap; gap: .35rem; margin-bottom: 1rem; padding: .3rem; background: var(--pe-tabs-bg); border-radius: 999px; width: fit-content; max-width: 100%; }
.pe-tab { padding: .5rem 1.05rem; border: none; background: transparent; border-radius: 999px; cursor: pointer; font-weight: 600; font-size: .9rem; color: var(--pe-muted); transition: background .15s, color .15s; }
.pe-tab:hover { color: var(--pe-text); }
.pe-tab.active { background: var(--pe-primary); color: var(--pe-on-primary); box-shadow: 0 2px 6px rgba(28,29,35,.25); }
.pe-tab-panel { display: none; }
.pe-tab-panel.active { display: block; }
/* Layout-Wrapper (display:contents) darf inaktive Panels nicht durchlassen */
.pe-organizer-admin .pe-tab-panel:not(.active),
.pe-portal .pe-tab-panel:not(.active) {
  display: none !important;
}
.pe-organizer-admin .pe-tab-panel.active,
.pe-portal .pe-tab-panel.active {
  display: block !important;
}

.pe-table { width: 100%; border-collapse: collapse; font-size: .93rem; }
.pe-table th { font-size: .75rem; text-transform: uppercase; letter-spacing: .07em; color: var(--pe-muted); }
.pe-table th, .pe-table td { padding: .65rem .6rem; border-bottom: 1px solid var(--pe-line); text-align: left; }
.pe-table tr:hover td { background: var(--pe-surface-2); }
.pe-input, .pe-app input[type=text], .pe-app input[type=url], .pe-app input[type=password], .pe-app input[type=date], .pe-app input[type=number], .pe-app select, .pe-app textarea {
  width: 100%; padding: .6rem .8rem; border: 1px solid var(--pe-border, var(--pe-line)); border-radius: var(--pe-radius-sm); margin: .25rem 0 .75rem; font: inherit; font-size: var(--pe-font-size-md, .95rem); line-height: 1.45; min-height: 44px; background: var(--pe-input-bg); color: var(--pe-text); transition: border-color .15s, box-shadow .15s;
}
.pe-input:focus, .pe-app input:focus, .pe-app select:focus, .pe-app textarea:focus { outline: none; border-color: var(--pe-accent-light); box-shadow: var(--pe-focus); }
.pe-app select { appearance: none; height: 44px; padding-top: 0; padding-bottom: 0; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%236b6b70' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right .85rem center; padding-right: 2.4rem; background-color: var(--pe-input-bg); }
html[data-pe-theme="dark"] .pe-app select {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%239aa0ad' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E");
}
.pe-app textarea { min-height: 90px; }
.pe-form-row label { display: block; font-weight: 600; margin-bottom: .25rem; }
.pe-form-inline { display: flex; align-items: center; gap: .75rem; flex-wrap: wrap; }

.pe-box { padding: 1rem 1.15rem; border-radius: var(--pe-radius-sm); }
.pe-info { background: var(--pe-info-bg); border: 1px solid var(--pe-info-border); color: var(--pe-info-text); }
.pe-error { background: var(--pe-error-bg); border: 1px solid var(--pe-error-border); color: var(--pe-error-text); }
.pe-success { background: var(--pe-success-bg); border: 1px solid var(--pe-success-border); color: var(--pe-success-text); }
.pe-hint { color: var(--pe-muted); font-size: .9rem; }
.pe-empty { text-align: center; color: var(--pe-muted); padding: 2.5rem 1rem; }
.pe-badge { background: var(--pe-primary); color: var(--pe-on-primary); padding: .22rem .6rem; border-radius: 999px; font-size: .78rem; font-weight: 600; }
.pe-badge-readonly { background: #fff4ce; color: #7a5600; border: 1px solid #e6c15a; }
.pe-station-banner strong { font-weight: 700; }

.pe-modal { position: fixed; inset: 0; background: var(--pe-modal-scrim); display: flex; align-items: center; justify-content: center; z-index: 200000; padding: 1rem; }
.pe-modal[hidden] { display: none !important; }
/* Kiosk-POS hat z-index 100000 — Bestätigung muss darüber und über .pe-modal liegen */
.pe-confirm-overlay,
.pe-alert-overlay {
  z-index: 500000 !important;
}
.pe-modal-inner { background: var(--pe-surface); color: var(--pe-text); border: 1px solid var(--pe-line); border-radius: var(--pe-radius); padding: 1.25rem; width: 100%; max-width: 480px; max-height: 90vh; overflow: auto; }
.pe-modal-actions { display: flex; gap: .5rem; margin-top: 1rem; }

.pe-phase { padding: .15rem .45rem; border-radius: 6px; font-size: .8rem; text-transform: uppercase; background: var(--pe-tabs-bg); color: var(--pe-text); }
.pe-checklist { list-style: none; padding: 0; margin: 0; }
.pe-checklist li { display: flex; align-items: center; gap: .5rem; padding: .5rem 0; border-bottom: 1px solid var(--pe-line); }

/* Checklisten mit Stichtag */
.pe-cl-add-row { display: flex; gap: .6rem; flex-wrap: wrap; align-items: center; margin-bottom: .35rem; }
.pe-cl-add-row #pe-cl-new-title { flex: 2 1 240px; margin: 0; }
.pe-cl-add-row #pe-cl-new-due { flex: 0 1 180px; margin: 0; }
.pe-cl-add-row #pe-cl-new-time { flex: 0 1 120px; margin: 0; }
.pe-cl-assign-row { margin: .35rem 0 .5rem; }
.pe-cl-assign-row label { display: block; font-size: .85rem; font-weight: 600; color: var(--pe-muted); margin-bottom: .2rem; }
.pe-cl-assign-row select { max-width: 420px; height: auto; min-height: 0; margin: 0; padding: .35rem .5rem; background-image: none; }
.pe-cl-assignees { display: inline-flex; align-items: center; gap: .3rem; padding: .25rem .7rem; border-radius: 999px; font-size: .8rem; font-weight: 600; background: #eef2f7; color: #3b4a5c; white-space: nowrap; }
.pe-cl-item { display: flex; align-items: center; justify-content: space-between; gap: .75rem; flex-wrap: wrap; padding: .65rem 0; }
.pe-cl-main { display: flex; align-items: center; gap: .6rem; cursor: pointer; flex: 1; min-width: 200px; }
.pe-cl-main input[type=checkbox] { width: 19px; height: 19px; accent-color: var(--pe-accent); flex: 0 0 auto; }
.pe-cl-title { font-weight: 500; }
.pe-cl-item-done .pe-cl-title { text-decoration: line-through; color: var(--pe-muted); }
.pe-cl-actions { display: flex; gap: .35rem; flex: 0 0 auto; }
.pe-cl-add-row #pe-cl-cancel-edit { margin: 0; }
.pe-cl-due { display: inline-flex; align-items: center; gap: .3rem; padding: .25rem .7rem; border-radius: 999px; font-size: .8rem; font-weight: 600; white-space: nowrap; }
.pe-cl-due-future { background: #f1efe9; color: #6b6b70; }
.pe-cl-due-soon { background: #fdf4d7; color: #7a6408; }
.pe-cl-due-today { background: #d4af37; color: #1c1d23; }
.pe-cl-due-over { background: #fdeceb; color: #90261b; }
.pe-cl-due-done { background: #ecf7ee; color: #1d5e2c; }
.pe-cl-agenda-day { display: flex; gap: 1rem; padding: .65rem 0; border-bottom: 1px solid var(--pe-line); }
.pe-cl-agenda-day:last-child { border-bottom: none; }
.pe-cl-agenda-date { flex: 0 0 64px; text-align: center; background: #faf6e9; border: 1px solid rgba(184,150,12,.3); border-radius: var(--pe-radius-sm); padding: .45rem .25rem; height: fit-content; }
.pe-cl-agenda-date strong { display: block; font-size: 1rem; }
.pe-cl-agenda-date small { color: var(--pe-muted); font-weight: 600; }
.pe-cl-agenda-list { list-style: none; margin: 0; padding: 0; flex: 1; }
.pe-cl-agenda-list li { padding: .3rem 0; border-bottom: 1px dashed var(--pe-line); }
.pe-cl-agenda-list li:last-child { border-bottom: none; }

.pe-email-missing { display: inline-flex; align-items: center; gap: .25rem; padding: .2rem .6rem; border-radius: 999px; background: #fdf4d7; color: #7a6408; font-size: .8rem; font-weight: 600; cursor: help; }

.pe-cl-help { margin: .5rem 0 1rem; }
.pe-cl-help summary {
  cursor: pointer;
  font-weight: 600;
  font-size: .9rem;
  color: var(--pe-muted);
  list-style: none;
  padding: .25rem 0;
}
.pe-cl-help summary::-webkit-details-marker { display: none; }
.pe-cl-help summary::before { content: "▸ "; }
.pe-cl-help[open] > summary::before { content: "▾ "; }
.pe-cl-help .pe-hint { margin: .5rem 0 0; }

/* Schichtplan */
.pe-shift-form-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: .35rem .75rem; margin-bottom: .75rem; }
.pe-shift-form-grid label { display: block; font-weight: 600; font-size: .88rem; }
.pe-shift-form-grid .pe-input,
.pe-shift-form-grid input,
.pe-shift-form-grid select { width: 100%; margin-top: .25rem; }
.pe-shift-day { margin-bottom: 1.25rem; }
.pe-shift-day-head { margin: 0 0 .5rem; font-size: .95rem; font-weight: 700; padding: .4rem .75rem; background: #faf6e9; border: 1px solid rgba(184,150,12,.28); border-radius: var(--pe-radius-sm); display: inline-block; }
.pe-shift-time { font-weight: 700; white-space: nowrap; }
.pe-shift-table td { vertical-align: middle; }
.pe-shift-cards { display: flex; flex-direction: column; gap: .65rem; }
.pe-shift-card {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: .35rem .75rem;
  align-items: start;
  padding: .85rem 1rem;
  background: #faf9f6;
  border: 1px solid var(--pe-line);
  border-radius: var(--pe-radius-sm);
}
.pe-shift-card-time { font-weight: 800; font-size: 1.05rem; letter-spacing: -.01em; grid-column: 1; }
.pe-shift-card-name { font-weight: 650; grid-column: 1; }
.pe-shift-card-meta { grid-column: 1; font-size: .88rem; color: var(--pe-muted); line-height: 1.35; }
.pe-shift-card-actions { grid-column: 2; grid-row: 1 / span 3; display: flex; flex-direction: column; gap: .35rem; align-self: center; }
.pe-shift-save-btn { margin-top: .25rem; }

@media (max-width: 600px) {
  .pe-shift-form-grid { grid-template-columns: 1fr 1fr; }
}

/* Verwaltung / Aufgabenplanung — responsive */
@media (max-width: 768px) {
  .pe-organizer-admin {
    padding: .65rem .65rem calc(1.25rem + env(safe-area-inset-bottom, 0px));
  }
  .pe-organizer-admin .pe-app-header {
    gap: .5rem;
    padding: .7rem .8rem;
    margin-bottom: .75rem;
  }
  .pe-organizer-admin .pe-app-header h1 {
    font-size: 1.05rem;
    line-height: 1.3;
    flex: 1 1 100%;
    order: -1;
  }

  .pe-organizer-admin .pe-tabs {
    display: flex;
    flex-wrap: nowrap;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    width: 100%;
    max-width: 100%;
    border-radius: 14px;
    gap: .2rem;
    padding: .3rem;
    margin-bottom: .85rem;
    scrollbar-width: thin;
    position: sticky;
    top: 0;
    z-index: 30;
    background: #eceae5;
    box-shadow: 0 4px 12px rgba(28, 29, 35, .08);
  }
  .pe-organizer-admin .pe-tab {
    flex: 0 0 auto;
    white-space: nowrap;
    min-height: 44px;
    padding: .55rem .85rem;
    font-size: .88rem;
  }

  .pe-organizer-admin .pe-card {
    padding: .9rem .8rem;
    margin-bottom: .75rem;
  }
  .pe-organizer-admin .pe-card-head {
    flex-direction: column;
    align-items: stretch;
    gap: .55rem;
  }
  .pe-organizer-admin .pe-card-head select,
  .pe-organizer-admin #pe-checklist-event,
  .pe-organizer-admin #pe-shift-event {
    width: 100%;
    min-height: 48px;
    font-size: 16px;
  }

  .pe-organizer-admin .pe-input,
  .pe-organizer-admin input[type=text],
  .pe-organizer-admin input[type=date],
  .pe-organizer-admin input[type=time],
  .pe-organizer-admin input[type=email],
  .pe-organizer-admin input[type=number],
  .pe-organizer-admin select,
  .pe-organizer-admin textarea {
    font-size: 16px !important;
    min-height: 48px;
  }

  .pe-cl-add-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: .55rem;
  }
  .pe-cl-add-row #pe-cl-new-title {
    grid-column: 1 / -1;
    flex: none;
    width: 100%;
  }
  .pe-cl-add-row #pe-cl-new-due,
  .pe-cl-add-row #pe-cl-new-time {
    flex: none;
    width: 100%;
    min-width: 0;
  }
  .pe-cl-add-row #pe-add-checklist-item {
    grid-column: 1 / -1;
    width: 100%;
    min-height: 50px;
    border-radius: 12px;
  }

  .pe-cl-assign-row select {
    max-width: none;
    width: 100%;
    min-height: 7.5rem;
  }

  .pe-checklist li.pe-cl-item {
    flex-direction: column;
    align-items: stretch;
    gap: .55rem;
    padding: .85rem 0;
  }
  .pe-cl-main {
    min-width: 0;
    gap: .75rem;
    padding: .15rem 0;
  }
  .pe-cl-main input[type=checkbox] {
    width: 24px;
    height: 24px;
  }
  .pe-cl-title { font-size: 1.02rem; line-height: 1.35; }
  .pe-cl-assignees,
  .pe-cl-due {
    align-self: flex-start;
    white-space: normal;
    max-width: 100%;
  }
  .pe-cl-actions {
    width: 100%;
  }
  .pe-cl-actions .pe-btn {
    flex: 1;
    min-height: 44px;
  }
  .pe-cl-add-row #pe-cl-cancel-edit {
    grid-column: 1 / -1;
    width: 100%;
    min-height: 48px;
  }

  .pe-cl-agenda-day {
    flex-direction: column;
    gap: .5rem;
  }
  .pe-cl-agenda-date {
    flex: none;
    display: inline-flex;
    align-items: baseline;
    gap: .4rem;
    width: fit-content;
    padding: .4rem .7rem;
  }
  .pe-cl-agenda-date strong { display: inline; font-size: 1rem; }
  .pe-cl-agenda-list li { padding: .55rem 0; font-size: .95rem; line-height: 1.4; }

  #pe-tab-checklists .pe-card-head .pe-btn,
  #pe-test-reminder {
    width: 100%;
    min-height: 48px;
  }

  .pe-shift-form-grid {
    grid-template-columns: 1fr;
    gap: .65rem;
  }
  .pe-shift-form-grid label { font-size: .92rem; }
  .pe-shift-save-btn,
  #pe-shift-cancel-edit {
    width: 100%;
    min-height: 50px;
    margin-top: .35rem;
  }
  .pe-shift-card {
    grid-template-columns: 1fr;
    gap: .4rem;
    padding: 1rem;
  }
  .pe-shift-card-actions {
    grid-column: 1;
    grid-row: auto;
    flex-direction: row;
    width: 100%;
    margin-top: .35rem;
  }
  .pe-shift-card-actions .pe-btn {
    flex: 1;
    min-height: 44px;
  }

  .pe-organizer-admin .pe-table-wrap,
  .pe-organizer-admin .pe-card > .pe-table,
  .pe-organizer-admin #pe-products-table,
  .pe-organizer-admin #pe-registers-table {
    display: block;
    width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }
  .pe-organizer-admin .pe-table {
    min-width: 520px;
  }
  .pe-organizer-admin .pe-btn-group {
    display: flex;
    flex-wrap: wrap;
    gap: .4rem;
  }
  .pe-organizer-admin .pe-modal-inner {
    max-width: calc(100vw - 1rem);
    margin: .5rem;
    max-height: calc(100vh - 1rem);
  }
}

@media (max-width: 420px) {
  .pe-cl-add-row {
    grid-template-columns: 1fr;
  }
}
.pe-email-test-row { display: flex; gap: .5rem; align-items: center; }
.pe-email-test-row .pe-input { flex: 1; margin: .25rem 0; }
.pe-email-test-row .pe-btn { flex: 0 0 auto; white-space: nowrap; }
.pe-link-row { display: flex; gap: 1rem; flex-wrap: wrap; }
.pe-price-list { list-style: none; padding: 0; }
.pe-price-list li { display: flex; justify-content: space-between; gap: 1rem; padding: .5rem 0; border-bottom: 1px solid var(--pe-line, #eee); }
.pe-price-stand { font-size: 1.05rem; margin: 1.35rem 0 .4rem; }
.pe-agb-body { max-width: 42rem; line-height: 1.55; }
.pe-agb-body p { margin: 0 0 .85rem; }
.pe-public-legal-links { margin-top: 1.5rem; }
.pe-public-legal-links a { font-weight: 600; }

.pe-super-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 1rem; margin: 1rem 0; }
.pe-super-card { display: block; padding: 1rem; background: #fff; border: 1px solid #d0d9e4; border-radius: var(--pe-radius); text-decoration: none; color: inherit; }
.pe-super-card strong { display: block; margin-bottom: .25rem; }
.pe-super-form-card { background: #fff; padding: 1rem; border-radius: var(--pe-radius); margin: 1rem 0; border: 1px solid #e8eef5; }
.pe-sa-login-qr {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: 1rem;
  margin-top: .75rem;
}
.pe-sa-login-qr-card {
  border: 1px solid var(--pe-line, #e8eef5);
  border-radius: var(--pe-radius, 10px);
  padding: 1rem;
  background: var(--pe-surface, #fff);
}
.pe-sa-login-qr-head {
  display: flex;
  flex-direction: column;
  gap: .2rem;
  margin-bottom: .75rem;
}
.pe-sa-login-qr-head span {
  font-size: .85rem;
  color: var(--pe-muted, #64748b);
}
.pe-sa-login-qr-actions {
  display: flex;
  flex-wrap: wrap;
  gap: .4rem;
  align-items: center;
  margin-top: .85rem;
}
.pe-sa-login-qr-rotate {
  display: inline;
  margin: 0;
}

.pe-kiosk-exit { position: fixed; top: 8px; right: 8px; z-index: 999999; background: #333; color: #fff; padding: .4rem .8rem; border-radius: 6px; text-decoration: none; font-size: .85rem; }

.pe-scan-row { display: flex; gap: .5rem; align-items: center; margin: .5rem 0; }
.pe-scan-row .pe-input { flex: 1; margin: 0; }
/* Generische Kamera: nur wenn sichtbar; Kasse nutzt Overlay (siehe .pe-kasse-camera-*) */
.pe-camera { width: 100%; max-height: 240px; border-radius: 8px; background: #000; margin: .5rem 0; }
.pe-camera[hidden] {
  display: none !important;
  width: 0 !important;
  height: 0 !important;
  max-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
}
.pe-card-info { margin-top: .75rem; padding: .75rem; background: var(--pe-info-bg); border: 1px solid var(--pe-info-border); color: var(--pe-info-text); border-radius: var(--pe-radius-sm); }
.pe-quick-amounts { display: flex; flex-wrap: wrap; gap: .35rem; margin-bottom: .75rem; }
.pe-btn-lg { width: 100%; padding: .85rem; font-size: var(--pe-font-size-lg); margin-top: .5rem; min-height: 52px; }

.pe-topup-qr-block { margin-top: 1.25rem; padding-top: 1rem; border-top: 1px solid #e2e8f0; }
.pe-topup-qr-summary {
  cursor: pointer;
  font-weight: 700;
  font-size: 1rem;
  list-style: none;
  padding: .35rem 0;
}
.pe-topup-qr-summary::-webkit-details-marker { display: none; }
.pe-topup-qr-summary::before { content: "▸ "; color: var(--pe-muted); }
details.pe-topup-qr-block[open] > .pe-topup-qr-summary::before { content: "▾ "; }
.pe-topup-qr-heading { margin: 1rem 0 .35rem; font-size: 1.05rem; font-weight: 700; }
.pe-topup-qr-payout {
  border-color: #fca5a5;
  background: #fff7f7;
}
.pe-topup-qr-payout .pe-topup-qr-label { color: #b91c1c; }
.pe-qr-kind-topup { background: #dcfce7; border-color: #16a34a; }
.pe-qr-kind-topup .pe-topup-qr-label { color: #14532d; }
.pe-qr-kind-payout { background: #fee2e2; border-color: #dc2626; }
.pe-qr-kind-payout .pe-topup-qr-label { color: #7f1d1d; }
.pe-qr-kind-all { background: #dbeafe; border-color: #2563eb; }
.pe-qr-kind-all .pe-topup-qr-label { color: #1e3a8a; }
.pe-qr-kind-activate { background: #fef08a; border-color: #ca8a04; }
.pe-qr-kind-activate .pe-topup-qr-label { color: #713f12; }
.pe-qr-kind-block { background: #e4e4e7; border-color: #52525b; }
.pe-qr-kind-block .pe-topup-qr-label { color: #18181b; }
.pe-qr-kind-return { background: #ffedd5; border-color: #ea580c; }
.pe-qr-kind-return .pe-topup-qr-label { color: #7c2d12; }
.pe-topup-qr-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(110px, 1fr));
  gap: .75rem;
  margin: .75rem 0 1rem;
}
.pe-topup-qr-tile {
  text-align: center;
  padding: .5rem;
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  border-radius: 10px;
}
.pe-topup-qr-tile img {
  display: block;
  width: 100%;
  max-width: 120px;
  height: auto;
  margin: 0 auto .35rem;
  background: #fff;
}
.pe-topup-qr-label { display: block; font-weight: 700; font-size: 1.1rem; }
.pe-topup-qr-code { display: block; font-size: .65rem; color: #64748b; word-break: break-all; margin-top: .2rem; }

.pe-drag-handle {
  cursor: grab;
  display: inline-block;
  font-size: 1.15rem;
  color: var(--pe-muted, #94a3b8);
  user-select: none;
  -webkit-user-select: none;
  padding: 0 .15rem;
}
.pe-drag-handle:active { cursor: grabbing; }
.pe-dragging { background: rgba(184, 150, 12, .12); }
.pe-hint-mobile { display: none; }
.pe-kasse-camera-btn {
  width: auto;
  flex: 0 0 auto;
  margin: 0;
  min-height: 44px;
  white-space: nowrap;
}

/* ─── POS: Viewport füllen, Seite scrollt nicht ─────────────────────────── */
html:has(.pe-app.pe-kasse),
html:has(.pe-app.pe-verkauf),
html:has(.pe-app.pe-bestellung),
html:has(.pe-app.pe-station) {
  height: 100%;
  overflow: hidden;
}
body.pe-fullscreen-app:has(.pe-app.pe-kasse),
body.pe-fullscreen-app:has(.pe-app.pe-verkauf),
body.pe-fullscreen-app:has(.pe-app.pe-bestellung),
body.pe-fullscreen-app:has(.pe-app.pe-station),
body.pe-fullscreen-app:has(.pe-app.pe-display),
body.pe-kiosk:has(.pe-app.pe-kasse),
body.pe-kiosk:has(.pe-app.pe-verkauf),
body.pe-kiosk:has(.pe-app.pe-bestellung),
body.pe-kiosk:has(.pe-app.pe-station),
body.pe-kiosk:has(.pe-app.pe-display),
body.pe-display-page {
  height: 100%;
  max-height: 100dvh;
  overflow: hidden !important;
  overscroll-behavior: none;
  touch-action: manipulation;
}
/* Theme-Wrapper durchreichen, damit .pe-app 100dvh nutzen kann */
body.pe-fullscreen-app:has(.pe-app.pe-kasse) #page,
body.pe-fullscreen-app:has(.pe-app.pe-verkauf) #page,
body.pe-fullscreen-app:has(.pe-app.pe-bestellung) #page,
body.pe-fullscreen-app:has(.pe-app.pe-station) #page,
body.pe-fullscreen-app:has(.pe-app.pe-display) #page,
body.pe-display-page #page,
body.pe-fullscreen-app:has(.pe-app.pe-kasse) .site,
body.pe-fullscreen-app:has(.pe-app.pe-verkauf) .site,
body.pe-fullscreen-app:has(.pe-app.pe-bestellung) .site,
body.pe-fullscreen-app:has(.pe-app.pe-station) .site,
body.pe-fullscreen-app:has(.pe-app.pe-display) .site,
body.pe-display-page .site,
body.pe-fullscreen-app:has(.pe-app.pe-kasse) .site-content,
body.pe-fullscreen-app:has(.pe-app.pe-verkauf) .site-content,
body.pe-fullscreen-app:has(.pe-app.pe-bestellung) .site-content,
body.pe-fullscreen-app:has(.pe-app.pe-station) .site-content,
body.pe-fullscreen-app:has(.pe-app.pe-display) .site-content,
body.pe-display-page .site-content,
body.pe-fullscreen-app:has(.pe-app.pe-kasse) .content-area,
body.pe-fullscreen-app:has(.pe-app.pe-verkauf) .content-area,
body.pe-fullscreen-app:has(.pe-app.pe-bestellung) .content-area,
body.pe-fullscreen-app:has(.pe-app.pe-station) .content-area,
body.pe-fullscreen-app:has(.pe-app.pe-display) .content-area,
body.pe-display-page .content-area,
body.pe-fullscreen-app:has(.pe-app.pe-kasse) article,
body.pe-fullscreen-app:has(.pe-app.pe-verkauf) article,
body.pe-fullscreen-app:has(.pe-app.pe-bestellung) article,
body.pe-fullscreen-app:has(.pe-app.pe-station) article,
body.pe-fullscreen-app:has(.pe-app.pe-display) article,
body.pe-display-page article,
body.pe-fullscreen-app:has(.pe-app.pe-kasse) .entry-content,
body.pe-fullscreen-app:has(.pe-app.pe-verkauf) .entry-content,
body.pe-fullscreen-app:has(.pe-app.pe-bestellung) .entry-content,
body.pe-fullscreen-app:has(.pe-app.pe-station) .entry-content,
body.pe-fullscreen-app:has(.pe-app.pe-display) .entry-content,
body.pe-display-page .entry-content,
body.pe-fullscreen-app:has(.pe-app.pe-kasse) .page-content,
body.pe-fullscreen-app:has(.pe-app.pe-verkauf) .page-content,
body.pe-fullscreen-app:has(.pe-app.pe-bestellung) .page-content,
body.pe-fullscreen-app:has(.pe-app.pe-station) .page-content,
body.pe-fullscreen-app:has(.pe-app.pe-display) .page-content,
body.pe-display-page .page-content,
body.pe-fullscreen-app:has(.pe-app.pe-kasse) .wp-site-blocks,
body.pe-fullscreen-app:has(.pe-app.pe-verkauf) .wp-site-blocks,
body.pe-fullscreen-app:has(.pe-app.pe-bestellung) .wp-site-blocks,
body.pe-fullscreen-app:has(.pe-app.pe-station) .wp-site-blocks,
body.pe-fullscreen-app:has(.pe-app.pe-kasse) .wp-block-post-content,
body.pe-fullscreen-app:has(.pe-app.pe-verkauf) .wp-block-post-content,
body.pe-fullscreen-app:has(.pe-app.pe-bestellung) .wp-block-post-content,
body.pe-fullscreen-app:has(.pe-app.pe-station) .wp-block-post-content {
  height: 100%;
  max-height: 100%;
  min-height: 0;
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  align-items: stretch;
}

.pe-app.pe-kasse,
.pe-app.pe-verkauf,
.pe-app.pe-bestellung,
.pe-app.pe-station,
.pe-app.pe-display,
.pe-app.pe-balance-kiosk {
  width: 100% !important;
  max-width: none !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}
.pe-app.pe-kasse,
.pe-app.pe-verkauf,
.pe-app.pe-bestellung,
.pe-app.pe-station {
  margin: 0 !important;
  height: 100dvh;
  max-height: 100dvh;
  min-height: 0;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  box-sizing: border-box;
  padding: 8px clamp(.5rem, 1.5vw, .85rem) calc(8px + env(safe-area-inset-bottom, 0px));
  touch-action: manipulation;
  width: 100% !important;
  max-width: none !important;
  align-items: stretch !important;
  justify-content: flex-start !important;
}

/* Kiosk/Fullscreen: Theme-Wrapper überspringen — direkt am Viewport */
body.pe-kiosk .pe-app.pe-kasse,
body.pe-kiosk .pe-app.pe-verkauf,
body.pe-fullscreen-app .pe-app.pe-kasse,
body.pe-fullscreen-app .pe-app.pe-verkauf,
body.pe-fullscreen-app .pe-app.pe-bestellung,
body.pe-fullscreen-app .pe-app.pe-station {
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  inset: 0 !important;
  z-index: 100000;
  width: 100vw !important;
  max-width: none !important;
  height: 100dvh !important;
  max-height: 100dvh !important;
  margin: 0 !important;
  transform: none !important;
}
body.admin-bar.pe-fullscreen-app .pe-app.pe-kasse,
body.admin-bar.pe-fullscreen-app .pe-app.pe-verkauf,
body.admin-bar.pe-fullscreen-app .pe-app.pe-bestellung,
body.admin-bar.pe-fullscreen-app .pe-app.pe-station,
body.admin-bar.pe-kiosk .pe-app.pe-kasse,
body.admin-bar.pe-kiosk .pe-app.pe-verkauf {
  top: 32px !important;
  height: calc(100dvh - 32px) !important;
  max-height: calc(100dvh - 32px) !important;
}
@media screen and (max-width: 782px) {
  body.admin-bar.pe-fullscreen-app .pe-app.pe-kasse,
  body.admin-bar.pe-fullscreen-app .pe-app.pe-verkauf,
  body.admin-bar.pe-fullscreen-app .pe-app.pe-bestellung,
  body.admin-bar.pe-fullscreen-app .pe-app.pe-station,
  body.admin-bar.pe-kiosk .pe-app.pe-kasse,
  body.admin-bar.pe-kiosk .pe-app.pe-verkauf {
    top: 46px !important;
    height: calc(100dvh - 46px) !important;
    max-height: calc(100dvh - 46px) !important;
  }
}
body.pe-kiosk:not(.admin-bar) .pe-app.pe-kasse,
body.pe-kiosk:not(.admin-bar) .pe-app.pe-verkauf {
  top: 0 !important;
  height: 100dvh !important;
  max-height: 100dvh !important;
}

/* Alte Layout-Offsets/Zentrierung an POS-Modulen hart überschreiben */
.pe-app.pe-kasse .pe-layout-item,
.pe-app.pe-kasse .pe-kasse-col,
.pe-app.pe-kasse .pe-kasse-workspace,
.pe-app.pe-kasse .pe-card {
  transform: none !important;
  left: auto !important;
  top: auto !important;
  right: auto !important;
  bottom: auto !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  justify-self: stretch !important;
  align-self: stretch !important;
  max-width: 100% !important;
}
.pe-app.pe-kasse .pe-layout-item,
.pe-app.pe-kasse .pe-kasse-action-wrap,
.pe-app.pe-kasse .pe-kasse-workspace,
.pe-app.pe-kasse .pe-kasse-col-scan,
.pe-app.pe-kasse #pe-kasse-scan-card {
  width: 100% !important;
}
.pe-app.pe-kasse > .pe-app-header,
.pe-app.pe-verkauf > .pe-app-header,
.pe-app.pe-bestellung > .pe-app-header,
.pe-app.pe-station > .pe-app-header,
.pe-app.pe-kasse > .pe-layout-item[data-pe-module="header"],
.pe-app.pe-verkauf > .pe-layout-item[data-pe-module="header"],
.pe-app.pe-bestellung > .pe-layout-item[data-pe-module="header"],
.pe-app.pe-station > .pe-layout-item[data-pe-module="header"] {
  flex: 0 0 auto;
  margin-bottom: .45rem;
  order: 0 !important;
  position: relative;
  z-index: 5;
  overflow: visible;
}
.pe-app.pe-verkauf > .pe-layout-item[data-pe-module="header"] .pe-app-header {
  overflow: visible;
  margin-bottom: 0;
}
/* Verkauf: Stand-Auswahl in der Kopfzeile (nicht unten) */
.pe-verkauf-stand-label {
  display: inline-flex;
  align-items: center;
  margin: 0;
  min-width: 0;
  flex: 0 1 auto;
  max-width: min(220px, 42vw);
}
.pe-verkauf-register-select {
  min-height: 40px;
  height: 40px;
  margin: 0;
  width: 100%;
  max-width: 220px;
  padding-top: 0;
  padding-bottom: 0;
}
.pe-app.pe-verkauf > .pe-layout-item,
.pe-app.pe-verkauf > .pe-verkauf-layout {
  order: 0 !important;
}
/* Storno-Modal: kein Platz im Flex-Layout, immer über der Oberfläche */
.pe-app.pe-verkauf > .pe-layout-item[data-pe-module="storno_modal"] {
  position: static !important;
  flex: 0 0 0 !important;
  width: 0 !important;
  height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  min-height: 0 !important;
  border: 0 !important;
}
.pe-app.pe-verkauf .pe-verkauf-layout {
  flex: 1 1 auto;
  min-height: 0;
  overflow: hidden;
}
.pe-kasse .pe-pos-body,
.pe-verkauf .pe-verkauf-layout,
.pe-bestellung .pe-bestellung-layout,
.pe-station .pe-pos-body {
  flex: 1 1 auto;
  min-height: 0;
  overflow: hidden;
}

/* Kasse: Aktionsleiste oben, Workspace darunter — volle Breite, kein künstlicher Leerraum */
.pe-kasse .pe-pos-body {
  display: flex;
  flex-direction: column;
  gap: clamp(.35rem, 1vw, .55rem);
  overflow: hidden;
  min-height: 0;
  flex: 1 1 auto;
  width: 100%;
  max-width: none;
  align-items: stretch;
  justify-content: flex-start;
}
.pe-kasse .pe-kasse-action-wrap,
.pe-kasse .pe-layout-item[data-pe-module="actions"] {
  flex: 0 0 auto;
  width: 100%;
  min-width: 0;
  margin: 0;
}
.pe-kasse .pe-kasse-actions {
  flex: 0 0 auto;
  margin: 0 !important;
  width: 100%;
  padding: .45rem .55rem;
}
.pe-kasse .pe-kasse-actions-title,
.pe-kasse .pe-kasse-actions > h2 {
  position: static;
  width: auto;
  height: auto;
  overflow: visible;
  clip: auto;
  white-space: nowrap;
  margin: 0 0 .4rem;
  font-size: .78rem;
  font-weight: 700;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: var(--pe-muted);
}
.pe-kasse-actions .pe-btn-group,
.pe-kasse-action-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .45rem;
  width: 100%;
}
@media (min-width: 700px) {
  .pe-kasse-action-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}
@media (min-width: 1100px) and (min-height: 640px) {
  .pe-kasse-action-grid {
    grid-template-columns: repeat(6, minmax(0, 1fr));
  }
}
.pe-kasse-actions .pe-btn-group .pe-btn,
.pe-kasse-action-grid .pe-btn {
  width: 100%;
  max-width: 100%;
  min-height: 52px;
  white-space: normal;
  text-align: center;
  line-height: 1.15;
  padding: .5rem .55rem;
  font-weight: 700;
  font-size: clamp(0.88rem, 1.6vh, 1.02rem);
}
.pe-kasse-action-payout {
  background: var(--pe-danger);
  color: #fff;
  border: 0;
}
.pe-kasse-action-payout:hover {
  background: var(--pe-danger-hover);
  color: #fff;
}
.pe-kasse-action-storno {
  background: var(--pe-surface);
  color: var(--pe-danger);
  border: 2px solid var(--pe-danger);
}
.pe-kasse-action-storno:hover {
  background: var(--pe-error-bg);
  color: var(--pe-danger);
}
.pe-kasse .pe-kasse-workspace {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: clamp(.35rem, 1vw, .55rem);
  flex: 1 1 auto;
  min-height: 0;
  min-width: 0;
  width: 100% !important;
  max-width: none !important;
  align-content: start;
  align-items: stretch;
  justify-items: stretch;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior: contain;
}
/* Zweite Spalte nur wenn Aufladen/Payout/… sichtbar — sonst volle Breite für Scan */
@media (min-width: 1200px) {
  .pe-kasse .pe-kasse-workspace:has(#pe-kasse-topup-card:not([hidden])),
  .pe-kasse .pe-kasse-workspace:has(#pe-kasse-payout-card:not([hidden])),
  .pe-kasse .pe-kasse-workspace:has(#pe-kasse-storno-card:not([hidden])),
  .pe-kasse .pe-kasse-workspace:has(#pe-kasse-closing-card:not([hidden])) {
    grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr);
    overflow: hidden;
  }
  .pe-kasse .pe-kasse-workspace:has(#pe-kasse-topup-card:not([hidden])) .pe-kasse-col-scan,
  .pe-kasse .pe-kasse-workspace:has(#pe-kasse-topup-card:not([hidden])) .pe-kasse-col-ops,
  .pe-kasse .pe-kasse-workspace:has(#pe-kasse-payout-card:not([hidden])) .pe-kasse-col-scan,
  .pe-kasse .pe-kasse-workspace:has(#pe-kasse-payout-card:not([hidden])) .pe-kasse-col-ops {
    height: 100%;
    max-height: 100%;
    overflow: auto;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior: contain;
  }
  .pe-kasse .pe-quick-amounts {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: .35rem;
  }
  .pe-kasse .pe-quick-amounts .pe-quick-amt:nth-child(7) {
    grid-column: span 2;
  }
  .pe-kasse .pe-quick-amt-custom {
    grid-column: 1 / -1;
  }
}

.pe-kasse .pe-kasse-col {
  display: flex;
  flex-direction: column;
  gap: .4rem;
  min-height: 0;
  min-width: 0;
  width: 100%;
}
.pe-kasse .pe-kasse-col-scan {
  flex: 1 1 auto;
}
.pe-kasse .pe-kasse-col-ops {
  flex: 0 1 auto;
  min-height: 0;
}
.pe-kasse .pe-kasse-col > .pe-card,
.pe-kasse .pe-kasse-col > .pe-box,
.pe-kasse .pe-kasse-col > .pe-layout-item {
  flex: 0 0 auto;
  margin-bottom: 0;
  width: 100%;
  max-width: 100%;
  min-width: 0;
}
.pe-kasse #pe-kasse-scan-card {
  flex: 1 1 auto;
  min-height: 0;
  width: 100%;
  max-width: 100%;
  display: flex;
  flex-direction: column;
  gap: clamp(4px, 0.5vh, 10px);
  padding: clamp(0.55rem, 1.1vh, 0.9rem) clamp(0.65rem, 1.2vw, 1rem);
}
/* Theme-Overrides: [hidden] muss greifen (sonst „Geister“-Buttons / schwarze Videofläche) */
.pe-app.pe-kasse [hidden] {
  display: none !important;
}
.pe-kasse-scan-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: clamp(6px, 0.8vw, 12px);
  flex-wrap: wrap;
  margin: 0;
}
.pe-kasse-scan-head h2 {
  margin: 0;
  font-size: clamp(1.05rem, 1.6vw, 1.25rem);
  line-height: 1.2;
}
.pe-kasse .pe-kasse-scan-hint {
  margin: 0;
  font-size: clamp(0.78rem, 1.1vw, 0.9rem);
}
.pe-kasse #pe-kasse-scan-card > .pe-scan-row {
  margin: 0;
}
.pe-kasse #pe-kasse-scan-card > .pe-kasse-return-bar {
  margin: 0;
}

/* Kamera-Overlay: 0 Layout-Höhe wenn aus; fixed Dialog wenn an */
.pe-kasse-camera-overlay[hidden] {
  display: none !important;
}
.pe-kasse-camera-overlay {
  position: fixed;
  inset: 0;
  z-index: 1000050;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: max(0.75rem, env(safe-area-inset-top, 0px))
           max(0.75rem, env(safe-area-inset-right, 0px))
           max(0.75rem, env(safe-area-inset-bottom, 0px))
           max(0.75rem, env(safe-area-inset-left, 0px));
  background: rgba(18, 20, 26, 0.72);
  box-sizing: border-box;
}
.pe-kasse-camera-dialog {
  width: min(100%, 520px);
  max-height: min(92dvh, 720px);
  display: flex;
  flex-direction: column;
  gap: 0.55rem;
  padding: 0.85rem 1rem 1rem;
  border-radius: var(--pe-radius, 12px);
  background: var(--pe-surface, #fff);
  color: var(--pe-text, #1a1a1a);
  border: 1px solid var(--pe-line, #ddd);
  box-shadow: 0 18px 48px rgba(0, 0, 0, 0.35);
}
.pe-kasse-camera-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
}
.pe-kasse-camera-toolbar h3 {
  margin: 0;
  font-size: 1.15rem;
  line-height: 1.2;
}
.pe-kasse-camera-hint {
  margin: 0;
}
.pe-kasse-camera-video,
.pe-kasse .pe-kasse-camera-video {
  display: block;
  width: 100%;
  max-height: min(58dvh, 420px);
  min-height: 180px;
  margin: 0;
  border-radius: 12px;
  background: #000;
  object-fit: cover;
}
.pe-kasse #pe-kasse-topup-card {
  flex: 0 0 auto;
  width: 100%;
}
.pe-kasse .pe-input,
.pe-kasse .pe-btn,
.pe-kasse .pe-quick-amt {
  max-width: 100%;
}
.pe-kasse .pe-scan-row {
  display: flex;
  flex-wrap: wrap;
  gap: .5rem;
  align-items: stretch;
  margin: .5rem 0;
}
.pe-kasse .pe-scan-row .pe-input {
  flex: 1 1 12rem;
  min-width: 0;
  min-height: 44px;
}
.pe-kasse .pe-scan-row .pe-btn {
  flex: 0 1 auto;
  min-height: 44px;
}
.pe-kasse-return-bar {
  margin: .45rem 0;
  display: flex;
  flex-wrap: wrap;
  gap: .4rem;
  align-items: center;
}
.pe-kasse-return-bar .pe-btn {
  min-height: 44px;
}
.pe-kasse-deposit-actions,
.pe-kasse-status-actions {
  display: flex;
  flex-wrap: wrap;
  gap: .4rem;
}
.pe-kasse-deposit-actions .pe-btn,
.pe-kasse-status-actions .pe-btn {
  flex: 1 1 auto;
  min-height: 44px;
  min-width: min(100%, 9rem);
}

/* Mittlere Displays: Aktionen 2×2, Workspace gestapelt */
@media (max-width: 1199px) {
  .pe-kasse-actions .pe-btn-group {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

/* Schmale Displays */
@media (max-width: 640px) {
  .pe-kasse-actions .pe-btn-group {
    grid-template-columns: minmax(0, 1fr);
  }
  .pe-kasse .pe-scan-row .pe-btn {
    flex: 1 1 100%;
  }
}

/* Flache Monitore (z. B. 1366×768): kompakter, Kernfunktionen sichtbar */
@media (max-height: 800px) and (min-width: 700px) {
  .pe-app.pe-kasse {
    padding: .3rem .45rem calc(.3rem + env(safe-area-inset-bottom, 0px));
  }
  .pe-kasse .pe-app-header {
    padding: .3rem .45rem;
    margin-bottom: .3rem;
    gap: .3rem;
  }
  .pe-kasse .pe-app-header h1 {
    font-size: 1rem;
  }
  .pe-kasse .pe-app-header .pe-btn {
    min-height: 36px;
    padding: .25rem .4rem;
    font-size: .78rem;
  }
  .pe-kasse-actions .pe-btn-group .pe-btn {
    min-height: 40px;
    font-size: .82rem;
    padding: .3rem .35rem;
  }
  .pe-kasse #pe-kasse-scan-card .pe-hint-desktop,
  .pe-kasse #pe-kasse-scan-card .pe-hint-mobile,
  .pe-kasse #pe-kasse-topup-card .pe-hint-desktop,
  .pe-kasse #pe-kasse-topup-card .pe-hint-mobile {
    display: none !important;
  }
  .pe-kasse .pe-scan-log {
    max-height: 2.4rem;
    font-size: .75rem;
  }
  .pe-kasse-camera-btn {
    min-height: 40px;
    margin: 0;
  }
}

/* Listen intern scrollen, Seite nicht */
.pe-kasse #pe-kasse-storno-list,
.pe-kasse #pe-kasse-closing-output {
  max-height: min(40vh, 280px);
  overflow-y: auto;
  overscroll-behavior: contain;
}

/* Legacy: alte Landscape-Zweispaltigkeit deaktivieren (durch Workspace ersetzt) */
@media (orientation: landscape) and (min-width: 700px),
       (min-width: 1024px) and (max-height: 900px) {
  .pe-kasse .pe-pos-body {
    display: flex;
    flex-direction: column;
    grid-template-columns: none;
  }
}

/* iPhone / Mobile Portrait: Viewport füllen, kein Seiten-Scroll */
@media (max-width: 768px) and (orientation: portrait) {
  html:has(.pe-app.pe-kasse),
  body.pe-fullscreen-app:has(.pe-app.pe-kasse),
  body.pe-kiosk:has(.pe-app.pe-kasse) {
    height: 100%;
    max-height: 100dvh;
    overflow: hidden !important;
  }
  .pe-app.pe-kasse {
    height: 100dvh;
    max-height: 100dvh;
    min-height: 0;
    padding: .25rem .4rem calc(.25rem + env(safe-area-inset-bottom, 0px));
    overflow: hidden;
  }
  .pe-kasse .pe-app-header {
    gap: .25rem;
    padding: .3rem .4rem;
    margin: max(.15rem, env(safe-area-inset-top, 0px)) 0 .25rem;
    flex-wrap: nowrap;
  }
  body.pe-pos-kiosk .pe-kasse .pe-app-header {
    margin-top: env(safe-area-inset-top, 0px);
  }
  .pe-kasse .pe-app-header h1 {
    font-size: .95rem;
  }
  .pe-kasse .pe-app-header .pe-btn {
    min-height: 32px;
    padding: .2rem .35rem;
    font-size: .75rem;
  }
  .pe-kasse .pe-app-header .pe-badge {
    display: none;
  }
  .pe-kasse .pe-pos-body {
    display: flex;
    flex-direction: column;
    gap: .3rem;
    overflow: hidden;
    min-height: 0;
  }
  .pe-kasse .pe-kasse-workspace {
    flex: 1 1 auto;
    min-height: 0;
    overflow: auto;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior: contain;
    grid-template-columns: minmax(0, 1fr);
  }
  .pe-kasse .pe-kasse-col-scan,
  .pe-kasse .pe-kasse-col-ops {
    flex: 0 1 auto;
    max-height: none;
    min-height: 0;
    overflow: visible;
  }
  .pe-kasse .pe-card {
    padding: .45rem .55rem;
    margin-bottom: 0;
    border-radius: 10px;
  }
  .pe-kasse .pe-card h2 {
    font-size: .88rem;
    margin: 0 0 .25rem;
  }
  .pe-kasse #pe-kasse-scan-card .pe-hint-desktop,
  .pe-kasse #pe-kasse-scan-card .pe-hint-mobile,
  .pe-kasse #pe-kasse-topup-card .pe-hint-desktop,
  .pe-kasse #pe-kasse-topup-card .pe-hint-mobile,
  .pe-kasse .pe-scan-log,
  .pe-kasse .pe-topup-qr-block,
  .pe-kasse .pe-kasse-actions h2 {
    display: none !important;
  }
  .pe-kasse-camera-btn {
    min-height: 38px;
    margin: 0;
    font-size: .9rem;
  }
  .pe-kasse .pe-scan-row {
    margin: .15rem 0;
    flex-direction: row;
    align-items: stretch;
    gap: .35rem;
  }
  .pe-kasse .pe-scan-row .pe-input {
    min-height: 40px;
    flex: 1 1 auto;
  }
  .pe-kasse .pe-scan-row .pe-btn {
    width: auto;
    min-width: 4.5rem;
    min-height: 40px;
  }
  .pe-kasse-return-bar {
    margin: .2rem 0;
    gap: .25rem;
  }
  .pe-kasse-return-bar .pe-btn {
    min-height: 34px;
    font-size: .75rem;
    padding: .2rem .4rem;
  }
  .pe-kasse .pe-card-info {
    font-size: .88rem;
    padding: .4rem .5rem;
    margin: .2rem 0;
  }
  .pe-kasse .pe-quick-amounts {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: .25rem;
    margin-bottom: .3rem;
  }
  .pe-kasse .pe-quick-amt {
    min-height: 40px;
    padding: .2rem .1rem;
    font-size: .9rem;
  }
  .pe-kasse .pe-quick-amounts .pe-quick-amt:nth-child(7) {
    grid-column: span 2;
  }
  .pe-kasse-amount-label {
    margin-bottom: .15rem;
    font-size: .82rem;
  }
  .pe-kasse #pe-kasse-amount {
    min-height: 40px;
  }
  .pe-kasse #pe-kasse-topup-btn {
    min-height: 42px;
    font-size: 1rem;
  }
  .pe-kasse .pe-kasse-actions {
    margin-top: 0;
  }
  .pe-kasse-actions .pe-btn-group,
  .pe-kasse-action-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: .4rem;
  }
  .pe-kasse-actions .pe-btn-group .pe-btn,
  .pe-kasse-action-grid .pe-btn {
    min-height: 48px;
    font-size: .88rem;
    padding: .4rem .4rem;
  }
  .pe-kasse-deposit-actions .pe-btn,
  .pe-kasse-status-actions .pe-btn {
    min-height: 36px;
    font-size: .8rem;
  }
}

/* iPhone Querformat: 2 Spalten wie Kassen-PC */
@media (max-width: 900px) and (orientation: landscape) {
  .pe-app.pe-kasse {
    padding: .2rem .35rem calc(.2rem + env(safe-area-inset-bottom, 0px));
  }
  body.pe-kiosk .pe-kasse .pe-app-header {
    margin-top: max(.2rem, env(safe-area-inset-top, 0px));
  }
  .pe-kasse .pe-app-header .pe-badge,
  .pe-kasse .pe-scan-log,
  .pe-kasse .pe-topup-qr-block,
  .pe-kasse .pe-kasse-actions h2 {
    display: none !important;
  }
  .pe-kasse-camera-btn {
    min-height: 34px;
    margin: 0;
    font-size: .82rem;
  }
}

/* Verkauf / Bestellkasse: Produkte + Warenkorb — POS-Viewport */
.pe-verkauf-layout,
.pe-bestellung-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(280px, 28%);
  gap: clamp(.4rem, 1vw, .75rem);
  align-content: stretch;
  align-items: stretch;
  justify-content: flex-start;
  width: 100%;
  min-width: 0;
  flex: 1 1 auto;
  min-height: 0;
  height: 100%;
  overflow: hidden;
}
@media (max-width: 1100px) and (min-width: 901px) {
  .pe-verkauf-layout,
  .pe-bestellung-layout {
    grid-template-columns: minmax(0, 1fr) minmax(260px, 32%);
  }
}
@media (max-width: 900px) {
  .pe-verkauf-layout,
  .pe-bestellung-layout {
    grid-template-columns: minmax(0, 1fr);
    overflow: auto;
    height: auto;
  }
}

/* Layout-Items im Verkauf: Höhe weiterreichen (Registry-Wrapper) */
.pe-verkauf .pe-verkauf-layout > .pe-layout-item,
.pe-bestellung .pe-bestellung-layout > .pe-layout-item {
  min-height: 0;
  height: 100%;
  max-height: 100%;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
.pe-verkauf .pe-verkauf-layout > .pe-layout-item > .pe-card,
.pe-bestellung .pe-bestellung-layout > .pe-layout-item > .pe-card {
  flex: 1 1 auto;
  min-height: 0;
  height: 100%;
  width: 100%;
  margin: 0;
}

.pe-verkauf .pe-products-panel,
.pe-bestellung .pe-bestellung-products,
.pe-verkauf .pe-cart-panel,
.pe-bestellung .pe-bestellung-cart {
  min-height: 0;
  margin-bottom: 0;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  padding: clamp(0.55rem, 1vh, 0.85rem) clamp(0.55rem, 1vw, 0.9rem);
}
.pe-verkauf .pe-products-panel > h2,
.pe-bestellung .pe-bestellung-products > h2,
.pe-verkauf .pe-cart-panel > h2,
.pe-verkauf .pe-cart-heading,
.pe-bestellung .pe-bestellung-cart > h2 {
  flex: 0 0 auto;
  margin: 0 0 clamp(0.35rem, 0.8vh, 0.6rem);
}
.pe-verkauf .pe-cart-heading {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0.15rem;
  line-height: 1.15;
}
.pe-verkauf .pe-cart-heading-label {
  font-size: clamp(0.85rem, 1.2vw, 1rem);
  font-weight: 600;
  opacity: 0.85;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
.pe-verkauf .pe-cart-total {
  font-size: clamp(1.55rem, 2.8vw, 2.1rem);
  font-weight: 800;
  color: var(--pe-text, #1a1a1a);
}
.pe-verkauf .pe-product-grid,
.pe-bestellung .pe-order-product-grid,
.pe-bestellung #pe-order-product-grid {
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior: contain;
  align-content: start;
  /* Größere POS-Kacheln; bei wenigen Produkten nicht überdehnen */
  grid-template-columns: repeat(auto-fill, minmax(clamp(130px, 11.5vw, 180px), 1fr));
  gap: clamp(0.45rem, 0.9vw, 0.8rem);
  padding: 0.1rem;
}
.pe-verkauf .pe-product-tile {
  min-height: clamp(118px, 15vh, 158px);
  padding: clamp(0.55rem, 1.1vh, 0.9rem) clamp(0.4rem, 0.7vw, 0.7rem);
  gap: 0.35rem;
  border-radius: 14px;
  border-color: var(--pe-line, #d0d9e4);
  background: var(--pe-surface, #fff);
  color: var(--pe-text, #1a1a1a);
  box-shadow: 0 1px 2px rgba(28, 29, 35, 0.04);
}
.pe-verkauf .pe-product-emoji {
  font-size: clamp(1.7rem, 3.2vw, 2.45rem);
  line-height: 1;
}
.pe-verkauf .pe-product-name {
  font-size: clamp(0.92rem, 1.35vw, 1.12rem);
  font-weight: 650;
  text-align: center;
  line-height: 1.25;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  max-width: 100%;
}
.pe-verkauf .pe-product-price {
  margin-top: auto;
  font-size: clamp(1.05rem, 1.7vw, 1.3rem);
  font-weight: 800;
  letter-spacing: -0.01em;
}
.pe-verkauf .pe-cart-list,
.pe-bestellung .pe-cart-list,
#pe-order-cart-list {
  flex: 1 1 auto;
  min-height: 0;
  max-height: none;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior: contain;
  margin: 0 0 0.45rem;
}
.pe-verkauf .pe-cart-footer {
  flex: 0 0 auto;
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
  margin-top: auto;
  padding-top: 0.35rem;
  border-top: 1px solid var(--pe-line, rgba(0, 0, 0, 0.08));
}
.pe-verkauf .pe-cart-footer > .pe-hint {
  margin: 0;
  font-size: 0.8rem;
}
.pe-verkauf .pe-cart-footer .pe-scan-row {
  margin: 0;
}
.pe-verkauf .pe-cart-footer .pe-scan-target {
  min-height: 48px;
  font-size: 1rem;
}
.pe-verkauf #pe-verkauf-checkout {
  width: 100%;
  min-height: clamp(48px, 6.5vh, 56px);
  font-size: clamp(1rem, 1.5vw, 1.15rem);
  font-weight: 700;
  margin: 0;
  border-radius: 12px;
}
.pe-verkauf .pe-cart-panel > .pe-scan-row,
.pe-verkauf .pe-cart-panel > .pe-hint,
.pe-verkauf .pe-cart-panel > .pe-btn,
.pe-verkauf .pe-cart-panel > .pe-box,
.pe-bestellung .pe-bestellung-cart > .pe-scan-row,
.pe-bestellung .pe-bestellung-cart > .pe-hint,
.pe-bestellung .pe-bestellung-cart > .pe-btn,
.pe-bestellung .pe-bestellung-cart > .pe-box {
  flex: 0 0 auto;
}
.pe-verkauf > .pe-card:not(.pe-products-panel):not(.pe-cart-panel) {
  flex: 0 0 auto;
  margin-bottom: .45rem;
}

/* Station: Spalten füllen Viewport, Listen innen scrollen */
.pe-app.pe-station {
  display: flex;
  flex-direction: column;
  min-height: 0;
  height: 100dvh;
  max-height: 100dvh;
  overflow: hidden;
}
.pe-app.pe-station > .pe-app-header,
.pe-app.pe-station > .pe-layout-item[data-pe-module="header"] {
  flex: 0 0 auto;
}
.pe-station .pe-pos-body {
  display: flex;
  flex-direction: column;
  gap: clamp(0.25rem, 0.6vh, 0.45rem);
  flex: 1 1 auto;
  min-height: 0;
  overflow: hidden;
  width: 100%;
}
.pe-station .pe-pos-body > .pe-layout-item:not([data-pe-module="queue"]),
.pe-station .pe-station-toolbar,
.pe-station .pe-station-scan,
.pe-station .pe-pos-body > .pe-hint,
.pe-station .pe-station-scan-hint,
.pe-station .pe-station-refund {
  flex: 0 0 auto;
  margin-bottom: 0;
  min-height: 0;
}
.pe-station .pe-pos-body > .pe-layout-item[data-pe-module="queue"] {
  flex: 1 1 auto;
  min-height: 0;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
.pe-station .pe-pos-body > .pe-layout-item[data-pe-module="queue"] > .pe-station-columns {
  flex: 1 1 auto;
  min-height: 0;
  height: 100%;
}
.pe-station .pe-station-columns {
  flex: 1 1 auto;
  min-height: 0;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(0.4rem, 0.8vw, 0.65rem);
  overflow: hidden;
}
.pe-station .pe-station-col {
  min-height: 0;
  margin-bottom: 0;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
.pe-station .pe-station-col > h2,
.pe-station .pe-station-col-head {
  flex: 0 0 auto;
}
.pe-station .pe-station-list {
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior: contain;
}

/* Kiosk: Station denser */
html.pe-pos-kiosk-pref .pe-station .pe-pos-body,
body.pe-pos-kiosk .pe-station .pe-pos-body,
body.pe-kiosk .pe-station .pe-pos-body {
  padding: 0.2rem max(0.4rem, env(safe-area-inset-right, 0px))
           max(0.3rem, env(safe-area-inset-bottom, 0px))
           max(0.4rem, env(safe-area-inset-left, 0px));
  gap: clamp(3px, 0.45vh, 6px);
}
html.pe-pos-kiosk-pref .pe-station .pe-station-toolbar,
body.pe-pos-kiosk .pe-station .pe-station-toolbar,
body.pe-kiosk .pe-station .pe-station-toolbar {
  padding: 0.3rem 0.45rem !important;
}
html.pe-pos-kiosk-pref .pe-station .pe-station-scan-hint,
body.pe-pos-kiosk .pe-station .pe-station-scan-hint,
body.pe-kiosk .pe-station .pe-station-scan-hint {
  display: none;
}
html.pe-pos-kiosk-pref .pe-station .pe-app-header > a.pe-btn[href*="portal"],
body.pe-pos-kiosk .pe-station .pe-app-header > a.pe-btn[href*="portal"] {
  display: none;
}

@media (max-width: 900px) {
  .pe-app.pe-station {
    height: auto;
    max-height: none;
    overflow: visible;
  }
  .pe-station .pe-pos-body {
    overflow: auto;
    height: auto;
    flex: 1 1 auto;
  }
  .pe-station .pe-pos-body > .pe-layout-item[data-pe-module="queue"] {
    flex: 0 0 auto;
    overflow: visible;
    height: auto;
  }
  .pe-station .pe-station-columns {
    overflow: visible;
    height: auto;
    flex: 0 0 auto;
  }
}

.pe-kasse .pe-scan-target:focus,
.pe-verkauf .pe-scan-target:focus,
.pe-station .pe-scan-target:focus {
  outline: 2px solid var(--pe-accent, #b8960c);
  outline-offset: 2px;
  box-shadow: 0 0 0 3px rgba(184, 150, 12, .25);
}

/* Kompakt: alles möglichst auf einen Bildschirm */
@media (max-height: 920px), ((hover: none) and (pointer: coarse)) {
  .pe-app.pe-kasse {
    padding: .45rem .55rem calc(.75rem + env(safe-area-inset-bottom, 0px));
  }
  .pe-kasse .pe-app-header {
    gap: .35rem;
    padding: .45rem .55rem;
    margin: 0 0 .45rem;
    flex-wrap: wrap;
  }
  body.pe-kiosk .pe-kasse .pe-app-header {
    margin-top: 0;
  }
  .pe-kasse .pe-app-header h1 {
    font-size: 1.05rem;
    margin: 0;
  }
  .pe-kasse .pe-app-header .pe-btn {
    min-height: 36px;
    padding: .3rem .45rem;
    font-size: .82rem;
  }
  .pe-kasse .pe-card {
    padding: .55rem .65rem;
    margin-bottom: .45rem;
    border-radius: 12px;
  }
  .pe-kasse .pe-card h2 {
    font-size: .95rem;
    margin: 0 0 .4rem;
  }
  .pe-kasse .pe-hint {
    font-size: .78rem;
    margin: .2rem 0;
    line-height: 1.3;
  }
  .pe-kasse #pe-kasse-scan-card .pe-hint-desktop,
  .pe-kasse #pe-kasse-scan-card .pe-hint-mobile {
    display: none !important;
  }
  .pe-kasse .pe-scan-row {
    margin: .25rem 0;
  }
  .pe-kasse .pe-scan-row .pe-input {
    min-height: 44px;
    font-size: 16px !important;
  }
  .pe-kasse-return-bar {
    margin: .35rem 0 !important;
  }
  .pe-kasse-return-bar .pe-btn {
    min-height: 40px;
    font-size: .85rem;
  }
  .pe-scan-log {
    max-height: 3.6rem;
    margin: .25rem 0 0;
    font-size: .78rem;
  }
  .pe-kasse .pe-card-info {
    font-size: .95rem;
    padding: .55rem .65rem;
    margin: .35rem 0;
  }
  .pe-kasse .pe-quick-amounts {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: .35rem;
    margin-bottom: .5rem;
  }
  .pe-kasse .pe-quick-amt {
    min-height: 46px;
    padding: .35rem .2rem;
    font-size: 1rem;
    border-radius: 10px;
  }
  .pe-kasse .pe-quick-amounts .pe-quick-amt:nth-child(7) {
    grid-column: span 2;
  }
  .pe-kasse-amount-label {
    margin-bottom: .25rem;
    font-size: .88rem;
  }
  .pe-kasse #pe-kasse-topup-btn {
    min-height: 48px;
    font-size: 1.05rem;
    position: static;
  }
  .pe-kasse-actions .pe-btn-group,
  .pe-kasse-action-grid {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: .4rem;
  }
  .pe-kasse-actions .pe-btn-group .pe-btn,
  .pe-kasse-action-grid .pe-btn {
    min-height: 48px;
    font-size: .9rem;
    padding: .4rem .45rem;
  }
  }
  .pe-kasse .pe-topup-qr-block {
    margin-top: .5rem;
    padding-top: .45rem;
  }
  .pe-kasse-deposit-actions,
  .pe-kasse-status-actions {
    gap: .35rem;
    margin: .35rem 0;
  }
  .pe-kasse-deposit-actions .pe-btn,
  .pe-kasse-status-actions .pe-btn {
    min-height: 40px;
    font-size: .85rem;
  }
}

/* POS-Monitor: Kamera-Button kompakt neben Überschrift */
.pe-kasse-camera-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: auto !important;
  margin: 0 !important;
}

/* Kasse / Verkauf — Mobile & Touch (Viewport-Fill, kein Seiten-Scroll) */
@media (max-width: 768px) {
  body.pe-kiosk .pe-app.pe-kasse,
  body.pe-kiosk .pe-app.pe-verkauf,
  body.pe-kiosk .pe-app.pe-bestellung,
  body.pe-kiosk .pe-app.pe-station {
    padding: .45rem .5rem calc(.45rem + env(safe-area-inset-bottom, 0px));
    max-width: 100%;
  }

  body.pe-kiosk .pe-kiosk-exit {
    top: max(6px, env(safe-area-inset-top, 0px));
    right: max(6px, env(safe-area-inset-right, 0px));
    padding: .4rem .7rem;
    font-size: .82rem;
    min-height: 36px;
    z-index: 40;
  }

  .pe-kasse .pe-app-header,
  .pe-verkauf .pe-app-header,
  .pe-bestellung .pe-app-header,
  .pe-station .pe-app-header {
    gap: .35rem;
    padding: .45rem .55rem;
    margin-bottom: .4rem;
    margin-top: 0;
  }
  .pe-kasse .pe-app-header h1,
  .pe-verkauf .pe-app-header h1,
  .pe-bestellung .pe-app-header h1,
  .pe-station .pe-app-header h1 { font-size: 1.05rem; flex: 1 1 auto; }
  .pe-kasse .pe-app-header .pe-badge,
  .pe-verkauf .pe-app-header .pe-badge,
  .pe-bestellung .pe-app-header .pe-badge,
  .pe-station .pe-app-header .pe-badge {
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .pe-kasse .pe-card,
  .pe-verkauf .pe-card,
  .pe-bestellung .pe-card {
    padding: .65rem .7rem;
    margin-bottom: .45rem;
    border-radius: 12px;
  }
  .pe-kasse .pe-card h2,
  .pe-verkauf .pe-card h2,
  .pe-bestellung .pe-card h2 { font-size: 1rem; margin: 0 0 .45rem; }

  .pe-hint-desktop { display: none !important; }
  p.pe-hint-mobile { display: block; }
  span.pe-hint-mobile { display: inline; }

  /* Kein iOS-Zoom beim Tippen */
  .pe-kasse .pe-input,
  .pe-verkauf .pe-input,
  .pe-bestellung .pe-input,
  .pe-station .pe-input,
  .pe-kasse input[type=text],
  .pe-kasse input[type=number],
  .pe-verkauf input[type=text],
  .pe-verkauf select,
  .pe-bestellung input[type=text],
  .pe-station select {
    font-size: 16px !important;
    min-height: 44px;
  }

  .pe-scan-row {
    flex-direction: column;
    align-items: stretch;
    gap: .4rem;
  }
  .pe-scan-row .pe-btn {
    width: 100%;
    min-height: 44px;
  }

  .pe-kasse-camera-btn {
    min-height: 44px;
    font-size: 1rem;
    margin: 0 !important;
  }
  .pe-kasse-camera-video,
  .pe-kasse .pe-kasse-camera-video {
    max-height: min(52dvh, 360px);
    min-height: 160px;
    border-radius: 12px;
  }
  .pe-camera:not(.pe-kasse-camera-video) {
    max-height: min(28vh, 220px);
    border-radius: 12px;
  }

  .pe-card-info {
    font-size: .95rem;
    line-height: 1.35;
    padding: .65rem;
  }

  .pe-kasse .pe-quick-amounts {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: .35rem;
    margin-bottom: .5rem;
  }
  .pe-kasse .pe-quick-amt {
    min-height: 48px;
    padding: .4rem .2rem;
    font-size: 1rem;
    font-weight: 700;
    border-radius: 10px;
  }
  .pe-kasse .pe-quick-amounts .pe-quick-amt:nth-child(7) {
    grid-column: span 2;
  }

  .pe-kasse-amount-label { display: block; margin-bottom: .25rem; font-weight: 600; }
  .pe-kasse #pe-kasse-topup-btn,
  .pe-verkauf #pe-verkauf-checkout,
  .pe-bestellung #pe-order-checkout {
    min-height: 48px;
    font-size: 1.05rem;
    border-radius: 12px;
    position: static;
  }

  .pe-kasse-actions .pe-btn-group,
  .pe-kasse-action-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: .4rem;
  }
  .pe-kasse-actions .pe-btn-group .pe-btn,
  .pe-kasse-action-grid .pe-btn {
    width: 100%;
    min-height: 48px;
    border-radius: 10px;
    font-size: .92rem;
  }

  /* Verkauf/Bestellung mobil: Produkte oben scrollen, Warenkorb unten fix */
  .pe-verkauf-layout,
  .pe-bestellung-layout {
    display: flex;
    flex-direction: column;
    gap: .45rem;
    overflow: hidden;
    height: auto;
    min-height: 0;
    flex: 1 1 auto;
  }
  .pe-verkauf .pe-verkauf-layout > .pe-layout-item[data-pe-module="products"],
  .pe-bestellung .pe-bestellung-layout > .pe-layout-item[data-pe-module="products"] {
    order: 1;
    flex: 1 1 auto;
    min-height: 0;
    height: auto;
    max-height: none;
  }
  .pe-verkauf .pe-verkauf-layout > .pe-layout-item[data-pe-module="cart"],
  .pe-bestellung .pe-bestellung-layout > .pe-layout-item[data-pe-module="cart"] {
    order: 2;
    flex: 0 0 auto;
    height: auto;
    max-height: min(46vh, 380px);
  }
  .pe-verkauf .pe-products-panel,
  .pe-bestellung .pe-bestellung-products {
    order: 1;
    flex: 1 1 auto;
    min-height: 0;
    overflow: hidden;
  }
  .pe-verkauf .pe-cart-panel,
  .pe-bestellung .pe-bestellung-cart {
    order: 2;
    flex: 0 0 auto;
    max-height: min(46vh, 380px);
    position: static;
    z-index: auto;
    margin-bottom: 0;
    border-radius: 12px;
    box-shadow: none;
    overflow: hidden;
    padding-bottom: .55rem;
  }
  .pe-verkauf .pe-product-grid {
    grid-template-columns: repeat(auto-fill, minmax(108px, 1fr));
    gap: .4rem;
  }
  .pe-verkauf .pe-product-tile,
  .pe-bestellung .pe-product-tile {
    min-height: 96px;
    padding: .5rem .35rem;
    border-radius: 12px;
    -webkit-tap-highlight-color: transparent;
  }
  .pe-verkauf .pe-product-emoji,
  .pe-bestellung .pe-product-emoji {
    font-size: 1.65rem;
  }
  .pe-verkauf .pe-product-name,
  .pe-bestellung .pe-product-name {
    font-size: .9rem;
  }
  .pe-verkauf .pe-product-price,
  .pe-bestellung .pe-product-price {
    font-size: 1.05rem;
  }
  .pe-verkauf .pe-cart-panel,
  .pe-bestellung .pe-bestellung-cart {
    max-height: min(46vh, 380px);
  }
  .pe-verkauf .pe-cart-total {
    font-size: 1.45rem;
  }
  .pe-verkauf #pe-verkauf-checkout {
    min-height: 50px;
  }
  .pe-verkauf .pe-cart-list li,
  .pe-bestellung .pe-cart-list li { padding: .4rem 0; font-size: .9rem; }
  .pe-verkauf .pe-cart-qty-btn,
  .pe-verkauf .pe-cart-remove,
  .pe-bestellung .pe-cart-qty-btn,
  .pe-bestellung .pe-cart-remove {
    min-width: 40px;
    min-height: 40px;
    width: 40px;
    height: 40px;
    font-size: 1.2rem;
  }
  .pe-verkauf .pe-cart-qty,
  .pe-bestellung .pe-cart-qty {
    min-width: 1.5rem;
    font-size: 1rem;
  }

  .pe-station .pe-station-columns {
    grid-template-columns: 1fr;
    overflow: hidden;
  }
  .pe-station .pe-station-col {
    max-height: min(42vh, 420px);
    min-height: 160px;
  }

  .pe-modal-wide .pe-modal-inner {
    max-width: 100%;
    margin: .5rem;
    max-height: calc(100vh - 1rem);
    overflow: auto;
  }
}

/* Mobile Portrait: nach allgemeinem Mobile-Block — kein Seiten-Scroll */
@media (max-width: 768px) and (orientation: portrait) {
  body.pe-kiosk .pe-app.pe-kasse,
  .pe-app.pe-kasse {
    height: 100dvh;
    max-height: 100dvh;
    padding: .25rem .4rem calc(.25rem + env(safe-area-inset-bottom, 0px));
    overflow: hidden;
  }
  body.pe-kiosk .pe-kasse .pe-app-header,
  .pe-kasse .pe-app-header {
    margin-top: env(safe-area-inset-top, 0px);
    margin-bottom: .2rem;
    padding: .3rem .4rem;
    gap: .25rem;
  }
  .pe-kasse .pe-pos-body {
    overflow: hidden;
    gap: .3rem;
  }
  .pe-kasse .pe-kasse-workspace {
    flex: 1 1 auto;
    min-height: 0;
    overflow: auto;
    -webkit-overflow-scrolling: touch;
    grid-template-columns: minmax(0, 1fr);
  }
  .pe-kasse .pe-kasse-col-scan,
  .pe-kasse .pe-kasse-col-ops {
    max-height: none;
    overflow: visible;
  }
  .pe-kasse .pe-scan-log,
  .pe-kasse .pe-topup-qr-block,
  .pe-kasse .pe-kasse-actions h2,
  .pe-kasse .pe-app-header .pe-badge,
  .pe-kasse #pe-kasse-scan-card .pe-hint-mobile,
  .pe-kasse #pe-kasse-topup-card .pe-hint-mobile {
    display: none !important;
  }
  .pe-kasse .pe-card {
    padding: .45rem .55rem;
  }
  .pe-kasse .pe-quick-amt {
    min-height: 40px;
  }
  .pe-kasse #pe-kasse-topup-btn {
    min-height: 42px;
  }
  .pe-kasse-actions .pe-btn-group .pe-btn,
  .pe-kasse-action-grid .pe-btn {
    min-height: 48px;
    font-size: .88rem;
  }
}

@media (max-width: 380px) {
  .pe-kasse .pe-quick-amounts { grid-template-columns: repeat(3, 1fr); }
  .pe-kasse .pe-quick-amounts .pe-quick-amt:nth-child(7) { grid-column: span 1; }
  .pe-verkauf .pe-product-grid { grid-template-columns: repeat(2, 1fr); }
}

@media (hover: none) and (pointer: coarse) {
  .pe-kasse .pe-btn,
  .pe-verkauf .pe-btn,
  .pe-kasse .pe-quick-amt,
  .pe-verkauf .pe-product-tile {
    -webkit-tap-highlight-color: transparent;
  }
  .pe-verkauf .pe-product-tile:active {
    transform: scale(.97);
    border-color: var(--pe-accent-light);
  }
  .pe-kasse .pe-quick-amt:active {
    background: #faf6e9;
    border-color: var(--pe-accent-light);
  }
}

/* Basis Produktgrid (auch Bestellkasse / Fallback) — Verkauf überschreibt oben */
.pe-product-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(clamp(120px, 11vw, 170px), 1fr));
  gap: .55rem;
}
.pe-product-tile {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: .3rem;
  padding: .75rem .5rem;
  border: 1px solid var(--pe-border, var(--pe-line));
  border-radius: var(--pe-radius-md);
  background: var(--pe-surface);
  color: var(--pe-text);
  cursor: pointer;
  min-height: 100px;
  box-shadow: none;
}
.pe-product-tile.deposit_charge, .pe-product-tile.pe-product-deposit_charge { border-color: #f59e0b; background: #fffbeb; }
.pe-product-tile.deposit_refund, .pe-product-tile.pe-product-deposit_refund { border-color: #16a34a; background: #f0fdf4; }
.pe-import-area { margin: 1rem 0; padding: 1rem; border: 1px dashed #ccc; border-radius: 8px; }
.pe-storno-list { list-style: none; padding: 0; margin: .75rem 0; max-height: 320px; overflow: auto; }
.pe-storno-list li { display: flex; justify-content: space-between; align-items: center; gap: .5rem; padding: .5rem 0; border-bottom: 1px solid #eee; flex-wrap: wrap; }
.pe-storno-list li > span:first-child { flex: 1; min-width: 160px; }
.pe-app .pe-storno-qty { width: auto; min-width: 76px; height: 38px; min-height: 38px; margin: 0; flex: 0 0 auto; }
.pe-modal-wide .pe-modal-inner { max-width: 560px; }
.pe-report-output table { width: 100%; border-collapse: collapse; margin-top: .75rem; }
.pe-report-output th, .pe-report-output td { padding: .4rem .5rem; border-bottom: 1px solid #eee; text-align: left; }
.pe-kasse-actions .pe-btn-group,
.pe-kasse-action-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .45rem;
  width: 100%;
}

.pe-product-emoji { font-size: 1.5rem; }

.pe-emoji-field { display: flex; flex-direction: column; gap: .4rem; margin: .75rem 0; }
.pe-emoji-label { font-weight: 600; font-size: .9rem; }
.pe-emoji-picker {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(2.4rem, 1fr));
  gap: .35rem;
  max-height: 9.5rem;
  overflow-y: auto;
  padding: .5rem;
  border: 1px solid #d8dde6;
  border-radius: 10px;
  background: #f8f9fb;
}
.pe-emoji-opt {
  appearance: none;
  border: 1px solid transparent;
  background: #fff;
  border-radius: 8px;
  font-size: 1.35rem;
  line-height: 1;
  width: 100%;
  aspect-ratio: 1;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  transition: border-color .15s ease, background .15s ease, transform .1s ease;
}
.pe-emoji-opt:hover { border-color: var(--pe-accent); background: var(--pe-info-bg); transform: scale(1.06); }
.pe-emoji-opt.is-selected,
.pe-emoji-opt[aria-selected="true"] {
  border-color: var(--pe-accent);
  background: var(--pe-info-bg);
  box-shadow: 0 0 0 2px rgba(184, 150, 12, .22);
}
.pe-emoji-custom { display: flex; align-items: center; gap: .5rem; }
.pe-emoji-preview {
  width: 2.5rem;
  height: 2.5rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 1.5rem;
  border: 1px solid #d8dde6;
  border-radius: 8px;
  background: #fff;
  flex-shrink: 0;
}
.pe-emoji-input { flex: 1; min-width: 0; max-width: 12rem; }
.pe-product-name { font-weight: 600; font-size: .85rem; text-align: center; }
.pe-product-price { color: var(--pe-primary); font-weight: 700; }
.pe-product-hot {
  border-color: var(--pe-accent-light);
  box-shadow: 0 0 0 2px rgba(184, 150, 12, .22);
}
.pe-product-hot-badge {
  position: absolute;
  top: .35rem;
  right: .35rem;
  font-size: .65rem;
  font-weight: 800;
  letter-spacing: .04em;
  text-transform: uppercase;
  color: var(--pe-on-primary);
  background: var(--pe-primary);
  padding: .15rem .4rem;
  border-radius: var(--pe-radius-sm);
  line-height: 1.2;
}
.pe-mute-btn[aria-pressed="true"],
.pe-receipt-btn.pe-toggle-on,
.pe-drawer-btn.pe-toggle-on {
  background: var(--pe-surface-soft);
  outline: 2px solid var(--pe-accent);
}

/* Mitarbeiter: Online- + Offline-Login-QR unter dem Namen */
.pe-user-with-qr {
  display: flex;
  flex-direction: column;
  gap: .55rem;
  min-width: 0;
}
.pe-user-name {
  font-size: 1.05rem;
}
.pe-staff-qr-pair {
  display: flex;
  flex-wrap: wrap;
  gap: .75rem;
  align-items: flex-start;
}
.pe-staff-qr {
  margin: 0;
  text-align: center;
  width: 104px;
}
.pe-staff-qr img {
  display: block;
  width: 96px;
  height: 96px;
  background: #fff;
  border: 1px solid var(--pe-line, #e5e7eb);
  border-radius: 8px;
  padding: 4px;
  box-sizing: border-box;
}
.pe-staff-qr figcaption {
  margin-top: .25rem;
  font-size: .75rem;
  font-weight: 600;
  color: var(--pe-muted, #64748b);
  letter-spacing: .02em;
  text-transform: uppercase;
}
.pe-staff-qr-actions {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem;
  align-items: center;
}
.pe-users-table td {
  vertical-align: top;
}
.pe-kasse-deposit-actions {
  display: flex;
  flex-wrap: wrap;
  gap: .5rem;
  margin: .5rem 0 .25rem;
}
.pe-kasse-deposit-actions .pe-btn { flex: 1 1 auto; }
.pe-inventory-card .pe-inventory-controls {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .5rem;
  margin: .5rem 0 .75rem;
}
.pe-inventory-scan-wrap {
  margin-top: .35rem;
  padding: .85rem 1rem;
  border-radius: 10px;
  border: 1px solid var(--pe-line, #ddd);
  background: var(--pe-surface-2, rgba(0, 0, 0, .03));
}
.pe-inventory-scan-wrap[hidden],
.pe-inventory-result[hidden] {
  display: none !important;
}
.pe-inventory-result {
  margin-top: 1rem;
  padding: 1rem 1.1rem;
  border-radius: 10px;
  border: 1px solid rgba(184, 150, 12, 0.35);
  background: rgba(184, 150, 12, 0.08);
}
.pe-inventory-summary {
  margin: 0 0 .75rem;
  font-size: 1.05rem;
}
.pe-inventory-result h3 {
  margin: 0 0 .35rem;
  font-size: 1.1rem;
}
.pe-inventory-missing-list {
  width: 100%;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: .95rem;
  line-height: 1.4;
  min-height: 8rem;
  resize: vertical;
}
.pe-inventory-result-actions {
  margin-top: .75rem;
  flex-wrap: wrap;
  gap: .5rem;
}
.pe-kasse-return-panel {
  margin-top: .75rem;
  padding: 1rem 1.1rem;
  border: 1px solid rgba(184, 150, 12, 0.35);
  border-radius: 12px;
  background: rgba(184, 150, 12, 0.08);
}
.pe-kasse-return-panel[hidden] { display: none !important; }
.pe-kasse-return-panel h3 {
  margin: 0 0 .35rem;
  font-size: 1.15rem;
}
.pe-return-breakdown {
  list-style: none;
  margin: .65rem 0;
  padding: 0;
}
.pe-return-breakdown li {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  padding: .35rem 0;
  border-bottom: 1px solid rgba(0, 0, 0, 0.06);
  font-size: 1.05rem;
}
.pe-return-breakdown .pe-return-total {
  border-bottom: 0;
  margin-top: .25rem;
  padding-top: .55rem;
  font-size: 1.2rem;
  font-weight: 700;
}
.pe-kasse-return-actions {
  margin-top: .75rem;
  flex-wrap: wrap;
}
.pe-kasse-status-actions {
  display: flex;
  flex-wrap: wrap;
  gap: .5rem;
  margin: .35rem 0 .5rem;
}
.pe-kasse-status-actions .pe-btn { flex: 1 1 auto; }
.pe-balance-popup-type {
  font-size: .95rem;
  font-weight: 700;
  margin-bottom: .35rem;
  opacity: .95;
}
.pe-cart-list { list-style: none; padding: 0; margin: 0 0 1rem; min-height: 60px; }
.pe-cart-list li,
.pe-cart-item {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: .5rem;
  padding: .55rem 0;
  border-bottom: 1px solid #eee;
}
.pe-cart-item-info {
  flex: 1 1 auto;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: .1rem;
}
.pe-cart-item-name {
  font-weight: 650;
  font-size: .95rem;
  line-height: 1.25;
  word-break: break-word;
}
.pe-cart-item-line {
  font-size: .85rem;
  color: #555;
  font-weight: 600;
}
.pe-cart-item-extras {
  display: block;
  color: #555;
  font-size: .82rem;
  font-weight: 600;
  line-height: 1.25;
}
.pe-cart-item-hint {
  display: block;
  color: #888;
  font-size: .75rem;
  font-weight: 500;
  font-style: italic;
}
.pe-cart-item-edit {
  cursor: pointer;
  border-radius: 8px;
  margin: -0.15rem;
  padding: 0.15rem;
  transition: background 0.12s ease;
}
.pe-cart-item-edit:hover,
.pe-cart-item-edit:focus {
  background: rgba(0, 0, 0, 0.04);
  outline: none;
}
.pe-cart-item-controls {
  display: inline-flex;
  align-items: center;
  gap: .25rem;
  flex-shrink: 0;
}
.pe-cart-qty {
  min-width: 1.6rem;
  text-align: center;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}
.pe-cart-qty-btn {
  width: 2rem;
  height: 2rem;
  padding: 0;
  border: 1px solid #cfd5de;
  border-radius: 8px;
  background: #f4f6f9;
  color: #1c1d23;
  font-size: 1.15rem;
  font-weight: 700;
  line-height: 1;
  cursor: pointer;
}
.pe-cart-qty-btn:hover { background: #e8ecf2; }
.pe-cart-qty-btn:active { transform: scale(.96); }
.pe-cart-remove {
  background: none;
  border: none;
  font-size: 1.25rem;
  cursor: pointer;
  color: #a00;
  width: 2rem;
  height: 2rem;
  line-height: 1;
  border-radius: 8px;
}
.pe-cart-remove:hover { background: #fdecea; }

@media (max-width: 600px) {
  .pe-app { padding: .5rem; }
  .pe-nav-grid { grid-template-columns: repeat(2, 1fr); }
  .pe-verkauf-layout { grid-template-columns: 1fr; }
}

/* ─── Landingpage LEGACY DISABLED — styles in assets/css/pleppo-landing.css ───
.pe-app.pe-landing {
  padding: 0;
  background: #111;
  min-height: 100vh;
}

.pe-lp {
  --pe-lp-gold: #b8960c;
  --pe-lp-gold-light: #d4af37;
  --pe-lp-bronze: #8b6914;
  --pe-lp-dark: #111111;
  --pe-lp-text: #333333;
  --pe-lp-muted: #888888;
  --pe-lp-gray: #f4f3f0;
  --pe-lp-light: #fafaf8;
  --pe-lp-radius: 12px;
  --pe-lp-shadow: 0 2px 12px rgba(0,0,0,.08);
  --pe-lp-shadow-md: 0 8px 28px rgba(0,0,0,.12);
  color: var(--pe-lp-text);
  line-height: 1.65;
  -webkit-font-smoothing: antialiased;
}

.pe-lp *,
.pe-lp *::before,
.pe-lp *::after { box-sizing: border-box; }

.pe-lp h1, .pe-lp h2, .pe-lp h3, .pe-lp p { margin: 0; }

.pe-lp-container {
  max-width: 1100px;
  margin: 0 auto;
  padding: 0 1.75rem;
}

.pe-lp-section { padding: 5rem 0; }
.pe-lp-section-white { background: #fff; }
.pe-lp-section-light { background: var(--pe-lp-light); }
.pe-lp-section-gray  { background: var(--pe-lp-gray); }
.pe-lp-section-dark  { background: var(--pe-lp-dark); color: #fff; }

.pe-lp-headline {
  font-size: clamp(1.7rem, 3.5vw, 2.5rem);
  font-weight: 800;
  letter-spacing: -.03em;
  line-height: 1.15;
  margin-bottom: 1rem;
  color: var(--pe-lp-dark);
}

.pe-lp-headline-light { color: #fff; }

.pe-lp-lead {
  font-size: 1.05rem;
  color: var(--pe-lp-muted);
  max-width: 640px;
  margin-bottom: 2.5rem;
  line-height: 1.7;
}

.pe-lp-kicker {
  font-size: .8rem;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--pe-lp-gold-light);
  margin-bottom: .75rem;
}

.pe-lp-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: .875rem 2rem;
  border-radius: 8px;
  font-size: 1rem;
  font-weight: 600;
  text-decoration: none;
  border: 2px solid transparent;
  transition: filter .2s ease, transform .2s ease, border-color .2s ease;
  cursor: pointer;
  line-height: 1;
}

.pe-lp-btn:hover { transform: translateY(-2px); text-decoration: none; }

.pe-lp-btn-gold {
  background: linear-gradient(135deg, var(--pe-lp-gold-light) 0%, var(--pe-lp-gold) 55%, var(--pe-lp-bronze) 100%);
  color: #fff;
  border-color: var(--pe-lp-gold);
  box-shadow: 0 4px 18px rgba(184,150,12,.35);
}
.pe-lp-btn-gold:hover { filter: brightness(1.08); color: #fff; }

.pe-lp-btn-ghost {
  background: transparent;
  color: #fff;
  border-color: rgba(255,255,255,.45);
}
.pe-lp-btn-ghost:hover { border-color: #fff; color: #fff; }

.pe-lp-btn-lg { font-size: 1.1rem; padding: 1rem 2.5rem; }

.pe-lp-hero {
  position: relative;
  background-color: var(--pe-lp-dark);
  background-size: cover;
  background-position: center;
  min-height: 560px;
  display: flex;
  align-items: center;
  padding: 5rem 0;
}

.pe-lp-hero::before {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(105deg, rgba(17,17,17,.92) 0%, rgba(17,17,17,.78) 45%, rgba(17,17,17,.55) 100%);
}

.pe-lp-hero > .pe-lp-container { position: relative; width: 100%; }

.pe-lp-hero-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 3rem;
  align-items: center;
}

.pe-lp-hero-title {
  font-size: clamp(2rem, 5vw, 3.5rem);
  font-weight: 900;
  letter-spacing: -.04em;
  line-height: 1.05;
  color: #fff;
  margin-bottom: .5rem;
}

.pe-lp-hero-sub {
  font-size: clamp(1.05rem, 2vw, 1.35rem);
  color: var(--pe-lp-gold-light);
  font-weight: 600;
  margin-bottom: .75rem;
}

.pe-lp-hero-desc {
  font-size: 1.05rem;
  color: rgba(255,255,255,.75);
  max-width: 520px;
  line-height: 1.7;
}

.pe-lp-hero-btns {
  display: flex;
  gap: 1rem;
  flex-wrap: wrap;
  margin-top: 2rem;
}

.pe-lp-hero-visual {
  display: flex;
  justify-content: center;
  align-items: center;
}

.pe-lp-hero-logo {
  max-width: min(320px, 80vw);
  height: auto;
  filter: drop-shadow(0 20px 50px rgba(0,0,0,.55));
  animation: pe-lp-float 4s ease-in-out infinite;
}

@keyframes pe-lp-float {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-8px); }
}

.pe-lp-compare {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 2rem;
}

.pe-lp-compare-col {
  text-align: center;
  padding: 2rem 1.5rem;
  border-radius: var(--pe-lp-radius);
  background: #fff;
  box-shadow: var(--pe-lp-shadow);
}

.pe-lp-compare-old { opacity: .7; filter: grayscale(.35); }

.pe-lp-compare-img {
  width: 100%;
  max-height: 200px;
  object-fit: cover;
  border-radius: 8px;
  display: block;
  margin: 0 auto 1.25rem;
}

.pe-lp-compare-logo {
  object-fit: contain;
  background: var(--pe-lp-dark);
  padding: 1rem;
}

.pe-lp-compare-label {
  display: block;
  font-size: .85rem;
  font-weight: 700;
  color: var(--pe-lp-muted);
  text-transform: uppercase;
  letter-spacing: .06em;
  margin-bottom: .5rem;
}

.pe-lp-compare-label-gold { color: var(--pe-lp-gold); }

.pe-lp-compare-text {
  font-size: .95rem;
  color: #555;
  line-height: 1.6;
}

.pe-lp-grid-3 {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.75rem;
}

.pe-lp-adv-card {
  background: #fff;
  border-radius: var(--pe-lp-radius);
  padding: 2rem 1.5rem;
  box-shadow: var(--pe-lp-shadow);
  transition: transform .2s ease, box-shadow .2s ease;
  border-top: 3px solid var(--pe-lp-gold);
}

.pe-lp-adv-card:hover {
  transform: translateY(-4px);
  box-shadow: var(--pe-lp-shadow-md);
}

.pe-lp-adv-icon {
  font-size: 2.25rem;
  line-height: 1;
  display: block;
  margin-bottom: .75rem;
}

.pe-lp-adv-title {
  font-size: 1.1rem;
  font-weight: 700;
  color: var(--pe-lp-dark);
  margin-bottom: .5rem;
}

.pe-lp-adv-text {
  font-size: .95rem;
  color: var(--pe-lp-muted);
  line-height: 1.6;
}

.pe-lp-fn-list {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 1.25rem;
}

.pe-lp-fn-item {
  padding: 1.5rem 1.75rem;
  border-radius: var(--pe-lp-radius);
  background: rgba(255,255,255,.06);
  border-left: 3px solid var(--pe-lp-gold);
  transition: background .2s ease;
}

.pe-lp-fn-item:hover { background: rgba(255,255,255,.1); }

.pe-lp-fn-title {
  font-size: 1.05rem;
  font-weight: 700;
  color: #fff;
  margin-bottom: .4rem;
}

.pe-lp-fn-text {
  font-size: .9rem;
  color: rgba(255,255,255,.68);
  line-height: 1.6;
}

.pe-lp-link-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1.25rem;
}

.pe-lp-link-tile {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: .5rem;
  padding: 1.75rem 1rem;
  background: #fff;
  border-radius: var(--pe-lp-radius);
  box-shadow: var(--pe-lp-shadow);
  text-decoration: none;
  color: var(--pe-lp-text);
  transition: transform .2s ease, box-shadow .2s ease, color .2s ease;
  border: 2px solid transparent;
}

.pe-lp-link-tile:hover {
  transform: translateY(-4px);
  box-shadow: var(--pe-lp-shadow-md);
  border-color: var(--pe-lp-gold);
  color: var(--pe-lp-dark);
  text-decoration: none;
}

.pe-lp-link-icon { font-size: 2rem; line-height: 1; }

.pe-lp-link-label {
  font-size: 1rem;
  font-weight: 700;
  color: var(--pe-lp-dark);
}

.pe-lp-link-desc {
  font-size: .82rem;
  color: var(--pe-lp-muted);
  line-height: 1.45;
}

.pe-lp-cta { text-align: center; }

.pe-lp-cta-inner { max-width: 720px; }

.pe-lp-cta-text {
  font-size: 1.05rem;
  color: rgba(255,255,255,.78);
  margin-bottom: 2rem;
  line-height: 1.7;
}

.pe-lp-footer {
  background: var(--pe-lp-dark);
  border-top: 1px solid rgba(255,255,255,.08);
  padding: 1.5rem 0;
  text-align: center;
  font-size: .85rem;
  color: rgba(255,255,255,.55);
}

.pe-lp-footer a {
  color: var(--pe-lp-gold-light);
  text-decoration: none;
}

.pe-lp-footer a:hover { text-decoration: underline; }

.pe-lp-admin-hint {
  margin-top: .5rem;
  font-size: .8rem;
  color: rgba(255,255,255,.4);
}

@media (max-width: 920px) {
  .pe-lp-hero-grid { grid-template-columns: 1fr; text-align: center; }
  .pe-lp-hero-desc { margin-left: auto; margin-right: auto; }
  .pe-lp-hero-btns { justify-content: center; }
  .pe-lp-hero-visual { order: -1; }
  .pe-lp-hero-logo { max-width: 200px; }
  .pe-lp-grid-3 { grid-template-columns: 1fr 1fr; }
  .pe-lp-link-grid { grid-template-columns: repeat(2, 1fr); }
  .pe-lp-fn-list { grid-template-columns: 1fr; }
}

@media (max-width: 620px) {
  .pe-lp-section { padding: 3.5rem 0; }
  .pe-lp-container { padding: 0 1rem; }
  .pe-lp-grid-3 { grid-template-columns: 1fr; }
  .pe-lp-compare { grid-template-columns: 1fr; }
  .pe-lp-link-grid { grid-template-columns: 1fr; }
  .pe-lp-hero { min-height: auto; padding: 3.5rem 0; }
  .pe-lp-hero-title { font-size: 2rem; }
}
*/

/* ─── Portal Anmeldemaske ─────────────────────────────────── */
.pe-portal-login {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 100vh;
  padding: 1.5rem 1rem;
  background: linear-gradient(160deg, #15161a 0%, #1e1f26 60%, #262008 140%);
  background-image:
    radial-gradient(700px 380px at 50% -8%, rgba(212,175,55,.16), transparent 65%),
    linear-gradient(160deg, #15161a 0%, #1e1f26 60%, #262008 140%);
}

.pe-login-shell {
  width: 100%;
  max-width: 420px;
}

.pe-login-card {
  padding: 2rem 1.75rem 1.75rem;
  border: 1px solid rgba(212,175,55,.22);
  border-radius: 20px;
  box-shadow: 0 10px 24px rgba(0,0,0,.35), 0 30px 80px rgba(0,0,0,.45);
}

.pe-login-kicker {
  margin: 0 0 1.1rem;
  text-align: center;
  font-size: .76rem;
  font-weight: 700;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--pe-accent);
}

.pe-login-form-wrap { text-align: center; }

.pe-login-logo {
  display: block;
  max-width: 120px;
  max-height: 120px;
  width: auto;
  height: auto;
  margin: 0 auto 1rem;
}

.pe-login-title {
  margin: 0 0 .35rem;
  font-size: 1.5rem;
  font-weight: 700;
}

.pe-login-sub {
  margin: 0 0 1.25rem;
  color: #666;
  font-size: .95rem;
  line-height: 1.45;
}

.pe-portal-login #pe-loginform,
.pe-portal-login #loginform {
  text-align: left;
  margin: 0;
}

.pe-portal-login #pe-loginform label,
.pe-portal-login #loginform label {
  display: block;
  font-weight: 600;
  font-size: .9rem;
  margin-bottom: .25rem;
}

.pe-portal-login #pe-loginform p,
.pe-portal-login #loginform p {
  margin: 0 0 .85rem;
}

.pe-portal-login #pe-loginform input[type=text],
.pe-portal-login #pe-loginform input[type=password],
.pe-portal-login #loginform input[type=text],
.pe-portal-login #loginform input[type=password] {
  width: 100%;
  padding: .8rem .9rem;
  font-size: 1rem;
  border: 1px solid var(--pe-line);
  border-radius: var(--pe-radius-sm);
  margin: .25rem 0 0;
  box-sizing: border-box;
  background: #faf9f6;
  transition: border-color .15s, box-shadow .15s, background .15s;
}

.pe-portal-login #pe-loginform input[type=text]:focus,
.pe-portal-login #pe-loginform input[type=password]:focus,
.pe-portal-login #loginform input[type=text]:focus,
.pe-portal-login #loginform input[type=password]:focus {
  outline: none;
  background: #fff;
  border-color: var(--pe-accent-light);
  box-shadow: var(--pe-focus);
}

.pe-portal-login #pe-loginform input[type=checkbox],
.pe-portal-login #loginform input[type=checkbox] {
  margin-right: .35rem;
  vertical-align: middle;
}

.pe-portal-login #pe-loginform .login-remember,
.pe-portal-login #loginform .login-remember {
  display: flex;
  align-items: center;
  gap: .35rem;
  font-weight: 500;
  font-size: .9rem;
}

.pe-portal-login #pe-loginform input[type=submit],
.pe-portal-login #loginform input[type=submit] {
  width: 100%;
  padding: .85rem 1rem;
  font-size: 1rem;
  font-weight: 700;
  background: linear-gradient(135deg, #d4af37 0%, #b8960c 100%);
  color: #1c1d23;
  border: none;
  border-radius: 999px;
  cursor: pointer;
  min-height: 52px;
  margin-top: .35rem;
  box-shadow: 0 4px 14px rgba(184,150,12,.35);
  transition: transform .12s, box-shadow .18s, filter .18s;
}

.pe-portal-login #pe-loginform input[type=submit]:hover,
.pe-portal-login #loginform input[type=submit]:hover {
  filter: brightness(1.07);
  box-shadow: 0 6px 18px rgba(184,150,12,.45);
}

.pe-portal-login #pe-loginform input[type=submit]:active,
.pe-portal-login #loginform input[type=submit]:active {
  transform: scale(.985);
}

.pe-login-qr-hint {
  margin: 1.25rem 0 0;
  padding: .85rem 1rem;
  background: #faf7ec;
  border: 1px solid #eadfb8;
  border-radius: var(--pe-radius-sm);
  font-size: .85rem;
  color: #6a5a1c;
  line-height: 1.45;
  text-align: left;
}

.pe-login-scan { margin-top: 1.5rem; text-align: left; }
.pe-login-scan-divider {
  display: flex; align-items: center; gap: .75rem; margin-bottom: 1rem;
  font-size: .8rem; font-weight: 700; text-transform: uppercase; letter-spacing: .08em; color: #999;
}
.pe-login-scan-divider::before, .pe-login-scan-divider::after { content: ""; flex: 1; height: 1px; background: var(--pe-line); }
.pe-login-scan label { display: block; font-weight: 700; font-size: .95rem; margin-bottom: .15rem; }
.pe-login-scan .pe-input { margin-bottom: .25rem; }
.pe-login-scan .pe-login-qr-hint { margin-top: .5rem; }
.pe-login-scan-status { margin: .5rem 0 0; padding: .6rem .85rem; border-radius: var(--pe-radius-sm); font-size: .9rem; font-weight: 600; }
.pe-login-scan-status.pe-login-scan-ok { background: #e7f6ec; color: #14663a; border: 1px solid #9fd3ae; }
.pe-login-scan-status.pe-login-scan-error { background: #fdf3f2; color: #8c1d13; border: 1px solid #e2a19b; }

.pe-login-public {
  margin-top: 1.25rem;
  padding-top: 1.25rem;
  border-top: 1px solid #e8eef5;
  text-align: left;
}

.pe-login-public-label {
  display: block;
  font-size: .75rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .06em;
  color: #888;
  margin-bottom: .5rem;
}

.pe-login-switch {
  margin: 0 0 .85rem;
  text-align: center;
}

.pe-login-logout-btn {
  width: 100%;
  min-height: 52px;
  font-size: 1rem;
}

@media (hover: none) and (pointer: coarse) {
  .pe-portal-login #pe-loginform input[type=submit],
  .pe-portal-login #loginform input[type=submit] {
    min-height: 56px;
  }
}

/* Portal-Feinschliff */
.pe-portal { width: 100%; max-width: min(960px, 100%); margin: 0 auto; }
.pe-portal .pe-org-switch select,
.pe-portal .pe-event-switch select { flex: 1; min-width: 220px; margin: 0; }
.pe-portal .pe-form-inline { gap: .6rem; }
.pe-portal .pe-public-links h3 { margin: 0 0 .85rem; font-size: 1rem; font-weight: 700; letter-spacing: -.01em; }
.pe-portal .pe-public-links .pe-link-row a {
  display: inline-flex; align-items: center; padding: .5rem 1.05rem; background: #faf9f6;
  border: 1px solid var(--pe-line); border-radius: 999px; text-decoration: none;
  font-weight: 600; font-size: .9rem; color: var(--pe-text);
  transition: border-color .18s, color .18s, box-shadow .18s;
}
.pe-portal .pe-public-links .pe-link-row a:hover { border-color: var(--pe-accent-light); color: #7a6408; box-shadow: 0 2px 8px rgba(184,150,12,.14); }

@media (max-width: 600px) {
  .pe-portal-header { padding: .85rem 1rem; }
  .pe-portal-header .pe-logo { height: 42px; }
  .pe-app-header-actions { width: 100%; justify-content: space-between; }
}

/* Abgleich Online / Offline */
.pe-sync-intro { display: flex; gap: .9rem; align-items: flex-start; background: #eaf2ff; border: 1px solid #2B7FC1; border-left-width: 4px; }
.pe-sync-ic { font-size: 1.6rem; line-height: 1; }
.pe-sync-role { position: relative; overflow: hidden; margin-top: 1rem; }
.pe-sync-role-online::before, .pe-sync-role-offline::before { content: ""; position: absolute; top: 0; left: 0; right: 0; height: 4px; }
.pe-sync-role-online::before { background: var(--pe-primary); }
.pe-sync-role-offline::before { background: #16a34a; }
.pe-sync-head { display: flex; align-items: center; gap: .75rem; margin-bottom: .5rem; }
.pe-sync-sub { display: block; font-size: .72rem; color: #777; font-weight: 700; text-transform: uppercase; letter-spacing: .5px; }
.pe-spacer { flex: 1; }
.pe-badge-ok { background: #e7f6ec; color: #14663a; }
.pe-badge-off { background: #f0f0f0; color: #666; }
.pe-sync-step { display: flex; gap: .85rem; padding: .75rem 0; border-bottom: 1px solid #eee; }
.pe-sync-num { flex: 0 0 auto; width: 28px; height: 28px; border-radius: 50%; background: #16a34a; color: #fff; font-weight: 700; display: flex; align-items: center; justify-content: center; }
.pe-btn-row { display: flex; gap: .5rem; flex-wrap: wrap; margin-top: .5rem; }
.pe-sync-switch { display: inline-flex; align-items: center; gap: .65rem; cursor: pointer; margin: .5rem 0; }
.pe-sync-switch input { position: absolute; opacity: 0; width: 0; height: 0; }
.pe-sync-track { width: 46px; height: 26px; border-radius: 999px; background: #cbd5e1; position: relative; flex: 0 0 auto; }
.pe-sync-track::after { content: ""; position: absolute; top: 3px; left: 3px; width: 20px; height: 20px; border-radius: 50%; background: #fff; box-shadow: 0 1px 3px rgba(0,0,0,.3); transition: .2s; }
.pe-sync-switch input:checked + .pe-sync-track { background: #16a34a; }
.pe-sync-switch input:checked + .pe-sync-track::after { transform: translateX(20px); }
.pe-sync-auto { margin-top: 1rem; padding: 1rem; border: 1px dashed #16a34a; border-radius: var(--pe-radius); background: #f0fdf4; }
#pe-sync-progress { margin-top: .75rem; padding: .75rem 1rem; border-radius: 8px; border: 1px solid #e2e2e2; background: #f8fafc; }
#pe-sync-progress.pe-sync-running::before { content: "⏳ "; }
#pe-sync-progress.pe-sync-done { background: #e7f6ec; border-color: #16a34a; color: #14663a; }
#pe-sync-progress.pe-sync-done::before { content: "✅ "; }
#pe-sync-progress.pe-sync-error { background: #fdecec; border-color: #dc2626; color: #a01818; }
#pe-sync-progress.pe-sync-error::before { content: "⚠️ "; }
.pe-sync-url-input,
#pe-sync-remote-url,
#pe-platform-sync-url,
#pe-sync-base-url {
  width: 100% !important;
  max-width: none !important;
  min-width: 0;
  box-sizing: border-box;
  font-size: 13px !important;
  letter-spacing: 0;
}
.pe-sync-role .pe-form-row,
.pe-sync-step > div {
  max-width: 100%;
}
#pe-super-sync .pe-app {
  max-width: min(1100px, 100%) !important;
}

/* ---- Öffentliche Guthaben-Seite (barrierefrei) ---- */
.pe-balance-page { display: flex; align-items: flex-start; justify-content: center; padding-top: clamp(8px, 2vw, 1.25rem); }
.pe-public-inner { width: 100%; max-width: 440px; }
.pe-public-logo { display: block; height: 56px; width: auto; margin: 0 auto 1.25rem; }
.pe-balance-page h1 { margin: 0 0 .5rem; font-size: 1.6rem; font-weight: 800; letter-spacing: -.02em; text-align: center; color: var(--pe-text); }
.pe-public-desc { margin: 0 0 1.5rem; font-size: 1rem; line-height: 1.6; color: #4a4a4f; text-align: center; }
.pe-balance-page label { display: block; font-weight: 700; font-size: 1rem; margin-bottom: .1rem; }
.pe-balance-page .pe-input { font-size: 1.15rem; min-height: 52px; text-align: center; letter-spacing: .06em; }
.pe-balance-page .pe-input[aria-invalid="true"] { border-color: #b42318; box-shadow: 0 0 0 3px rgba(180,35,24,.18); }
.pe-btn-lg { width: 100%; min-height: 52px; font-size: 1.05rem; }
.pe-balance-result { margin-top: 1.25rem; text-align: center; font-size: 1.05rem; line-height: 1.6; }
.pe-balance-result.pe-balance-ok { border-color: #9fd3ae; background: #f2faf4; }
.pe-balance-result.pe-balance-error { border-color: #e2a19b; background: #fdf3f2; color: #8c1d13; font-weight: 600; }
.pe-balance-label { margin: 0; font-size: .95rem; font-weight: 700; text-transform: uppercase; letter-spacing: .08em; color: #14663a; }
.pe-balance-amount { margin: .35rem 0; font-size: 2.4rem; font-weight: 800; letter-spacing: -.02em; color: var(--pe-text); }
.pe-balance-card { margin: 0; color: #4a4a4f; font-size: .95rem; }
.pe-balance-countdown { margin-top: .75rem !important; font-weight: 700; color: #14663a; }
.pe-public-help { margin-top: 2rem; font-size: .95rem; line-height: 1.6; color: #4a4a4f; text-align: center; }

/* ---- Guthaben-Kiosk (Raspberry Pi / Station) ---- */
body.pe-balance-kiosk-body {
  height: 100%;
  max-height: 100dvh;
  overflow: hidden !important;
  overscroll-behavior: none;
  touch-action: manipulation;
  background: #14151a !important;
  color: #f4f1ea !important;
}
body.pe-balance-kiosk-body #wpadminbar,
body.pe-balance-kiosk-body header:not(.pe-app-header),
body.pe-balance-kiosk-body footer:not(.pe-lp-footer):not(.pe-balance-kiosk-foot),
body.pe-balance-kiosk-body .site-header,
body.pe-balance-kiosk-body .site-footer,
body.pe-balance-kiosk-body .entry-header,
body.pe-balance-kiosk-body .entry-title,
body.pe-balance-kiosk-body .page-title,
body.pe-balance-kiosk-body .wp-block-post-title,
body.pe-balance-kiosk-body .pe-kiosk-exit,
body.pe-balance-kiosk-body .wp-block-navigation,
body.pe-balance-kiosk-body nav.wp-block-navigation,
body.pe-balance-kiosk-body aside,
body.pe-balance-kiosk-body .sidebar,
body.pe-balance-kiosk-body .widget-area {
  display: none !important;
}
body.pe-balance-kiosk-body #page,
body.pe-balance-kiosk-body .site,
body.pe-balance-kiosk-body .site-content,
body.pe-balance-kiosk-body .content-area,
body.pe-balance-kiosk-body article,
body.pe-balance-kiosk-body .entry-content,
body.pe-balance-kiosk-body .page-content,
body.pe-balance-kiosk-body .wp-site-blocks,
body.pe-balance-kiosk-body .wp-block-group,
body.pe-balance-kiosk-body .wp-block-post-content {
  margin: 0 !important;
  padding: 0 !important;
  max-width: none !important;
  width: 100% !important;
  min-height: 100vh;
  min-height: 100dvh;
  background: transparent !important;
  box-shadow: none !important;
  border: 0 !important;
  color: inherit !important;
}
.pe-balance-kiosk {
  --pe-bk-ink: #f4f1ea;
  --pe-bk-muted: rgba(244, 241, 234, .72);
  --pe-bk-gold: #d4af37;
  --pe-bk-ok: #7ddea0;
  position: relative;
  width: 100% !important;
  max-width: none !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  min-height: 100vh;
  min-height: 100dvh;
  max-height: 100vh;
  max-height: 100dvh;
  margin: 0 !important;
  padding: 0 !important;
  border-radius: 0;
  box-shadow: none;
  display: flex;
  align-items: stretch;
  justify-content: center;
  /* Harte Fallbacks zuerst (alte Chromium/Pi ohne clamp/var) */
  background: #121318 !important;
  background:
    radial-gradient(ellipse 90% 70% at 50% 110%, rgba(212, 175, 55, .22), transparent 55%),
    radial-gradient(ellipse 70% 50% at 50% -10%, rgba(212, 175, 55, .14), transparent 50%),
    linear-gradient(165deg, #1c1d23 0%, #121318 55%, #0c0d10 100%) !important;
  color: #f4f1ea !important;
  font-family: "Segoe UI", "Helvetica Neue", system-ui, sans-serif;
}
.pe-balance-kiosk-stage {
  width: 96%;
  max-width: 920px;
  width: min(96vw, 920px);
  margin: 0 auto;
  padding: 1.5rem 1.25rem;
  padding: clamp(1.5rem, 4vh, 3rem) 1.25rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  gap: .35rem;
  min-height: 100vh;
  min-height: 100dvh;
  box-sizing: border-box;
}
.pe-balance-kiosk-stage > .pe-layout-item {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
}
.pe-balance-kiosk-brand {
  margin-bottom: .75rem;
  margin-bottom: clamp(.75rem, 2vh, 1.5rem);
}
.pe-balance-kiosk .pe-public-logo {
  height: 72px;
  height: clamp(56px, 10vh, 110px);
  width: auto;
  margin: 0 auto;
  filter: drop-shadow(0 8px 24px rgba(0, 0, 0, .35));
}
.pe-balance-kiosk-wordmark {
  margin: 0;
  font-family: Impact, "Arial Narrow", "Segoe UI", sans-serif;
  font-size: 3.5rem;
  font-size: clamp(3rem, 10vw, 5.5rem);
  letter-spacing: .08em;
  color: #d4af37 !important;
  line-height: .9;
  text-transform: uppercase;
}
.pe-balance-kiosk-title {
  margin: 0 !important;
  font-family: Impact, "Arial Narrow", "Segoe UI", sans-serif;
  font-size: 3.2rem !important;
  font-size: clamp(2.8rem, 9vw, 5rem) !important;
  font-weight: 400 !important;
  letter-spacing: .06em;
  color: #f4f1ea !important;
  text-transform: uppercase;
  line-height: 1;
}
.pe-balance-kiosk .pe-balance-kiosk-idle,
.pe-balance-kiosk .pe-public-desc {
  margin: .5rem auto 0 !important;
  font-size: 1.35rem;
  font-size: clamp(1.2rem, 3.4vw, 1.85rem);
  font-weight: 600;
  color: rgba(244, 241, 234, .72) !important;
  max-width: 18em;
  width: 100%;
  line-height: 1.35;
  text-align: center;
  display: block;
  box-sizing: border-box;
}
.pe-balance-kiosk-form {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
}
.pe-balance-scan-input {
  position: absolute !important;
  left: 0 !important;
  top: 0 !important;
  width: 1px !important;
  height: 1px !important;
  opacity: 0.01 !important;
  border: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
  overflow: hidden !important;
  color: transparent !important;
  caret-color: transparent !important;
  background: transparent !important;
}
.pe-balance-kiosk-ready {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1.1rem;
  margin-top: 2rem;
  margin-top: clamp(1.5rem, 5vh, 3rem);
  transition: opacity .35s ease, transform .35s ease;
}
.pe-balance-kiosk-pulse {
  width: 110px;
  height: 110px;
  width: clamp(88px, 14vw, 140px);
  height: clamp(88px, 14vw, 140px);
  border-radius: 50%;
  background: #d4af37;
  background:
    radial-gradient(circle at 38% 32%, #f3e2a0, #d4af37 48%, #8a7010 100%);
  box-shadow:
    0 0 0 0 rgba(212, 175, 55, .55),
    0 18px 40px rgba(0, 0, 0, .35);
  animation: pe-balance-pulse 1.8s ease-out infinite;
}
@keyframes pe-balance-pulse {
  0% { box-shadow: 0 0 0 0 rgba(212, 175, 55, .55), 0 18px 40px rgba(0, 0, 0, .35); transform: scale(1); }
  70% { box-shadow: 0 0 0 36px rgba(212, 175, 55, 0), 0 18px 40px rgba(0, 0, 0, .35); transform: scale(1.05); }
  100% { box-shadow: 0 0 0 0 rgba(212, 175, 55, 0), 0 18px 40px rgba(0, 0, 0, .35); transform: scale(1); }
}
.pe-balance-kiosk-hint {
  margin: 0 !important;
  text-align: center;
  font-size: 1.3rem;
  font-size: clamp(1.15rem, 3vw, 1.6rem);
  font-weight: 700;
  color: #f4f1ea !important;
  letter-spacing: .04em;
  text-transform: uppercase;
}
.pe-balance-kiosk-result {
  width: min(100%, 860px);
  margin-top: clamp(1rem, 3vh, 2rem);
  padding: clamp(1.5rem, 4vw, 2.75rem) clamp(1rem, 3vw, 2rem);
  border-radius: 28px;
  border: 1px solid rgba(212, 175, 55, .35);
  background: rgba(255, 255, 255, .06);
  backdrop-filter: blur(10px);
  box-shadow: 0 24px 60px rgba(0, 0, 0, .35);
  text-align: center;
  animation: pe-balance-reveal .45s ease both;
}
@keyframes pe-balance-reveal {
  from { opacity: 0; transform: translateY(18px) scale(.98); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}
.pe-balance-kiosk-result.pe-balance-ok {
  border-color: rgba(125, 222, 160, .45);
  background: rgba(29, 94, 44, .28);
}
.pe-balance-kiosk-result.pe-balance-error {
  border-color: rgba(245, 200, 196, .5);
  background: rgba(144, 38, 27, .35);
  color: #ffd7d2;
  font-size: clamp(1.2rem, 3vw, 1.6rem);
  font-weight: 700;
}
.pe-balance-kiosk .pe-balance-label {
  margin: 0;
  font-size: clamp(1rem, 2.6vw, 1.4rem);
  font-weight: 700;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--pe-bk-ok);
}
.pe-balance-kiosk .pe-balance-amount {
  margin: .4rem 0 .7rem;
  font-family: Impact, "Arial Narrow", "Segoe UI", sans-serif;
  font-size: clamp(4.5rem, 16vw, 9.5rem);
  font-weight: 400;
  letter-spacing: .02em;
  line-height: .92;
  color: #fff;
  text-shadow: 0 10px 40px rgba(0, 0, 0, .35);
}

/* Easter Egg: doppelter Kartenscan → animierter Pleppo-Taler */
.pe-taler-egg {
  margin: 0 auto 1rem;
  text-align: center;
  perspective: 480px;
}
.pe-taler-egg-stage {
  display: flex;
  justify-content: center;
  margin: 0 auto 0.55rem;
}
.pe-taler-egg-coin {
  position: relative;
  width: clamp(72px, 14vw, 110px);
  height: clamp(72px, 14vw, 110px);
  transform-style: preserve-3d;
  animation: pe-taler-egg-spin 1.8s ease-in-out infinite;
}
.pe-taler-egg-face {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  font-family: Impact, "Arial Narrow", sans-serif;
  font-size: clamp(1.8rem, 5vw, 2.8rem);
  letter-spacing: 0.02em;
  color: #3a2a08;
  background:
    radial-gradient(circle at 32% 28%, #f7e7a4 0%, #d4af37 42%, #8a7010 100%);
  border: 3px solid rgba(255, 236, 170, 0.65);
  box-shadow:
    inset 0 0 0 4px rgba(138, 112, 16, 0.35),
    0 12px 28px rgba(0, 0, 0, 0.35);
  backface-visibility: hidden;
}
.pe-taler-egg-face--back {
  transform: rotateY(180deg);
  color: #2a2208;
}
.pe-taler-egg-msg {
  margin: 0;
  font-size: clamp(1rem, 2.4vw, 1.25rem);
  font-weight: 800;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: #d4af37;
}
.pe-taler-egg-sub {
  margin: 0.2rem 0 0;
  font-size: clamp(0.85rem, 2vw, 1.05rem);
  color: rgba(244, 241, 234, 0.7);
}
@keyframes pe-taler-egg-spin {
  0% { transform: rotateY(0deg) translateY(0); }
  40% { transform: rotateY(180deg) translateY(-10px); }
  70% { transform: rotateY(320deg) translateY(-4px); }
  100% { transform: rotateY(360deg) translateY(0); }
}
body.pe-low-power .pe-balance-kiosk-result {
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}
body.pe-low-power .pe-taler-egg-coin {
  animation-duration: 2.4s;
}
.pe-balance-kiosk .pe-balance-card {
  margin: .2rem 0;
  font-size: clamp(1.05rem, 2.5vw, 1.4rem);
  color: var(--pe-bk-muted);
}
.pe-balance-purchases-title {
  margin: 1rem 0 0.4rem;
  font-size: clamp(0.95rem, 2.2vw, 1.2rem);
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: inherit;
  opacity: 0.85;
}
.pe-balance-purchases {
  list-style: none;
  margin: 0.35rem 0 0;
  padding: 0;
  width: min(100%, 520px);
  text-align: left;
  max-height: 28vh;
  overflow-y: auto;
}
.pe-balance-purchase {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 0.15rem 0.75rem;
  padding: 0.45rem 0;
  border-top: 1px solid rgba(255, 255, 255, 0.12);
  font-size: clamp(0.9rem, 2vw, 1.1rem);
}
.pe-balance-page:not(.pe-balance-kiosk) .pe-balance-purchase {
  border-top-color: rgba(0, 0, 0, 0.08);
}
.pe-balance-purchase-name {
  font-weight: 600;
}
.pe-balance-purchase-amt {
  font-variant-numeric: tabular-nums;
  font-weight: 700;
  white-space: nowrap;
}
.pe-balance-purchase-meta {
  grid-column: 1 / -1;
  font-size: 0.85em;
  opacity: 0.7;
}
.pe-storno-list-heading {
  margin: 0.75rem 0 0.25rem;
  font-weight: 700;
  font-size: 0.95rem;
}
.pe-storno-modal-inner {
  max-width: min(640px, 96vw) !important;
}
.pe-storno-list-modal {
  max-height: min(50vh, 420px);
  overflow-y: auto;
  margin: 0.5rem 0 1rem;
}
.pe-quick-amt-custom {
  grid-column: 1 / -1;
  font-weight: 700;
}
.pe-balance-kiosk .pe-balance-countdown {
  margin-top: 1.1rem !important;
  font-size: clamp(1.2rem, 3.2vw, 1.75rem) !important;
  font-weight: 800;
  color: var(--pe-bk-gold) !important;
}

/* Idle-Randwerbung (Guthaben-Kiosk) — Visibility via .is-on / body.is-pe-balance-showing */
.pe-balance-kiosk.has-ads {
  position: relative;
}
.pe-balance-kiosk .pe-balance-idle-ads,
body.pe-balance-kiosk-body > .pe-balance-idle-ads {
  position: fixed !important;
  inset: 0 !important;
  width: 100vw !important;
  height: 100vh !important;
  height: 100dvh !important;
  z-index: 100060 !important;
  pointer-events: none !important;
  overflow: hidden !important;
}
.pe-balance-kiosk .pe-balance-kiosk-stage {
  padding-bottom: clamp(4.5rem, 10vh, 6.5rem);
}
/* Idle: Stage unter Ads, räumlich freigehalten */
.pe-balance-kiosk:not(.is-showing) .pe-balance-kiosk-stage {
  position: relative !important;
  inset: auto !important;
  top: auto !important;
  right: auto !important;
  bottom: auto !important;
  left: auto !important;
  z-index: 1 !important;
  height: auto !important;
  max-height: none !important;
  transform: none !important;
}
.pe-balance-kiosk.has-ads:not(.is-showing) .pe-balance-kiosk-stage {
  width: min(92vw, 920px) !important;
  max-width: 920px !important;
  padding-top: calc(var(--pe-balance-ad-height, 72px) + var(--pe-balance-ad-gap, 1rem)) !important;
  padding-bottom: calc(var(--pe-balance-ad-height, 72px) + var(--pe-balance-ad-gap, 1rem)) !important;
  box-sizing: border-box;
  justify-content: center;
}
.pe-balance-kiosk.has-ads:not(.is-showing) .pe-balance-kiosk-ready {
  margin-top: clamp(0.75rem, 2.5vh, 1.5rem);
}
.pe-balance-kiosk.has-ads:not(.is-showing) .pe-balance-kiosk-pulse {
  width: clamp(72px, 11vw, 112px);
  height: clamp(72px, 11vw, 112px);
}
.pe-balance-kiosk.has-ads .pe-balance-kiosk-foot {
  opacity: 0;
  visibility: hidden;
}
.pe-balance-kiosk-foot {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 2;
  padding: 0.75rem 1rem 1.1rem;
  text-align: center;
  pointer-events: none;
  background: linear-gradient(transparent, rgba(8, 9, 12, 0.92) 45%);
}
.pe-balance-kiosk-powered {
  margin: 0;
  font-size: clamp(0.8rem, 1.8vw, 1rem);
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: rgba(244, 241, 234, 0.92);
}
.pe-balance-kiosk-powered strong {
  color: #d4af37;
  font-weight: 800;
}
.pe-balance-kiosk-powered-by {
  display: inline-block;
  margin-left: 0.35rem;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: none;
  color: rgba(244, 241, 234, 0.62);
}
.pe-balance-kiosk-cta {
  margin: 0.35rem 0 0;
  font-size: clamp(0.78rem, 1.6vw, 0.95rem);
  color: rgba(244, 241, 234, 0.55);
}
.pe-balance-kiosk-cta a {
  pointer-events: auto;
  color: #d4af37;
  font-weight: 700;
  text-decoration: none;
  border-bottom: 1px solid rgba(212, 175, 55, 0.35);
}
.pe-balance-kiosk-cta a:hover,
.pe-balance-kiosk-cta a:focus-visible {
  color: #f3e2a0;
  border-bottom-color: rgba(243, 226, 160, 0.7);
}
.pe-balance-kiosk.is-showing .pe-balance-idle-ads,
body.pe-balance-kiosk-body.is-pe-balance-showing > .pe-balance-idle-ads {
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
}
/* Nach Scan: nur Guthaben-Karte mittig — Idle-Elemente ausblenden */
.pe-balance-kiosk.is-showing .pe-balance-kiosk-stage {
  position: fixed;
  inset: 0;
  z-index: 100070;
  width: 100%;
  max-width: none;
  min-height: 100dvh;
  height: 100dvh;
  margin: 0;
  padding: clamp(1rem, 4vh, 2.5rem) 1.25rem clamp(5rem, 14vh, 7rem);
  justify-content: center;
  align-items: center;
  box-sizing: border-box;
  gap: 0;
}
.pe-balance-kiosk.is-showing.has-ads .pe-balance-kiosk-stage {
  width: 100%;
  max-width: none;
  padding-bottom: clamp(5rem, 14vh, 7rem);
}
.pe-balance-kiosk.is-showing .pe-balance-kiosk-stage > *:not(:last-child) {
  display: none !important;
}
.pe-balance-kiosk.is-showing #pe-balance-result:not([hidden]) {
  display: block !important;
  margin-top: 0;
  width: min(92vw, 860px);
  max-height: min(78dvh, calc(100dvh - 9rem));
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}
.pe-balance-kiosk.is-showing #pe-balance-result[hidden] {
  display: none !important;
}
.pe-balance-ads-preview {
  display: flex;
  flex-wrap: wrap;
  gap: .5rem;
  margin: .5rem 0;
}
.pe-balance-ads-preview img,
.pe-balance-ads-preview video {
  width: 96px;
  height: 72px;
  object-fit: cover;
  border-radius: 8px;
  border: 1px solid var(--pe-line, #ddd);
  background: #eee;
}
.pe-balance-ads-preview .pe-balance-ads-chip {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: .25rem;
  padding: .35rem;
  border: 1px solid var(--pe-line, #ddd);
  border-radius: 10px;
  background: #fafafa;
  min-width: 110px;
}
.pe-balance-ads-preview .pe-balance-ads-chip span.pe-ad-type {
  position: absolute;
  left: 8px;
  bottom: 40px;
  font-size: .65rem;
  font-weight: 700;
  background: rgba(0,0,0,.65);
  color: #fff;
  padding: .1rem .3rem;
  border-radius: 4px;
  text-transform: uppercase;
}
.pe-balance-ads-preview .pe-ad-meta {
  display: flex;
  gap: .35rem;
  align-items: center;
  font-size: .75rem;
}
.pe-balance-ads-preview .pe-ad-meta label {
  display: flex;
  flex-direction: column;
  gap: .1rem;
  margin: 0;
}
.pe-balance-ads-preview .pe-ad-meta input,
.pe-balance-ads-preview .pe-ad-meta select {
  width: 4.2rem;
  font-size: .75rem;
  padding: .15rem .25rem;
}
.pe-balance-ads-preview .pe-ad-text-chip {
  min-height: 72px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: .5rem;
  font-size: .8rem;
  text-align: center;
  background: #1c1d23;
  color: #f4f1ea;
  border-radius: 8px;
}

/* Guthaben-Werbung: Live-Kiosk-Vorschau in der Verwaltung */
.pe-balance-ads-kiosk-preview-wrap {
  margin: 1rem 0;
}
.pe-balance-ads-kiosk-preview-heading {
  margin: 0 0 .35rem;
  font-size: 1rem;
}
.pe-balance-ads-kiosk-preview {
  position: relative;
  isolation: isolate;
  width: 100%;
  max-width: 720px;
  aspect-ratio: 16 / 10;
  border-radius: 14px;
  overflow: hidden;
  border: 1px solid rgba(212, 175, 55, 0.35);
  background:
    radial-gradient(ellipse 90% 70% at 50% 110%, rgba(212, 175, 55, .22), transparent 55%),
    linear-gradient(165deg, #1c1d23 0%, #121318 55%, #0c0d10 100%);
  color: #f4f1ea;
}
.pe-balance-ads-kiosk-preview-stage {
  position: relative;
  z-index: 3;
  height: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 2.5rem 1rem 3rem;
  box-sizing: border-box;
}
.pe-balance-ads-kiosk-preview-brand {
  margin: 0 0 .5rem;
  font-size: .85rem;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: #d4af37;
  font-weight: 700;
}
.pe-balance-ads-kiosk-preview-title {
  margin: 0;
  font-size: clamp(1.4rem, 4vw, 2rem);
  letter-spacing: .06em;
  text-transform: uppercase;
  font-weight: 400;
}
.pe-balance-ads-kiosk-preview-idle {
  margin: .75rem 0 0;
  font-size: .85rem;
  color: rgba(244, 241, 234, .72);
}
.pe-balance-ads-kiosk-preview-ads {
  z-index: 5;
}
.pe-balance-ads-kiosk-preview .pe-idle-marquee-lane {
  height: clamp(40px, 11%, 58px);
}
.pe-balance-ads-kiosk-preview .pe-idle-marquee-chip {
  min-width: clamp(68px, 16%, 110px);
  border-radius: 8px;
}
.pe-balance-ads-kiosk-preview.has-ads .pe-balance-ads-kiosk-preview-stage {
  padding-top: 2.8rem;
  padding-bottom: 2.4rem;
}
.pe-balance-ads-kiosk-preview-foot {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 4;
  margin: 0;
  padding: .45rem .75rem .6rem;
  text-align: center;
  font-size: .7rem;
  color: rgba(244, 241, 234, .7);
  background: linear-gradient(transparent, rgba(8, 9, 12, 0.92) 45%);
  pointer-events: none;
}
.pe-balance-ads-status {
  margin: .6rem 0 0;
  font-size: .85rem;
}
.pe-balance-ads-status.is-ok {
  color: #1a7f37;
}
.pe-balance-ads-status.is-warn {
  color: #9a6700;
}
.pe-balance-ads-status.is-error {
  color: #b42318;
}
  width: 96px;
  height: 72px;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: .35rem;
  font-size: .7rem;
  font-weight: 700;
  background: #1c1d23;
  color: #d4af37;
  border-radius: 8px;
}
.pe-balance-kiosk.is-showing .pe-balance-kiosk-ready,
.pe-balance-kiosk.is-showing .pe-balance-kiosk-idle {
  display: none !important;
}
/* Obige Regel via :not(:last-child) abgedeckt — doppelt für ältere Layouts ohne Wrapper */
@media (prefers-reduced-motion: reduce) {
  .pe-balance-kiosk-pulse,
  .pe-balance-kiosk-result { animation: none; }
}

/* ---- Offline-Station ---- */
.pe-station-badge {
  display: inline-block; vertical-align: middle; margin-left: .5rem; padding: .2rem .6rem;
  border-radius: 999px; background: rgba(212,175,55,.18); border: 1px solid var(--pe-accent-light);
  color: var(--pe-accent-light); font-size: .68rem; font-weight: 700;
  text-transform: uppercase; letter-spacing: .07em;
}
.pe-station-banner { margin-bottom: 1rem; }

@media (prefers-reduced-motion: reduce) {
  .pe-app *, .pe-app *::before, .pe-app *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}

@media (prefers-contrast: more) {
  .pe-balance-page .pe-input { border-width: 2px; border-color: var(--pe-text); }
  .pe-btn-primary { background: #000; }
}

/* ═══════════════════════════════════════════════════════════
   Globales Mobile / iPhone (gesamtes Plugin)
   ═══════════════════════════════════════════════════════════ */
.pe-table-scroll {
  width: 100%;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  margin: 0 0 .5rem;
}

@media (max-width: 768px) {
  .pe-app {
    padding: .65rem .65rem calc(1.5rem + env(safe-area-inset-bottom, 0px));
    padding-left: max(.65rem, env(safe-area-inset-left, 0px));
    padding-right: max(.65rem, env(safe-area-inset-right, 0px));
    max-width: 100vw;
    overflow-x: hidden;
  }

  .pe-app .pe-app-header {
    gap: .5rem;
    padding: .7rem .8rem;
    margin-bottom: .75rem;
    border-radius: 14px;
  }
  .pe-app .pe-app-header h1 {
    font-size: 1.1rem;
    line-height: 1.3;
    word-break: break-word;
  }
  .pe-app .pe-app-header-actions {
    width: 100%;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: .5rem;
    margin-left: 0;
  }
  .pe-app .pe-user {
    max-width: 55%;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .pe-app .pe-card {
    padding: .9rem .8rem;
    margin-bottom: .75rem;
    border-radius: 14px;
  }
  .pe-app .pe-card-head {
    flex-direction: column;
    align-items: stretch;
    gap: .55rem;
  }
  .pe-app .pe-card-head .pe-btn,
  .pe-app .pe-card-head .pe-btn-group {
    width: 100%;
  }
  .pe-app .pe-card-head .pe-btn-group {
    display: flex;
    flex-direction: column;
    gap: .45rem;
  }
  .pe-app .pe-card-head .pe-btn-group .pe-btn {
    width: 100%;
    min-height: 46px;
  }

  /* iOS: kein Zoom beim Fokus */
  .pe-app .pe-input,
  .pe-app input[type=text],
  .pe-app input[type=url],
  .pe-app input[type=password],
  .pe-app input[type=email],
  .pe-app input[type=date],
  .pe-app input[type=time],
  .pe-app input[type=number],
  .pe-app input[type=search],
  .pe-app select,
  .pe-app textarea {
    font-size: 16px !important;
    min-height: 48px;
  }
  .pe-app select[multiple] {
    min-height: 7rem;
    height: auto;
  }

  .pe-app .pe-btn {
    min-height: 46px;
    -webkit-tap-highlight-color: transparent;
  }
  .pe-app .pe-btn-sm {
    min-height: 42px;
  }
  .pe-app .pe-btn-lg {
    min-height: 54px;
    border-radius: 14px;
  }

  .pe-app .pe-form-inline {
    flex-direction: column;
    align-items: stretch;
    gap: .55rem;
  }
  .pe-app .pe-form-inline .pe-input,
  .pe-app .pe-form-inline select,
  .pe-app .pe-form-inline .pe-btn {
    width: 100%;
    margin: 0;
    flex: none;
    min-width: 0;
  }

  .pe-app .pe-btn-row {
    flex-direction: column;
  }
  .pe-app .pe-btn-row .pe-btn,
  .pe-app .pe-btn-row label.pe-btn {
    width: 100%;
    justify-content: center;
  }

  .pe-app .pe-scan-row {
    flex-direction: column;
    align-items: stretch;
  }
  .pe-app .pe-scan-row .pe-btn {
    width: 100%;
  }

  .pe-app .pe-link-row {
    flex-direction: column;
    gap: .5rem;
  }
  .pe-app .pe-link-row a {
    display: flex;
    width: 100%;
    justify-content: center;
    min-height: 46px;
  }

  .pe-app .pe-nav-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: .65rem;
    margin: .85rem 0;
  }
  .pe-app .pe-nav-tile {
    padding: 1.1rem .5rem 1rem;
    min-height: 110px;
  }
  .pe-app .pe-nav-icon {
    width: 52px;
    height: 52px;
    font-size: 1.45rem;
  }
  .pe-app .pe-nav-label {
    font-size: .88rem;
  }

  .pe-app .pe-tabs {
    display: flex;
    flex-wrap: nowrap;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    width: 100%;
    max-width: 100%;
    border-radius: 14px;
    gap: .2rem;
    padding: .3rem;
    scrollbar-width: thin;
  }
  .pe-app .pe-tab {
    flex: 0 0 auto;
    white-space: nowrap;
    min-height: 44px;
  }

  .pe-table-scroll .pe-table {
    min-width: 560px;
  }

  .pe-app .pe-modal {
    align-items: flex-end;
    padding: 0;
    padding-bottom: env(safe-area-inset-bottom, 0px);
  }
  .pe-app .pe-modal-inner {
    max-width: 100%;
    width: 100%;
    max-height: min(92vh, 92dvh);
    margin: 0;
    border-radius: 18px 18px 0 0;
    padding: 1.1rem 1rem calc(1rem + env(safe-area-inset-bottom, 0px));
  }
  .pe-app .pe-modal-actions {
    flex-direction: column;
  }
  .pe-app .pe-modal-actions .pe-btn {
    width: 100%;
  }

  /* Portal */
  .pe-portal .pe-portal-header {
    flex-wrap: wrap;
  }
  .pe-portal .pe-org-switch select,
  .pe-portal .pe-event-switch select {
    min-width: 0;
    width: 100%;
  }
  .pe-portal #pe-save-active-event {
    width: 100%;
  }

  /* Berichte */
  .pe-app #pe-tab-reports .pe-card-head,
  .pe-app .pe-report-output {
    overflow-x: auto;
  }
  .pe-app #pe-report-event,
  .pe-app #pe-report-type,
  .pe-app #pe-load-report,
  .pe-app #pe-export-report-csv,
  .pe-app #pe-export-report-pdf {
    width: 100%;
  }

  /* Benutzer */
  #pe-users-panel .pe-btn-group {
    display: flex;
    flex-direction: column;
    width: 100%;
    gap: .45rem;
  }
  #pe-users-panel .pe-btn-group .pe-btn {
    width: 100%;
  }

  /* Login */
  .pe-portal-login .pe-card,
  .pe-login-card {
    margin: .5rem;
  }
  .pe-portal-login input[type=text],
  .pe-portal-login input[type=password],
  .pe-portal-login input[type=submit],
  .pe-portal-login #loginform input {
    font-size: 16px !important;
    min-height: 48px;
  }

  /* Guthaben öffentlich */
  .pe-balance-page {
    padding: 1.25rem .75rem calc(1.5rem + env(safe-area-inset-bottom, 0px));
  }
}

@media (max-width: 380px) {
  .pe-app .pe-nav-grid {
    grid-template-columns: 1fr 1fr;
    gap: .5rem;
  }
  .pe-app .pe-nav-label { font-size: .8rem; }
}

@media (hover: none) and (pointer: coarse) {
  .pe-app .pe-nav-tile:active {
    transform: scale(.98);
    border-color: rgba(212, 175, 55, .7);
  }
  .pe-app a,
  .pe-app button {
    touch-action: manipulation;
  }
}

/* Toast nach Scan / Transaktion (Kasse & Verkauf) */
.pe-toast {
  position: fixed;
  left: 50%;
  bottom: calc(1.5rem + env(safe-area-inset-bottom, 0px));
  z-index: 1000000;
  max-width: min(92vw, 420px);
  padding: 1rem 1.25rem;
  border-radius: 16px;
  font-size: 1.1rem;
  font-weight: 650;
  line-height: 1.35;
  text-align: center;
  box-shadow: 0 12px 40px rgba(28, 29, 35, .28);
  transform: translate(-50%, 120%);
  opacity: 0;
  transition: transform .28s ease, opacity .28s ease;
  pointer-events: none;
}
.pe-toast-show {
  transform: translate(-50%, 0);
  opacity: 1;
}
.pe-toast-ok {
  background: #14663a;
  color: #fff;
}
.pe-toast-info {
  background: #1c1d23;
  color: #fff;
}
.pe-toast-warn {
  background: #9a6700;
  color: #fff;
}
.pe-toast-err {
  background: #90261b;
  color: #fff;
}
.pe-scan-busy {
  opacity: .72;
  background: #eef2f6 !important;
  cursor: wait;
}

/* Bildschirm-Zifferntastatur (Auszahlung / Beträge) */
.pe-amount-pad-target {
  cursor: pointer;
  font-size: 1.35rem !important;
  font-weight: 700;
  letter-spacing: .02em;
  text-align: right;
  caret-color: transparent;
}
.pe-amount-pad-target.pe-amount-pad-open {
  outline: 2px solid var(--pe-accent, #b8960c);
  outline-offset: 2px;
  box-shadow: 0 0 0 3px rgba(184, 150, 12, .22);
}
.pe-keypad {
  margin: .55rem 0 .75rem;
  padding: .55rem;
  border: 1px solid var(--pe-line, #d8dde6);
  border-radius: 14px;
  background: var(--pe-bg, #f3f2ef);
}
.pe-keypad-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: .4rem;
}
.pe-keypad-key {
  min-height: 52px;
  font-size: 1.25rem;
  font-weight: 700;
  border-radius: 12px;
  margin: 0;
  -webkit-tap-highlight-color: transparent;
}
.pe-keypad-back { font-size: 1.1rem; }
.pe-keypad-max,
.pe-keypad-done {
  font-size: 1rem;
  min-height: 52px;
}
.pe-keypad-done-wide {
  grid-column: span 2;
}

.pe-osk-target,
.pe-amount-pad-target {
  cursor: pointer;
  caret-color: transparent;
}
.pe-osk-target.pe-osk-open {
  outline: 2px solid var(--pe-accent, #b8960c);
  outline-offset: 2px;
  box-shadow: 0 0 0 3px rgba(184, 150, 12, .22);
}
.pe-osk {
  margin: .35rem 0 .75rem;
  padding: .45rem;
  border: 1px solid var(--pe-line, #d8dde6);
  border-radius: 14px;
  background: var(--pe-bg, #f3f2ef);
}
.pe-osk-row {
  display: flex;
  gap: .28rem;
  justify-content: stretch;
  margin-bottom: .28rem;
}
.pe-osk-key {
  flex: 1 1 0;
  min-width: 0;
  min-height: 46px;
  margin: 0;
  padding: 0 .15rem;
  font-size: 1.05rem;
  font-weight: 700;
  border-radius: 10px;
  -webkit-tap-highlight-color: transparent;
}
.pe-osk-key-mod { flex: 1.35 1 0; font-size: .92rem; }
.pe-osk-key-mod.is-active {
  background: var(--pe-accent, #b8960c);
  color: #fff;
  border-color: var(--pe-accent, #b8960c);
}
.pe-osk-key-space { flex: 3.2 1 0; font-size: .95rem; }
.pe-osk-key-done { flex: 1.8 1 0; font-size: .95rem; }
.pe-order-line-modal-inner {
  max-width: min(96vw, 720px);
  width: min(96vw, 720px);
}
html[data-pe-theme="dark"] .pe-osk {
  background: #1c1d23;
  border-color: #3a3d48;
}
html[data-pe-theme="dark"] .pe-osk-key {
  background: #2a2d36;
  color: #f3f3f3;
}

#pe-kasse-payout-balance-hint {
  margin: .25rem 0 .55rem;
  font-weight: 600;
}

/* Großes Guthaben-Popup (Verkauf: Karte ohne Warenkorb) */
.pe-balance-popup {
  position: fixed;
  inset: 0;
  z-index: 1000001;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1.5rem;
  background: rgba(28, 29, 35, .45);
  opacity: 0;
  transition: opacity .28s ease;
  pointer-events: none;
}
.pe-balance-popup-show {
  opacity: 1;
  pointer-events: auto;
}
.pe-balance-popup-card {
  min-width: min(88vw, 340px);
  max-width: min(96vw, 440px);
  max-height: 96vh;
  overflow: auto;
  padding: 2rem 2.25rem;
  border-radius: 20px;
  background: #14663a;
  color: #fff;
  text-align: center;
  box-shadow: 0 20px 50px rgba(28, 29, 35, .35);
  transform: scale(.92);
  transition: transform .28s ease;
}
.pe-balance-popup-show .pe-balance-popup-card {
  transform: scale(1);
}
.pe-balance-popup-label {
  font-size: .95rem;
  font-weight: 600;
  letter-spacing: .04em;
  text-transform: uppercase;
  opacity: .9;
  margin-bottom: .35rem;
}
.pe-balance-popup-amount {
  font-size: clamp(2.5rem, 10vw, 3.5rem);
  font-weight: 800;
  line-height: 1.1;
  letter-spacing: -.02em;
}
.pe-balance-popup-sub {
  margin-top: .55rem;
  font-size: clamp(1rem, 3.5vw, 1.25rem);
  font-weight: 600;
  line-height: 1.35;
  opacity: .95;
  white-space: pre-line;
}
.pe-balance-popup-uid {
  margin-top: .65rem;
  font-size: .95rem;
  font-weight: 500;
  opacity: .85;
}
.pe-balance-popup-payout .pe-balance-popup-card {
  background: #8a6a0a;
}
.pe-balance-popup-require-ok {
  pointer-events: auto;
}
.pe-balance-popup-actions {
  display: flex;
  flex-wrap: wrap;
  gap: .75rem;
  justify-content: center;
  margin-top: 1.25rem;
}
.pe-balance-popup-ok {
  min-width: 10rem;
  font-size: 1.15rem;
  font-weight: 700;
  padding: .75rem 1.5rem;
  background: #fff !important;
  color: #1a1a1a !important;
  border: 0 !important;
}
.pe-balance-popup-cancel {
  min-width: 8rem;
  font-size: 1.05rem;
  font-weight: 600;
  padding: .75rem 1.25rem;
  background: transparent !important;
  color: #fff !important;
  border: 2px solid rgba(255, 255, 255, .65) !important;
}
.pe-balance-popup-has-tender .pe-balance-popup-card {
  padding: 1.25rem 1.35rem 1.5rem;
  max-height: min(92dvh, 760px);
}
.pe-balance-popup-tender {
  margin-top: .85rem;
  text-align: center;
}
.pe-balance-popup-tender-label {
  font-size: .9rem;
  font-weight: 700;
  letter-spacing: .03em;
  text-transform: uppercase;
  margin-bottom: .35rem;
}
.pe-balance-popup-tender-label span {
  font-weight: 500;
  text-transform: none;
  letter-spacing: 0;
  opacity: .8;
}
.pe-balance-popup-tender .pe-input {
  display: block;
  width: 100%;
  max-width: 12rem;
  margin: 0 auto .45rem;
  text-align: center;
  font-size: 1.55rem;
  font-weight: 800;
  background: #fff;
  color: #111;
  border: 0;
  border-radius: 12px;
  padding: .45rem .6rem;
}
.pe-balance-tender-quick {
  display: flex;
  gap: .4rem;
  justify-content: center;
  margin-bottom: .45rem;
}
.pe-balance-tender-quick-btn {
  min-width: 4.2rem;
  min-height: 42px;
  margin: 0;
  font-weight: 800;
  background: rgba(255, 255, 255, .92) !important;
  color: #1a1a1a !important;
  border: 0 !important;
}
.pe-balance-popup-tender .pe-keypad {
  margin: 0;
  background: rgba(255, 255, 255, .12);
  border-color: rgba(255, 255, 255, .28);
  gap: .4rem;
}
.pe-balance-popup-tender .pe-keypad-key {
  background: rgba(255, 255, 255, .94);
  color: #111;
  min-height: 40px;
  font-size: 1.05rem;
}
.pe-balance-popup-change {
  margin-top: .7rem;
  font-size: clamp(1.25rem, 4.5vw, 1.7rem);
  font-weight: 800;
  line-height: 1.2;
}
.pe-balance-popup-change.is-ok {
  color: #fde047;
}
.pe-balance-popup-change.is-short {
  color: #fecaca;
}

@media (max-width: 768px) {
  .pe-balance-popup {
    padding: .75rem;
  }
  .pe-balance-popup-has-tender .pe-balance-popup-card {
    padding: .9rem .85rem 1rem;
    max-height: 94dvh;
  }
  .pe-balance-popup-label {
    font-size: .82rem;
    margin-bottom: .2rem;
  }
  .pe-balance-popup-amount {
    font-size: clamp(1.8rem, 8vw, 2.5rem);
  }
  .pe-balance-popup-sub {
    margin-top: .35rem;
    font-size: clamp(.9rem, 3.2vw, 1.05rem);
    line-height: 1.22;
  }
  .pe-balance-popup-tender .pe-input {
    font-size: 1.25rem;
    max-width: 10rem;
    margin-bottom: .3rem;
  }
  .pe-balance-tender-quick {
    margin-bottom: .3rem;
  }
  .pe-balance-tender-quick-btn {
    min-height: 36px;
    min-width: 3.5rem;
    font-size: .95rem;
  }
  .pe-balance-popup-tender .pe-keypad-key {
    min-height: 34px;
    font-size: .95rem;
    padding: .3rem;
  }
  .pe-balance-popup-actions {
    margin-top: .75rem;
    gap: .5rem;
  }
  .pe-balance-popup-ok,
  .pe-balance-popup-cancel {
    padding: .55rem .9rem;
    font-size: .95rem;
    min-width: 7.5rem;
  }
  .pe-toast {
    font-size: 1.15rem;
    padding: 1.1rem 1.2rem;
    bottom: calc(1.25rem + env(safe-area-inset-bottom, 0px));
  }
}

/* ── Tag / Nacht: dunkle Flächen (Kacheln, Warenkorb, Admin, Landing) ── */
html[data-pe-theme="dark"] .pe-product-tile,
html[data-pe-theme="dark"] .pe-super-card,
html[data-pe-theme="dark"] .pe-super-form-card {
  background: var(--pe-surface);
  border-color: var(--pe-line);
  color: var(--pe-text);
}
html[data-pe-theme="dark"] .pe-product-tile.deposit_charge,
html[data-pe-theme="dark"] .pe-product-tile.pe-product-deposit_charge {
  background: #2a2210;
  border-color: #b8960c;
}
html[data-pe-theme="dark"] .pe-product-tile.deposit_refund,
html[data-pe-theme="dark"] .pe-product-tile.pe-product-deposit_refund {
  background: #14241a;
  border-color: #3d9b5f;
}
html[data-pe-theme="dark"] .pe-cart-panel,
html[data-pe-theme="dark"] .pe-card-info,
html[data-pe-theme="dark"] .pe-topup-qr,
html[data-pe-theme="dark"] .pe-shift-day-head,
html[data-pe-theme="dark"] .pe-cl-agenda-date {
  background: var(--pe-surface-2);
  border-color: var(--pe-line);
  color: var(--pe-text);
}
html[data-pe-theme="dark"] .pe-topup-qr-payout,
html[data-pe-theme="dark"] .pe-qr-kind-payout {
  background: rgba(185, 28, 28, 0.18);
  border-color: rgba(252, 165, 165, 0.45);
}
html[data-pe-theme="dark"] .pe-topup-qr-payout .pe-topup-qr-label,
html[data-pe-theme="dark"] .pe-qr-kind-payout .pe-topup-qr-label {
  color: #fca5a5;
}
html[data-pe-theme="dark"] .pe-qr-kind-topup {
  background: rgba(22, 163, 74, 0.2);
  border-color: rgba(134, 239, 172, 0.5);
}
html[data-pe-theme="dark"] .pe-qr-kind-topup .pe-topup-qr-label { color: #86efac; }
html[data-pe-theme="dark"] .pe-qr-kind-all {
  background: rgba(37, 99, 235, 0.22);
  border-color: rgba(147, 197, 253, 0.5);
}
html[data-pe-theme="dark"] .pe-qr-kind-all .pe-topup-qr-label { color: #93c5fd; }
html[data-pe-theme="dark"] .pe-qr-kind-activate {
  background: rgba(202, 138, 4, 0.28);
  border-color: rgba(253, 224, 71, 0.55);
}
html[data-pe-theme="dark"] .pe-qr-kind-activate .pe-topup-qr-label { color: #fde047; }
html[data-pe-theme="dark"] .pe-qr-kind-block {
  background: rgba(63, 63, 70, 0.45);
  border-color: rgba(161, 161, 170, 0.5);
}
html[data-pe-theme="dark"] .pe-qr-kind-block .pe-topup-qr-label { color: #e4e4e7; }
html[data-pe-theme="dark"] .pe-qr-kind-return {
  background: rgba(194, 65, 12, 0.22);
  border-color: rgba(253, 186, 116, 0.5);
}
html[data-pe-theme="dark"] .pe-qr-kind-return .pe-topup-qr-label { color: #fdba74; }
html[data-pe-theme="dark"] .pe-cart-qty-btn {
  background: var(--pe-tabs-bg);
  color: var(--pe-text);
  border-color: var(--pe-line);
}
html[data-pe-theme="dark"] .pe-cart-qty-btn:hover { background: var(--pe-line); }
html[data-pe-theme="dark"] .pe-cart-remove { color: #ffb4ab; }
html[data-pe-theme="dark"] .pe-cart-remove:hover { background: var(--pe-error-bg); }
html[data-pe-theme="dark"] .pe-cl-assignees {
  background: #243044;
  color: #c5d4ea;
}
html[data-pe-theme="dark"] .pe-cl-due-future { background: #2a2d36; color: var(--pe-muted); }
html[data-pe-theme="dark"] .pe-cl-due-soon { background: #3a3218; color: #f0d878; }
html[data-pe-theme="dark"] .pe-cl-due-over { background: var(--pe-error-bg); color: var(--pe-error-text); }
html[data-pe-theme="dark"] .pe-cl-due-done { background: var(--pe-success-bg); color: var(--pe-success-text); }
html[data-pe-theme="dark"] .pe-email-missing { background: #3a3218; color: #f0d878; }
html[data-pe-theme="dark"] .pe-public-inner,
html[data-pe-theme="dark"] .pe-balance-card {
  background: var(--pe-surface) !important;
  color: var(--pe-text);
  border-color: var(--pe-line);
}
html[data-pe-theme="dark"] .pe-toast {
  background: var(--pe-surface);
  color: var(--pe-text);
  border-color: var(--pe-line);
}
html[data-pe-theme="dark"] .pe-numpad button,
html[data-pe-theme="dark"] .pe-keypad button,
html[data-pe-theme="dark"] .pe-keypad-key {
  background: var(--pe-surface);
  color: var(--pe-text);
  border-color: var(--pe-line);
}
html[data-pe-theme="dark"] .pe-keypad {
  background: var(--pe-surface);
  border-color: var(--pe-line);
}
html[data-pe-theme="dark"] body.pe-display-page,
html[data-pe-theme="dark"] body.pe-display-page .pe-app {
  background: #05070c !important;
}
.pe-super-wrap {
  background: var(--pe-bg);
  color: var(--pe-text);
  min-height: 100vh;
  padding: 1rem;
  box-sizing: border-box;
}
.pe-rental-badge {
  display: inline-block;
  font-weight: 700;
  letter-spacing: 0.02em;
  color: var(--pe-accent, #0b5fff);
}
.pe-kasse-customer-page,
.pe-kasse-customer-page .pe-app {
  background: #121318 !important;
  color: #f4f1ea;
  min-height: 100vh;
  margin: 0;
}
.pe-kasse-customer.pe-balance-kiosk {
  --pe-bk-ink: #f4f1ea;
  --pe-bk-muted: rgba(244, 241, 234, .72);
  --pe-bk-gold: #d4af37;
  --pe-bk-ok: #7ddea0;
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 100vh;
  min-height: 100dvh;
  padding: 2.5cm 2.5cm !important; /* ~5 cm kleiner, zentriert */
  text-align: center;
  box-sizing: border-box;
  position: relative;
  overflow: hidden;
}
.pe-kasse-customer-stage.pe-balance-kiosk-stage {
  position: relative;
  z-index: 2;
  width: min(88vw, 760px);
  max-width: 760px;
  min-height: 0;
  height: auto;
  max-height: calc(100dvh - 5cm);
  margin: 0 auto;
  padding: clamp(0.75rem, 2vh, 1.5rem) 1rem;
  justify-content: center;
  gap: 0.25rem;
  box-sizing: border-box;
}
.pe-kasse-customer-kiosk {
  position: absolute !important;
  top: 0.75rem;
  right: 0.75rem;
  z-index: 8;
  padding: 0.35rem 0.7rem !important;
  font-size: 0.85rem !important;
  font-weight: 700 !important;
  color: #f4f1ea !important;
  background: rgba(255, 255, 255, 0.1) !important;
  border: 1px solid rgba(212, 175, 55, 0.45) !important;
  border-radius: 10px !important;
}
.pe-kasse-customer .pe-kasse-customer-brand,
.pe-kasse-customer .pe-balance-kiosk-wordmark {
  margin: 0 0 0.25rem;
  font-size: clamp(2.1rem, 7vw, 3.8rem) !important;
  line-height: 0.92;
}
.pe-kasse-customer .pe-balance-kiosk-ready {
  margin-top: clamp(0.85rem, 2.5vh, 1.6rem);
  gap: 0.75rem;
}
.pe-kasse-customer .pe-balance-kiosk-pulse {
  width: clamp(64px, 10vw, 100px);
  height: clamp(64px, 10vw, 100px);
}
.pe-kasse-customer .pe-kasse-customer-hint,
.pe-kasse-customer .pe-balance-kiosk-hint {
  margin: 0;
  font-size: clamp(0.95rem, 2.4vw, 1.35rem) !important;
}
.pe-kasse-customer-panel {
  position: relative;
  z-index: 6;
  width: min(100%, 700px);
  margin-top: clamp(0.6rem, 2vh, 1.25rem);
  padding: clamp(1rem, 2.5vw, 1.75rem) clamp(0.75rem, 2vw, 1.35rem) !important;
  border-radius: 22px;
}
.pe-kasse-customer-panel .pe-balance-label,
.pe-kasse-customer-panel .pe-kasse-customer-label {
  font-size: clamp(0.85rem, 2.1vw, 1.15rem) !important;
}
.pe-kasse-customer-panel .pe-balance-amount,
.pe-kasse-customer-panel .pe-kasse-customer-amount {
  font-size: clamp(3rem, 11vw, 6.5rem) !important;
  margin: 0.25rem 0 0.4rem !important;
  line-height: 0.95;
}
.pe-kasse-customer-panel .pe-kasse-customer-sub {
  font-size: clamp(1.05rem, 3vw, 1.55rem);
  font-weight: 700;
  color: rgba(255, 255, 255, 0.95);
  margin: 0.25rem 0 0.5rem;
  line-height: 1.35;
}
.pe-kasse-customer-panel .pe-balance-card,
.pe-kasse-customer-panel .pe-kasse-customer-uid {
  font-size: clamp(0.8rem, 2vw, 1.1rem) !important;
}
.pe-kasse-customer {
  position: relative;
}
.pe-kasse-customer-idle {
  position: relative;
  z-index: 2;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
.pe-kasse-customer .pe-kasse-customer-idle-ads {
  z-index: 1;
}
.pe-kasse-customer-panel {
  position: relative;
  z-index: 3;
}
.pe-presence-dot {
  display: inline-block;
  width: 0.55rem;
  height: 0.55rem;
  border-radius: 50%;
  margin-right: 0.35rem;
  vertical-align: middle;
  background: #9aa3b2;
}
.pe-presence-dot.is-on {
  background: #2f9e5b;
  box-shadow: 0 0 0 3px rgba(47, 158, 91, 0.22);
}
.pe-presence-online { color: #1f7a45; font-weight: 700; }
.pe-presence-offline { color: #6b7280; }
.pe-registers-status {
  margin: 0 0 0.85rem;
  padding: 0.65rem 0.85rem;
  border-radius: 8px;
  background: var(--pe-tabs-bg, #f0eeea);
  color: var(--pe-text, #1c1d23);
  font-size: 0.92rem;
  line-height: 1.4;
}
.pe-registers-status strong { font-weight: 700; }
.pe-phase-live { background: #d9f5e4; color: #146c3a; }
.pe-phase-setup { background: #fff3d6; color: #8a5b00; }
.pe-phase-planning { background: #e8eef8; color: #2a4a7a; }
.pe-phase-teardown,
.pe-phase-billing { background: #eee; color: #555; }
.pe-scan-flash-ok {
  animation: peScanFlashOk 0.55s ease;
}
.pe-scan-flash-err {
  animation: peScanFlashErr 0.55s ease;
}
@keyframes peScanFlashOk {
  0%, 100% { box-shadow: none; background-color: inherit; }
  35% { box-shadow: 0 0 0 3px rgba(34, 160, 80, 0.55); background-color: rgba(34, 160, 80, 0.12); }
}
@keyframes peScanFlashErr {
  0%, 100% { box-shadow: none; background-color: inherit; }
  35% { box-shadow: 0 0 0 3px rgba(200, 40, 40, 0.55); background-color: rgba(200, 40, 40, 0.1); }
}
.pe-scan-uid-err {
  display: inline-block;
  font-size: 1.6rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  line-height: 1.2;
}
.pe-scan-log {
  margin: 0.5rem 0 0;
  padding-left: 1.25rem;
  font-size: 0.9rem;
  max-height: 9rem;
  overflow: auto;
}
.pe-scan-log-ok { color: #1a7a3a; }
.pe-scan-log-err { color: #b02020; }
.pe-kasse-return-bar .pe-btn[aria-pressed="true"] {
  outline: 2px solid var(--pe-accent, #0b5fff);
}

/* Kasse: Bondruck-Dialog nach Aufladung (5 s) */
#pe-kasse-print-receipt {
  width: 100%;
  margin-top: .45rem;
  min-height: 44px;
}
.pe-kasse-receipt-prompt-inner {
  text-align: center;
  max-width: 360px;
}
.pe-kasse-receipt-prompt-title {
  margin: 0 0 .35rem;
  font-size: 1.25rem;
  font-weight: 700;
}
.pe-kasse-receipt-prompt-sub {
  margin: 0 0 1rem;
  font-size: 1.05rem;
}
#pe-kasse-receipt-prompt-print {
  width: 100%;
  min-height: 56px;
  font-size: 1.15rem;
}
.pe-kasse-receipt-prompt-timer {
  margin: .85rem 0 .35rem;
}
#pe-kasse-receipt-prompt-skip {
  margin-top: .25rem;
}

.pe-kasse-laufzettel-modal-inner {
  text-align: center;
  max-width: 420px;
}
.pe-kasse-amount-modal-inner {
  max-width: min(92vw, 420px);
  padding: 1rem 1.1rem 1.15rem;
}
.pe-kasse-amount-modal-inner h3 {
  margin: 0 0 .45rem;
  font-size: 1.15rem;
}
.pe-kasse-amount-modal-inner .pe-kasse-amount-label {
  display: block;
  margin-bottom: .25rem;
  font-weight: 700;
}
.pe-kasse-amount-modal-inner #pe-kasse-amount {
  display: block;
  width: 100%;
  max-width: 14rem;
  margin: 0 auto .55rem;
  text-align: center;
  font-size: clamp(1.45rem, 4.2vh, 1.85rem);
  font-weight: 800;
}
.pe-kasse-amount-modal-inner .pe-keypad {
  margin: 0 0 .65rem;
}
.pe-kasse-amount-modal-inner .pe-keypad-key {
  min-height: clamp(40px, 7.2vh, 52px);
  font-size: clamp(1.05rem, 2.6vh, 1.25rem);
}
@media (max-height: 700px) {
  .pe-kasse-amount-modal-inner {
    padding: .7rem .8rem .85rem;
  }
  .pe-kasse-amount-modal-inner .pe-keypad-grid {
    gap: .28rem;
  }
  .pe-kasse-amount-modal-inner .pe-keypad-key {
    min-height: clamp(36px, 6.4vh, 44px);
  }
}
.pe-kasse-laufzettel-modal-title {
  margin: 0 0 .35rem;
  font-size: 1.15rem;
}
.pe-kasse-laufzettel-modal-amount {
  margin: 0 0 .75rem;
  font-size: clamp(1.6rem, 4vw, 2.1rem);
  font-weight: 800;
  letter-spacing: -0.02em;
}
.pe-kasse-laufzettel-modal-actions {
  display: flex;
  flex-direction: column;
  gap: .45rem;
}
.pe-kasse-laufzettel-modal-actions .pe-btn-lg {
  width: 100%;
  min-height: 52px;
}

/* ─── POS-Kiosk: randlos, voller Bildschirm (Kasse / Verkauf / Bestellkasse) ───────────── */
html.pe-pos-kiosk-pref:has(#pe-kasse) body,
html.pe-pos-kiosk-pref:has(#pe-verkauf) body,
html.pe-pos-kiosk-pref:has(#pe-bestellung) body,
html.pe-pos-kiosk-pref:has(#pe-station) body,
body.pe-pos-kiosk {
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  background: var(--pe-bg, #f3f2ef);
}
html.pe-pos-kiosk-pref:has(#pe-kasse) #wpadminbar,
html.pe-pos-kiosk-pref:has(#pe-verkauf) #wpadminbar,
html.pe-pos-kiosk-pref:has(#pe-bestellung) #wpadminbar,
html.pe-pos-kiosk-pref:has(#pe-station) #wpadminbar,
html.pe-pos-kiosk-pref:has(#pe-kasse) header:not(.pe-app-header),
html.pe-pos-kiosk-pref:has(#pe-verkauf) header:not(.pe-app-header),
html.pe-pos-kiosk-pref:has(#pe-bestellung) header:not(.pe-app-header),
html.pe-pos-kiosk-pref:has(#pe-station) header:not(.pe-app-header),
html.pe-pos-kiosk-pref:has(#pe-kasse) footer:not(.pe-lp-footer),
html.pe-pos-kiosk-pref:has(#pe-verkauf) footer:not(.pe-lp-footer),
html.pe-pos-kiosk-pref:has(#pe-bestellung) footer:not(.pe-lp-footer),
html.pe-pos-kiosk-pref:has(#pe-station) footer:not(.pe-lp-footer),
html.pe-pos-kiosk-pref:has(#pe-kasse) .site-header,
html.pe-pos-kiosk-pref:has(#pe-verkauf) .site-header,
html.pe-pos-kiosk-pref:has(#pe-bestellung) .site-header,
html.pe-pos-kiosk-pref:has(#pe-station) .site-header,
html.pe-pos-kiosk-pref:has(#pe-kasse) .site-footer,
html.pe-pos-kiosk-pref:has(#pe-verkauf) .site-footer,
html.pe-pos-kiosk-pref:has(#pe-bestellung) .site-footer,
html.pe-pos-kiosk-pref:has(#pe-station) .site-footer,
html.pe-pos-kiosk-pref:has(#pe-kasse) .pe-kiosk-exit,
html.pe-pos-kiosk-pref:has(#pe-verkauf) .pe-kiosk-exit,
html.pe-pos-kiosk-pref:has(#pe-bestellung) .pe-kiosk-exit,
html.pe-pos-kiosk-pref:has(#pe-station) .pe-kiosk-exit,
body.pe-pos-kiosk #wpadminbar,
body.pe-pos-kiosk header:not(.pe-app-header),
body.pe-pos-kiosk footer:not(.pe-lp-footer),
body.pe-pos-kiosk .site-header,
body.pe-pos-kiosk .site-footer,
body.pe-pos-kiosk .pe-kiosk-exit {
  display: none !important;
}
html.pe-pos-kiosk-pref .pe-app.pe-kasse,
html.pe-pos-kiosk-pref .pe-app.pe-verkauf,
html.pe-pos-kiosk-pref .pe-app.pe-bestellung,
html.pe-pos-kiosk-pref .pe-app.pe-station,
body.pe-pos-kiosk .pe-app.pe-kasse,
body.pe-pos-kiosk .pe-app.pe-verkauf,
body.pe-pos-kiosk .pe-app.pe-bestellung,
body.pe-pos-kiosk .pe-app.pe-station {
  width: 100% !important;
  max-width: none !important;
  height: 100dvh;
  max-height: 100dvh;
  min-height: 0;
  margin: 0 !important;
  padding: 0 0 env(safe-area-inset-bottom, 0px) !important;
  border-radius: 0;
  box-shadow: none;
  overflow: hidden;
}
html.pe-pos-kiosk-pref .pe-kasse > .pe-app-header,
html.pe-pos-kiosk-pref .pe-verkauf > .pe-app-header,
html.pe-pos-kiosk-pref .pe-bestellung .pe-app-header,
html.pe-pos-kiosk-pref .pe-station .pe-app-header,
body.pe-pos-kiosk .pe-kasse > .pe-app-header,
body.pe-pos-kiosk .pe-verkauf > .pe-app-header,
body.pe-pos-kiosk .pe-bestellung .pe-app-header,
body.pe-pos-kiosk .pe-station .pe-app-header {
  margin: 0 !important;
  margin-top: env(safe-area-inset-top, 0px) !important;
  padding: .35rem .55rem;
  border-radius: 0;
  border-left: none;
  border-right: none;
  border-top: none;
  gap: .35rem;
}
html.pe-pos-kiosk-pref .pe-kasse .pe-pos-body,
html.pe-pos-kiosk-pref .pe-verkauf .pe-verkauf-layout,
body.pe-pos-kiosk .pe-kasse .pe-pos-body,
body.pe-pos-kiosk .pe-verkauf .pe-verkauf-layout {
  padding: .25rem .45rem .35rem;
  min-height: 0;
  gap: clamp(4px, 0.55vh, 8px);
}
html.pe-pos-kiosk-pref .pe-kasse .pe-kasse-actions,
body.pe-pos-kiosk .pe-kasse .pe-kasse-actions {
  padding: .3rem .4rem;
}
html.pe-pos-kiosk-pref .pe-kasse #pe-kasse-scan-card,
body.pe-pos-kiosk .pe-kasse #pe-kasse-scan-card {
  padding: .45rem .55rem;
  gap: 6px;
}
html.pe-pos-kiosk-pref .pe-kasse .pe-scan-log,
body.pe-pos-kiosk .pe-kasse .pe-scan-log {
  max-height: 3.2rem;
  font-size: .8rem;
}
html.pe-pos-kiosk-pref .pe-verkauf .pe-products-panel,
html.pe-pos-kiosk-pref .pe-verkauf .pe-cart-panel,
body.pe-pos-kiosk .pe-verkauf .pe-products-panel,
body.pe-pos-kiosk .pe-verkauf .pe-cart-panel {
  padding: .5rem .55rem;
}
html.pe-pos-kiosk-pref .pe-verkauf .pe-product-grid,
body.pe-pos-kiosk .pe-verkauf .pe-product-grid {
  grid-template-columns: repeat(auto-fill, minmax(clamp(140px, 12vw, 190px), 1fr));
  gap: .55rem;
}
html.pe-pos-kiosk-pref .pe-verkauf .pe-product-tile,
body.pe-pos-kiosk .pe-verkauf .pe-product-tile {
  min-height: clamp(125px, 16vh, 168px);
}
html.pe-pos-kiosk-pref .pe-verkauf .pe-cart-scan-hint,
body.pe-pos-kiosk .pe-verkauf .pe-cart-scan-hint {
  display: none;
}
html.pe-pos-kiosk-pref .pe-kasse .pe-app-header > a.pe-btn[href*="portal"],
html.pe-pos-kiosk-pref .pe-verkauf .pe-app-header > a.pe-btn[href*="portal"],
html.pe-pos-kiosk-pref .pe-bestellung .pe-app-header > a.pe-btn[href*="portal"],
html.pe-pos-kiosk-pref .pe-station .pe-app-header > a.pe-btn[href*="portal"],
body.pe-pos-kiosk .pe-kasse .pe-app-header > a.pe-btn[href*="portal"],
body.pe-pos-kiosk .pe-verkauf .pe-app-header > a.pe-btn[href*="portal"],
body.pe-pos-kiosk .pe-bestellung .pe-app-header > a.pe-btn[href*="portal"],
body.pe-pos-kiosk .pe-station .pe-app-header > a.pe-btn[href*="portal"] {
  display: none;
}
html.pe-pos-kiosk-pref .pe-kasse .pe-app-header .pe-btn-logout,
html.pe-pos-kiosk-pref .pe-verkauf .pe-app-header .pe-btn-logout,
html.pe-pos-kiosk-pref .pe-bestellung .pe-app-header .pe-btn-logout,
html.pe-pos-kiosk-pref .pe-station .pe-app-header .pe-btn-logout,
body.pe-pos-kiosk .pe-kasse .pe-app-header .pe-btn-logout,
body.pe-pos-kiosk .pe-verkauf .pe-app-header .pe-btn-logout,
body.pe-pos-kiosk .pe-bestellung .pe-app-header .pe-btn-logout,
body.pe-pos-kiosk .pe-station .pe-app-header .pe-btn-logout,
body.pe-kiosk .pe-kasse .pe-app-header .pe-btn-logout,
body.pe-kiosk .pe-verkauf .pe-app-header .pe-btn-logout,
body.pe-kiosk .pe-bestellung .pe-app-header .pe-btn-logout,
body.pe-kiosk .pe-station .pe-app-header .pe-btn-logout {
  display: inline-flex !important;
  visibility: visible !important;
  opacity: 1 !important;
  pointer-events: auto !important;
  flex: 0 0 auto;
  margin-left: auto;
  order: 100;
  position: relative;
  z-index: 8;
}
.pe-app.pe-kasse .pe-app-header .pe-btn-logout,
.pe-app.pe-verkauf .pe-app-header .pe-btn-logout,
.pe-app.pe-bestellung .pe-app-header .pe-btn-logout,
.pe-app.pe-station .pe-app-header .pe-btn-logout {
  flex-shrink: 0;
  margin-left: auto;
  order: 100;
}
html.pe-pos-kiosk-pref .pe-kasse .pe-app-header,
html.pe-pos-kiosk-pref .pe-verkauf .pe-app-header,
html.pe-pos-kiosk-pref .pe-bestellung .pe-app-header,
html.pe-pos-kiosk-pref .pe-station .pe-app-header,
body.pe-pos-kiosk .pe-kasse .pe-app-header,
body.pe-pos-kiosk .pe-verkauf .pe-app-header,
body.pe-pos-kiosk .pe-bestellung .pe-app-header,
body.pe-pos-kiosk .pe-station .pe-app-header {
  flex-wrap: wrap;
}
.pe-pos-kiosk-btn[aria-pressed="true"] {
  background: var(--pe-primary);
  color: var(--pe-on-primary);
  border-color: var(--pe-primary);
}
html:fullscreen .pe-app.pe-kasse,
html:fullscreen .pe-app.pe-verkauf,
html:fullscreen .pe-app.pe-bestellung,
html:fullscreen .pe-app.pe-station,
html:-webkit-full-screen .pe-app.pe-kasse,
html:-webkit-full-screen .pe-app.pe-verkauf,
html:-webkit-full-screen .pe-app.pe-bestellung,
html:-webkit-full-screen .pe-app.pe-station {
  height: 100%;
  max-height: 100%;
  padding: 0 !important;
}

/* Kasse Kiosk: eine Seite, kein Seiten-Scroll — skaliert auf PC/Tablet */
html.pe-pos-kiosk-pref:has(#pe-kasse),
body.pe-pos-kiosk:has(#pe-kasse),
body.pe-kiosk:has(.pe-app.pe-kasse) {
  height: 100% !important;
  max-height: 100dvh !important;
  overflow: hidden !important;
}
html.pe-pos-kiosk-pref .pe-app.pe-kasse,
body.pe-pos-kiosk .pe-app.pe-kasse,
body.pe-kiosk .pe-app.pe-kasse {
  display: flex !important;
  flex-direction: column !important;
  height: 100dvh !important;
  max-height: 100dvh !important;
  min-height: 0 !important;
  overflow: hidden !important;
  padding: 0 !important;
  box-sizing: border-box;
}
html.pe-pos-kiosk-pref .pe-kasse > .pe-app-header,
html.pe-pos-kiosk-pref .pe-kasse > .pe-layout-item[data-pe-module="header"],
body.pe-pos-kiosk .pe-kasse > .pe-app-header,
body.pe-pos-kiosk .pe-kasse > .pe-layout-item[data-pe-module="header"] {
  flex: 0 0 auto !important;
  margin: 0 !important;
  margin-top: env(safe-area-inset-top, 0px) !important;
  padding: clamp(0.2rem, 0.55vh, 0.4rem) clamp(0.35rem, 0.7vw, 0.55rem) !important;
  gap: 0.25rem !important;
}
html.pe-pos-kiosk-pref .pe-kasse .pe-app-header h1,
body.pe-pos-kiosk .pe-kasse .pe-app-header h1 {
  font-size: clamp(0.95rem, 1.5vh, 1.15rem);
}
html.pe-pos-kiosk-pref .pe-kasse .pe-app-header .pe-btn,
body.pe-pos-kiosk .pe-kasse .pe-app-header .pe-btn {
  min-height: 34px;
  padding: 0.2rem 0.4rem;
  font-size: 0.8rem;
}
html.pe-pos-kiosk-pref .pe-kasse .pe-app-header .pe-badge,
body.pe-pos-kiosk .pe-kasse .pe-app-header .pe-badge {
  font-size: 0.75rem;
  max-width: 10rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
html.pe-pos-kiosk-pref .pe-kasse .pe-pos-body,
body.pe-pos-kiosk .pe-kasse .pe-pos-body {
  flex: 1 1 auto !important;
  min-height: 0 !important;
  overflow: hidden !important;
  padding: clamp(2px, 0.45vh, 6px) clamp(4px, 0.7vw, 10px) clamp(4px, 0.6vh, 8px) !important;
  gap: clamp(2px, 0.45vh, 6px) !important;
}
html.pe-pos-kiosk-pref .pe-kasse .pe-kasse-actions,
body.pe-pos-kiosk .pe-kasse .pe-kasse-actions {
  padding: clamp(0.25rem, 0.6vh, 0.45rem) clamp(0.3rem, 0.6vw, 0.5rem) !important;
}
html.pe-pos-kiosk-pref .pe-kasse .pe-kasse-actions-title,
body.pe-pos-kiosk .pe-kasse .pe-kasse-actions-title {
  display: block;
  margin: 0 0 .28rem;
  font-size: .7rem;
}
html.pe-pos-kiosk-pref .pe-kasse .pe-kasse-actions .pe-btn-group,
html.pe-pos-kiosk-pref .pe-kasse .pe-kasse-action-grid,
body.pe-pos-kiosk .pe-kasse .pe-kasse-actions .pe-btn-group,
body.pe-pos-kiosk .pe-kasse .pe-kasse-action-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.4rem;
}
@media (min-width: 700px) {
  html.pe-pos-kiosk-pref .pe-kasse .pe-kasse-action-grid,
  body.pe-pos-kiosk .pe-kasse .pe-kasse-action-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}
html.pe-pos-kiosk-pref .pe-kasse .pe-kasse-actions .pe-btn-group .pe-btn,
html.pe-pos-kiosk-pref .pe-kasse .pe-kasse-action-grid .pe-btn,
body.pe-pos-kiosk .pe-kasse .pe-kasse-actions .pe-btn-group .pe-btn,
body.pe-pos-kiosk .pe-kasse .pe-kasse-action-grid .pe-btn {
  min-height: clamp(46px, 7.2vh, 58px);
  font-size: clamp(0.86rem, 1.7vh, 1.05rem);
  padding: 0.4rem 0.45rem;
}
html.pe-pos-kiosk-pref .pe-kasse .pe-kasse-workspace,
body.pe-pos-kiosk .pe-kasse .pe-kasse-workspace {
  flex: 1 1 auto !important;
  min-height: 0 !important;
  overflow: hidden !important;
  gap: clamp(2px, 0.45vh, 6px) !important;
  align-content: stretch;
}
html.pe-pos-kiosk-pref .pe-kasse .pe-kasse-col-scan,
body.pe-pos-kiosk .pe-kasse .pe-kasse-col-scan {
  min-height: 0 !important;
  overflow: hidden !important;
  height: 100%;
}
html.pe-pos-kiosk-pref .pe-kasse #pe-kasse-scan-card,
body.pe-pos-kiosk .pe-kasse #pe-kasse-scan-card {
  flex: 1 1 auto !important;
  min-height: 0 !important;
  overflow: auto !important;
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
  padding: clamp(0.35rem, 0.9vh, 0.7rem) clamp(0.45rem, 1vw, 0.85rem) !important;
  gap: clamp(3px, 0.55vh, 8px) !important;
}
html.pe-pos-kiosk-pref .pe-kasse .pe-kasse-scan-hint,
html.pe-pos-kiosk-pref .pe-kasse .pe-scan-log,
html.pe-pos-kiosk-pref .pe-kasse .pe-topup-qr-block,
body.pe-pos-kiosk .pe-kasse .pe-kasse-scan-hint,
body.pe-pos-kiosk .pe-kasse .pe-scan-log,
body.pe-pos-kiosk .pe-kasse .pe-topup-qr-block {
  display: none !important;
}
html.pe-pos-kiosk-pref .pe-kasse .pe-kasse-col-ops,
body.pe-pos-kiosk .pe-kasse .pe-kasse-col-ops {
  min-height: 0 !important;
  overflow: hidden !important;
  display: flex;
  flex-direction: column;
}
html.pe-pos-kiosk-pref .pe-kasse .pe-kasse-col-ops > .pe-layout-item,
html.pe-pos-kiosk-pref .pe-kasse .pe-kasse-col-ops > .pe-card,
body.pe-pos-kiosk .pe-kasse .pe-kasse-col-ops > .pe-layout-item,
body.pe-pos-kiosk .pe-kasse .pe-kasse-col-ops > .pe-card {
  min-height: 0;
  overflow: auto;
  overscroll-behavior: contain;
}
html.pe-pos-kiosk-pref .pe-kasse .pe-kasse-workspace:has(#pe-kasse-topup-card:not([hidden])),
html.pe-pos-kiosk-pref .pe-kasse .pe-kasse-workspace:has(#pe-kasse-payout-card:not([hidden])),
html.pe-pos-kiosk-pref .pe-kasse .pe-kasse-workspace:has(#pe-kasse-storno-card:not([hidden])),
html.pe-pos-kiosk-pref .pe-kasse .pe-kasse-workspace:has(#pe-kasse-closing-card:not([hidden])),
body.pe-pos-kiosk .pe-kasse .pe-kasse-workspace:has(#pe-kasse-topup-card:not([hidden])),
body.pe-pos-kiosk .pe-kasse .pe-kasse-workspace:has(#pe-kasse-payout-card:not([hidden])),
body.pe-pos-kiosk .pe-kasse .pe-kasse-workspace:has(#pe-kasse-storno-card:not([hidden])),
body.pe-pos-kiosk .pe-kasse .pe-kasse-workspace:has(#pe-kasse-closing-card:not([hidden])) {
  grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr);
  overflow: hidden !important;
}
@media (max-width: 900px), (max-height: 700px) {
  html.pe-pos-kiosk-pref .pe-kasse .pe-kasse-workspace:has(#pe-kasse-topup-card:not([hidden])),
  html.pe-pos-kiosk-pref .pe-kasse .pe-kasse-workspace:has(#pe-kasse-payout-card:not([hidden])),
  html.pe-pos-kiosk-pref .pe-kasse .pe-kasse-workspace:has(#pe-kasse-storno-card:not([hidden])),
  html.pe-pos-kiosk-pref .pe-kasse .pe-kasse-workspace:has(#pe-kasse-closing-card:not([hidden])),
  body.pe-pos-kiosk .pe-kasse .pe-kasse-workspace:has(#pe-kasse-topup-card:not([hidden])),
  body.pe-pos-kiosk .pe-kasse .pe-kasse-workspace:has(#pe-kasse-payout-card:not([hidden])),
  body.pe-pos-kiosk .pe-kasse .pe-kasse-workspace:has(#pe-kasse-storno-card:not([hidden])),
  body.pe-pos-kiosk .pe-kasse .pe-kasse-workspace:has(#pe-kasse-closing-card:not([hidden])) {
    grid-template-columns: minmax(0, 1fr);
  }
  html.pe-pos-kiosk-pref .pe-kasse .pe-kasse-col-ops,
  body.pe-pos-kiosk .pe-kasse .pe-kasse-col-ops {
    max-height: 46%;
  }
}
@media (max-height: 780px) {
  html.pe-pos-kiosk-pref .pe-kasse .pe-quick-amounts,
  body.pe-pos-kiosk .pe-kasse .pe-quick-amounts {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 0.28rem;
  }
  html.pe-pos-kiosk-pref .pe-kasse .pe-quick-amt,
  body.pe-pos-kiosk .pe-kasse .pe-quick-amt {
    min-height: 38px;
    font-size: 0.9rem;
    padding: 0.25rem 0.3rem;
  }
  html.pe-pos-kiosk-pref .pe-kasse #pe-kasse-topup-btn,
  body.pe-pos-kiosk .pe-kasse #pe-kasse-topup-btn {
    min-height: 44px;
  }
}

/* POS Designsystem — Touch & Chrome Abnahme */
.pe-app.pe-kasse .pe-btn,
.pe-app.pe-verkauf .pe-btn,
.pe-app.pe-bestellung .pe-btn,
.pe-app.pe-station .pe-btn {
  min-height: 44px;
  border-radius: var(--pe-radius-md);
}
.pe-app.pe-kasse .pe-btn-lg,
.pe-app.pe-verkauf .pe-btn-lg,
.pe-app.pe-bestellung .pe-btn-lg,
.pe-app.pe-station .pe-btn-lg {
  min-height: 52px;
}
.pe-app.pe-kasse .pe-input,
.pe-app.pe-verkauf .pe-input,
.pe-app.pe-bestellung .pe-input,
.pe-app.pe-station .pe-input,
.pe-app.pe-kasse .pe-scan-target,
.pe-app.pe-verkauf .pe-scan-target,
.pe-app.pe-bestellung .pe-scan-target,
.pe-app.pe-station .pe-scan-target {
  min-height: 44px;
  border-radius: var(--pe-radius-sm);
}
.pe-app.pe-kasse .pe-badge,
.pe-app.pe-verkauf .pe-badge,
.pe-app.pe-bestellung .pe-badge,
.pe-app.pe-station .pe-badge {
  border-radius: 999px;
}
html[data-pe-display-mode="hc-light"] .pe-app.pe-kasse .pe-btn,
html[data-pe-display-mode="hc-light"] .pe-app.pe-verkauf .pe-btn,
html[data-pe-display-mode="hc-light"] .pe-app.pe-bestellung .pe-btn,
html[data-pe-display-mode="hc-light"] .pe-app.pe-station .pe-btn,
html[data-pe-display-mode="hc-dark"] .pe-app.pe-kasse .pe-btn,
html[data-pe-display-mode="hc-dark"] .pe-app.pe-verkauf .pe-btn,
html[data-pe-display-mode="hc-dark"] .pe-app.pe-bestellung .pe-btn,
html[data-pe-display-mode="hc-dark"] .pe-app.pe-station .pe-btn {
  border-width: 2px;
}