/* ALLGEMEIN SCHRIFTART */
body {
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen,
    Ubuntu, Cantarell, "Helvetica Neue", Arial, sans-serif;
  font-size: 16px;
  line-height: 1.6;
  color: #222;
  margin: 0;
  padding: 0 0 64px 0;
}

/* blockierter Input */
.muted { opacity: .8; }
.muted-tight { opacity:.8; margin-top:.2rem; }

/* ALLGEMEIN ENDE */

/* BANNER */
/* === Banner-Grundlayout === */
.main-header {
  background: linear-gradient(135deg, #a80000, #ff3b3b);
  color: #fff;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.2);
  position: relative;
  top: 0;
  z-index: 1001;
  min-height: 58px;
}

input,
select,
textarea {
  font-family: inherit;
}

select,
select option,
input[type="date"],
input[type="time"],
input[type="datetime-local"],
input[type="month"],
input[type="week"] {
  color: #222;
  -webkit-text-fill-color: #222;
}

input[type="date"]::-webkit-date-and-time-value,
input[type="time"]::-webkit-date-and-time-value,
input[type="datetime-local"]::-webkit-date-and-time-value,
input[type="month"]::-webkit-date-and-time-value,
input[type="week"]::-webkit-date-and-time-value,
input[type="date"]::-webkit-datetime-edit,
input[type="time"]::-webkit-datetime-edit,
input[type="datetime-local"]::-webkit-datetime-edit,
input[type="month"]::-webkit-datetime-edit,
input[type="week"]::-webkit-datetime-edit {
  color: #222;
  -webkit-text-fill-color: #222;
}

select:disabled,
input[type="date"]:disabled,
input[type="time"]:disabled,
input[type="datetime-local"]:disabled,
input[type="month"]:disabled,
input[type="week"]:disabled {
  color: #777;
  -webkit-text-fill-color: #777;
  opacity: 1;
}

/* iOS zoomt beim Fokussieren von Formularfeldern unter 16 px automatisch hinein. */
html.ios-device .login-compact .settings-form .login-search-row input[type="text"],
html.ios-device .admin-popup .admin-password-field input,
html.ios-device .shop-admin-field .input-control,
html.ios-device .cookbook-index-search .input-control,
html.ios-device .admin-meals-booking-search .input-control {
  font-size: 16px;
}

@supports ((position: sticky) or (position: -webkit-sticky)) {
  .main-header {
    position: -webkit-sticky;
    position: sticky;
    top: 0;
  }
}

.main-header-spacer {
  display: none;
  height: 0;
}

html.fixed-header .main-header {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  width: 100%;
  -webkit-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}

html.ios-legacy-fixed.fixed-header .main-header,
html.ios-legacy-fixed .idlebar,
html.ios-legacy-fixed .banner-sidebar-toggle,
html.ios-legacy-fixed .admin-nav,
html.ios-legacy-fixed .admin-sidebar-overlay,
html.ios-legacy-fixed .admin-bottom-nav,
html.ios-legacy-fixed .cookbook-bottom-nav {
  -webkit-transform: none !important;
  transform: none !important;
  -webkit-backface-visibility: visible !important;
  backface-visibility: visible !important;
}

html.fixed-header .main-header-spacer {
  display: block;
  height: 58px;
  height: var(--admin-header-offset, 58px);
}

.banner-container {
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
  min-height: 58px;      /* echte Bannerhöhe */
  height: 58px;
  padding-top: 0;        /* wichtig */
  padding-bottom: 0;     /* wichtig */
  display: flex;
  align-items: stretch;  /* wichtig */
  justify-content: space-between;
}

.main-header--admin-sidebar .banner-container {
  box-sizing: border-box;
  max-width: none;
  margin: 0;
  padding-left: 60px;
}

/* === Logo === */
.logo a {
  color: #fff;
  font-size: 1.5rem;
  font-weight: 700;
  text-decoration: none;
  letter-spacing: 1px;
  transition: opacity 0.2s ease-in-out;
  display: inline-flex;
  align-items: center;
  gap: 0;
  line-height: 1.2;
}

.logo {
  margin: 0 !important;  /* falls du im HTML nichts änderst */
  display: flex;
  align-items: center;
  padding: 0 0.6rem;     /* Abstand statt margin */
}

.banner-title-prefix.is-hidden {
  display: none;
}

.banner-title-main {
  margin-left: 0.45rem;
}

.banner-title-logo + .banner-title-prefix,
.banner-title-logo + .banner-title-main,
.banner-title-prefix + .banner-title-main {
  margin-left: 0.45rem;
}

/* === Navigation === */
.nav-links {
  display: flex;
  gap: 1.5rem;
  margin-right: 0.5rem;
  align-items: center !important;
}

/* Baseline nur für "normale" Links – NICHT für .button-set-small */
.nav-links a:not(.button-set-small) {
  color: #fff;
  text-decoration: none;
  transition: opacity 0.2s ease-in-out;
}
.nav-links a:not(.button-set-small):hover {
  opacity: 0.7;
}

.nav-links.banner-menu {
  display: flex;
  align-items: stretch !important;
  align-self: stretch;
  height: 58px;
  margin-right: 0;
  gap: 0;
}

/* Wrapper darf den Flow nicht kaputt machen */
.admin-button-wrapper {
  position: relative;
  display: flex;
  align-items: stretch;
  height: 58px;
  z-index: 1101;
}

/* Desktop / allgemeine Banner-Tabs */
.banner-menu {
  display: flex;
  align-items: stretch;
  height: 58px;
  margin-right: 0;
  gap: 0;
}

.banner-item,
.banner-item-button {
  width: 60px;
  height: 58px;
  min-height: 58px;
  box-sizing: border-box;
  flex: 0 0 60px;
  margin: 0;
  padding: 0;
  background: none;
  border: none;
  border-radius: 0;
  color: #fff;
  font: inherit;
  line-height: 1;
  text-decoration: none;
  vertical-align: top;
  -webkit-appearance: none;
  appearance: none;
  -webkit-tap-highlight-color: transparent;
}

.banner-item-inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.12rem;
  width: 100%;
  height: 100%;
}

.banner-item-label {
  font-size: 0.62rem;
  font-weight: 700;
  line-height: 1;
  color: #fff;
  white-space: nowrap;
}

/* erstes Element links ohne Trennlinie */
.banner-menu > .banner-item:first-child {
  border-left: none;
}

/* wie Sidebar-Hover, aber auf rotem Header leicht transparent */
.banner-item:hover,
.banner-item-button:hover,
.banner-item:focus-visible,
.banner-item-button:focus-visible {
  background: rgba(255,245,245,0.18);
  outline: none;
  box-shadow: none;
}

/* aktiv wie Sidebar */
.banner-item.is-active,
.banner-item-button.is-active {
  background: linear-gradient(90deg, rgba(255,77,77,0.22), rgba(168,0,0,0.12));
  box-shadow: inset 0 -3px 0 rgba(255,255,255,0.92);
}

.banner-item:active,
.banner-item-button:active {
  background: rgba(255,245,245,0.22);
}

.banner-item--mobile-only {
  display: none !important;
}

/* ADMIN-Button */
.btn-admin {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.4rem;

  padding: 0.55rem 0.9rem;
  border-radius: 10px;

  font-size: 0.92rem;
  font-weight: 600;
  text-decoration: none;

  background: #f4f5f6;
  color: #222;

  border: 1px solid rgba(0,0,0,.08);
  box-shadow: 0 2px 6px rgba(0,0,0,.06);

  cursor: pointer;
  transition: all 0.15s ease;
}

.btn-admin:hover,
.btn-admin:focus-visible {
  background: #eceff1;
  border-color: rgba(0,0,0,.12);
  box-shadow: 0 4px 10px rgba(0,0,0,.08);
  outline: none;
}

.btn-admin:disabled,
.btn-admin.is-disabled {
  opacity: 0.55;
  cursor: not-allowed;
  box-shadow: none;
  pointer-events: none;
}

.btn-admin:active {
  transform: translateY(0);
  box-shadow: 0 2px 4px rgba(0,0,0,.08);
}

.btn-admin--primary {
  background: #a80000;
  color: #fff;
  border: none;
}

.btn-admin--primary:hover {
  background: #8f0000;
}

.btn-admin--primary:focus-visible {
  border-color: #a80000;
  background: #a80000;
  color: #fff;
  box-shadow: 0 0 0 3px rgba(168, 0, 0, 0.18);
}

.btn-admin--ghost {
  background: transparent;
  border: 1px solid rgba(0,0,0,.12);
}

.btn-admin--danger {
  background: #fff;
  color: #a80000;
  border: 1px solid rgba(168,0,0,.25);
}

.btn-admin--danger:hover {
  background: #fff5f5;
}

.btn-admin--flat {
  background: transparent;
  border: none;
  box-shadow: none;
  color: #666;
}

.btn-admin--flat:hover {
  color: #a80000;
  background: rgba(168,0,0,.05);
}

/* ICONS */
.nav-icon {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
  pointer-events: none;
  user-select: none;
}

.nav-icon--banner {
  width: 28px;
  height: 28px;
  object-fit: contain;
}

.banner-title-logo {
  width: 38px;
  height: 38px;
  flex: 0 0 auto;
}

.nav-icon--sidebar {
  width: 28px;
  height: 28px;
}

.nav-icon--bottom {
  width: 30px;
  height: 30px;
}

/* optional: falls ein Icon zu tief oder hoch sitzt */
.admin-sidebar-link-icon,
.admin-bottom-nav-icon,
.banner-item,
.banner-item-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
/* ICONS */

/* Standard: mobiler eingebetteter Login versteckt */
.admin-login {
  display: none;
}

.menu-toggle {
  display: none;
  background: rgba(255,255,255,0.14);
  border: 1px solid rgba(255,255,255,0.22);
  color: #fff;
  cursor: pointer;
  width: 46px;
  height: 46px;
  border-radius: 12px;
  font-size: 1.5rem;
  line-height: 1;
  align-items: center;
  justify-content: center;
  padding: 0;
  margin: 6px 10px 6px 0;
  flex: 0 0 auto;
  z-index: 1202;
  box-shadow: 0 4px 10px rgba(0,0,0,.18);
  -webkit-tap-highlight-color: transparent;
}

/* Dünner Inaktivitäts-Balken direkt unter dem Banner */
.idlebar {
  position: fixed;
  top: 58px;
  top: var(--admin-header-offset, 58px);
  height: 4px;
  width: 100%;
  background: rgba(0,0,0,0.10);
  z-index: 1000;
  overflow: hidden;
  -webkit-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}

/* Gefüllter Teil – wächst mit der Zeit */
#idleBar {
  height: 100%;
  width: 0%;
  background: #ffab00;
  transition: width 0.18s linear; /* smoothes Wachstum */
}

/* === Mobile Menü === */
@media (max-width: 850px) {
  .banner-container {
    position: relative;
    min-height: 58px;
    align-items: center;
  }

  .menu-toggle {
    display: inline-flex;
  }

  .logo {
    min-width: 0;
    flex: 1 1 auto;
  }

  .nav-links.banner-menu {
    display: none;
    position: absolute;
    top: 100%;
    right: 0;
    left: 0;
    width: 100%;
    margin-right: 0 !important;
    padding: 0.5rem 0;
    flex-direction: column;
    gap: 0;
    z-index: 1100;
    height: auto;
    align-items: stretch !important;
    background: linear-gradient(180deg, #a80000, #c91414);
    border-top: 1px solid rgba(255,255,255,.12);
  }

  .nav-links.banner-menu.active {
    display: flex;
  }

  .nav-links.banner-menu .banner-item,
  .nav-links.banner-menu .banner-item-button,
  .nav-links.banner-menu .admin-button-wrapper {
    width: 100%;
  }

  .nav-links.banner-menu .banner-item,
  .nav-links.banner-menu .banner-item-button {
    display: flex;
    box-sizing: border-box;
    height: 58px;
    color: #fff;
    border-top: 1px solid rgba(255,255,255,.10);
    justify-content: flex-start;
    padding: 0 1rem;
  }

  .nav-links.banner-menu .banner-item--mobile-only {
    display: flex !important;
  }

  .nav-links.banner-menu .admin-button-wrapper {
    display: block;
    height: auto;
  }

  .nav-links.banner-menu .banner-item-inner {
    width: 100%;
    flex-direction: row;
    justify-content: flex-start;
    gap: 0.75rem;
  }

  .nav-links.banner-menu .banner-item-label {
    font-size: 0.82rem;
    color: #fff;
  }

  .nav-links.banner-menu .nav-icon--banner {
    width: 24px;
    height: 24px;
  }

  .nav-links.banner-menu .banner-item:hover,
  .nav-links.banner-menu .banner-item-button:hover,
  .nav-links.banner-menu .banner-item:focus-visible,
  .nav-links.banner-menu .banner-item-button:focus-visible {
    background: rgba(255,255,255,.08);
    color: #fff;
  }

  .nav-links.banner-menu .banner-item.is-active,
  .nav-links.banner-menu .banner-item-button.is-active {
    background: rgba(255,255,255,.12);
    color: #fff;
    box-shadow: inset 4px 0 0 rgba(255,255,255,.92);
  }

  .admin-popup {
    display: none !important;
  }

  .admin-login {
    display: block;
    width: 100%;
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.25s ease;
    background: rgba(255,255,255,.05);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.05);
  }

  .admin-login:not(.is-hidden) {
    max-height: 220px;
  }

  .nav-links.banner-menu .admin-login-form {
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    gap: 0.5rem;
    padding: 0.85rem 1rem 1rem;
  }

  .nav-links.banner-menu .admin-login-form .admin-login-field-wrap {
    flex: 1 1 auto;
    width: auto;
    min-width: 0;
    box-sizing: border-box;
  }

  .nav-links.banner-menu .admin-login-form .admin-password-field {
    width: 100%;
  }

  .nav-links.banner-menu .admin-login-form .admin-password-field input {
    width: 100%;
    min-width: 0;
    height: 2.6rem;
    min-height: 2.6rem;
    box-sizing: border-box;
    text-align: left;
  }

  .nav-links.banner-menu .admin-login-submit {
    flex: 0 0 2.6rem;
    width: 2.6rem;
    min-width: 2.6rem;
    height: 2.6rem;
    min-height: 2.6rem;
    padding: 0;
    border-radius: 9px;
  }

  .admin-login-submit-icon {
    width: 1.2rem;
    height: 1.2rem;
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
  }

}

/* BANNER ENDE */

/* =========================
   ADMIN SIDEBAR / LAYOUT
========================= */
:root {
  --admin-header-offset: 58px;
  --admin-rail-width: 60px;
  --admin-panel-width: 250px;
  --admin-bottom-nav-height: 64px;
}

/* verhindert Scrollen im Hintergrund, wenn Overlay offen ist */
body.admin-sidebar-open {
  overflow: hidden;
}

/* Linker Rail-Block */
.admin-nav {
  position: fixed;
  top: 58px;
  top: var(--admin-header-offset);
  left: 0;
  bottom: 0;
  width: 60px;
  width: var(--admin-rail-width);
  background: #fff;
  border-right: 1px solid rgba(0,0,0,.08);
  box-shadow: 4px 0 18px rgba(0,0,0,.05);
  overflow: hidden;
  z-index: 1040;
  transition: width .22s ease;
  -webkit-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}

html.admin-sidebar-open-desktop .admin-nav {
  width: 310px;
  width: calc(var(--admin-rail-width) + var(--admin-panel-width));
}

.banner-brand {
  display: flex;
  align-items: center;
}

.banner-sidebar-toggle {
  position: fixed;
  top: 0;
  left: 0;
  width: 60px;
  height: 58px;
  margin-right: 0;
  background: none;
  border: none;
  padding: 0;
  z-index: 1305;
  color: #fff;
  -webkit-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}

.banner-sidebar-toggle:hover {
  background: rgba(255,255,255,0.22);
}

.banner-sidebar-toggle .nav-icon {
  transition: transform 0.3s cubic-bezier(.4,0,.2,1);
}

html.admin-sidebar-open-desktop .banner-sidebar-toggle .nav-icon {
  transform: rotate(180deg);
}

@media (max-width: 1023px) {
  .main-header--admin-sidebar .banner-container {
    max-width: 1200px;
    margin: 0 auto;
    padding-left: 0;
  }

  .banner-sidebar-toggle {
    display: none !important;
  }
}
/* Navigation innen */
.admin-nav-inner {
  position: relative;
  height: 100%;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  z-index: 2;
}

/* Scrollbarer Menübereich */
.admin-nav-scroll {
  flex: 1 1 auto;
  overflow-y: auto;
  overflow-x: hidden;
  -webkit-overflow-scrolling: touch;
  background: transparent;
}

/* Gruppen */
.admin-sidebar-group {
  margin: 0;
  padding: 0;
}

.admin-sidebar-group + .admin-sidebar-group {
  border-top: 1px solid rgba(0,0,0,.05);
}

.admin-sidebar-group-title {
  height: 30px;
  display: flex;
  align-items: center;
  padding: 0 0 0 74px;
  padding: 0 0 0 calc(var(--admin-rail-width) + 14px);
  margin: 0;
  font-size: 0.75rem;
  font-weight: 800;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: #8b8b8b;
  white-space: nowrap;
  opacity: 0;
  transform: translateX(-8px);
  transition: opacity .16s ease, transform .18s ease;
  pointer-events: none;
}

html.admin-sidebar-open-desktop .admin-sidebar-group-title {
  opacity: 1;
  transform: translateX(0);
  pointer-events: auto;
}

/* Menülink: eine durchgehende Zeile */
.admin-sidebar-link {
  position: relative;
  display: flex;
  align-items: center;
  height: 58px;
  width: 100%;
  margin: 0;
  padding: 0;
  border: none;
  border-radius: 0;
  text-decoration: none;
  color: #222;
  background: transparent;
  box-shadow: none;
  transition: background .15s ease, color .15s ease;
  overflow: hidden;
}

.admin-sidebar-link:hover,
.admin-sidebar-link:focus-visible {
  background: #fff5f5;
  outline: none;
}

/* Ikonenspur links */
.admin-sidebar-link-icon {
  width: 60px;
  width: var(--admin-rail-width);
  min-width: 60px;
  min-width: var(--admin-rail-width);
  height: 58px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: transparent;
  color: #a80000;
  font-size: 1.15rem;
  line-height: 1;
  border-radius: 0;
  position: relative;
  z-index: 2;
}

/* Textbereich rechts */
.admin-sidebar-link-text {
  display: flex;
  align-items: center;
  height: 58px;
  min-width: 0;
  padding: 0 16px 0 6px;
  font-size: 0.96rem;
  font-weight: 700;
  line-height: 1.2;
  white-space: nowrap;
  opacity: 0;
  transform: translateX(-8px);
  transition: opacity .16s ease, transform .18s ease;
  pointer-events: none;
}

html.admin-sidebar-open-desktop .admin-sidebar-link-text {
  opacity: 1;
  transform: translateX(0);
  pointer-events: auto;
}

/* Aktiver Eintrag */
.admin-sidebar-link.is-active {
  background: linear-gradient(90deg, rgba(255,77,77,0.14), rgba(168,0,0,0.08));
  color: #a80000;
}

.admin-sidebar-link.is-active::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 4px;
  background: #a80000;
}

.admin-sidebar-link.is-active .admin-sidebar-link-icon {
  color: #a80000;
}

.admin-sidebar-link.is-active .admin-sidebar-link-text {
  color: #a80000;
}

/* Overlay/Blur für die Seite */
.admin-sidebar-overlay {
  position: fixed;
  top: 58px;
  top: var(--admin-header-offset);
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(15, 23, 42, 0.24);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  z-index: 1035;
  -webkit-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}

.admin-sidebar-overlay[hidden] {
  display: none !important;
}

/* Desktop / Tablet */
@media (min-width: 1024px) {
  .admin-nav {
    display: block;
  }
}

/* Mobil: Sidebar aus, Bottom-Bar übernimmt */
@media (max-width: 1023px) {
  .admin-nav {
    display: none;
  }

  .admin-sidebar-overlay {
    display: none !important;
  }
}

/* sehr kleine Screens */
@media (max-width: 480px) {
  .admin-sidebar-link,
  .admin-sidebar-link-icon,
  .admin-sidebar-link-text {
    height: 56px;
  }
}

/* =========================
   ADMIN BOTTOM NAV (MOBILE)
========================= */
.admin-bottom-nav {
  display: none;
}

[data-knt-scroll-edges]::before,
[data-knt-scroll-edges]::after {
  content: "";
  position: -webkit-sticky;
  position: sticky;
  z-index: 20;
  display: block;
  flex: 0 0 20px;
  align-self: stretch;
  pointer-events: none;
  opacity: 0;
  transition: opacity .12s ease;
}

[data-knt-scroll-edges]::before {
  left: 0;
  margin-right: -20px;
  background: linear-gradient(90deg, rgba(24, 24, 24, .46), rgba(24, 24, 24, 0));
}

[data-knt-scroll-edges]::after {
  right: 0;
  margin-left: -20px;
  background: linear-gradient(270deg, rgba(24, 24, 24, .46), rgba(24, 24, 24, 0));
}

[data-knt-scroll-edges].can-scroll-left::before,
[data-knt-scroll-edges].can-scroll-right::after {
  opacity: 1;
}

@media (max-width: 1023px) {
  .admin-bottom-nav {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0 !important;
    z-index: 1095;
    display: flex;
    align-items: stretch;
    gap: 0;
    overflow-x: auto;
    overflow-y: hidden;
    white-space: nowrap;
    background: rgba(255,255,255,0.98);
    border-top: 1px solid rgba(0,0,0,.08);
    box-shadow: 0 -6px 18px rgba(0,0,0,.08);
    padding-bottom: 0;
    padding-bottom: constant(safe-area-inset-bottom);
    padding-bottom: env(safe-area-inset-bottom, 0px);
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    will-change: transform;
    isolation: isolate;
  }

  html.ios-device .admin-bottom-nav {
    position: fixed !important;
    top: auto !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    -webkit-overflow-scrolling: auto;
  }

  .admin-bottom-nav::-webkit-scrollbar {
    display: none;
  }

  .admin-bottom-nav-link {
    flex: 0 0 76px;
    min-width: 76px;
    min-height: 64px;
    padding: 0.45rem 0.25rem 0.35rem;
    border: none;
    border-radius: 0;
    background: transparent;
    color: #555;
    text-decoration: none;
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.18rem;
    font: inherit;
    cursor: pointer;
    box-sizing: border-box;
    transition: background .15s ease, color .15s ease;
    -webkit-tap-highlight-color: transparent;
  }

  .admin-bottom-nav-link:hover,
  .admin-bottom-nav-link:focus-visible {
    background: #fff5f5;
    color: #a80000;
    outline: none;
  }

  .admin-bottom-nav-link.is-active {
    color: #a80000;
    background: linear-gradient(180deg, rgba(255,77,77,0.10), rgba(255,77,77,0.03));
  }

  .admin-bottom-nav-icon {
    font-size: 1.15rem;
    line-height: 1;
  }

  .admin-bottom-nav-text {
    font-size: 0.68rem;
    font-weight: 700;
    line-height: 1.05;
    white-space: nowrap;
  }

  .nav-icon--bottom {
    width: 24px;
    height: 24px;
  }

}

@media (max-width: 850px) {
  .admin-popup {
    left: auto;
    right: 12px;
    transform: none;
    width: 280px;
    max-width: 92vw;
    width: min(92vw, 280px);
  }
}

@media (min-width: 1024px) {
  .site-offset {
    padding-left: 60px;
    padding-left: var(--admin-rail-width);
  }

  .idlebar--admin {
    left: 60px;
    left: var(--admin-rail-width);
    width: calc(100% - 60px);
    width: calc(100% - var(--admin-rail-width));
  }
}

@media (max-width: 1023px) {
  .site-offset {
    padding-bottom: 64px;
    padding-bottom: calc(var(--admin-bottom-nav-height) + constant(safe-area-inset-bottom));
    padding-bottom: calc(var(--admin-bottom-nav-height) + env(safe-area-inset-bottom, 0px));
  }
}
/* ADMIN-SIDEBAR ENDE */
/* ADMIN DASHBOARD */

.admin-dashboard-page .admin-dashboard-section-head {
  align-items: flex-end;
  margin-bottom: 1rem;
}

.admin-dashboard-section-head > div {
  min-width: 0;
}

.admin-dashboard-page .admin-dashboard-section-head h2 {
  margin: 0;
  font-size: 1.15rem;
}

.admin-dashboard-section-head p,
.admin-cookbook-section-head p {
  margin: .22rem 0 0;
  color: #666;
  font-size: .9rem;
  line-height: 1.35;
}

.admin-dashboard-heading-mobile {
  display: none;
}

.admin-dashboard-date {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  min-height: 30px;
  box-sizing: border-box;
  padding: .32rem .68rem;
  border: 1px solid rgba(168, 0, 0, .12);
  border-radius: 999px;
  background: #fff7f7;
  color: #a80000;
  font-size: .78rem;
  font-weight: 800;
  line-height: 1;
}

.admin-dashboard-kpi-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
  gap: .85rem;
}

.admin-dashboard-kpi-grid--five,
.admin-dashboard-kpi-grid--six {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

@media (min-width: 1400px) {
  .admin-dashboard-kpi-grid--five {
    grid-template-columns: repeat(5, minmax(0, 1fr));
  }
}

.admin-dashboard-kpi-card {
  container-name: admin-dashboard-kpi;
  container-type: inline-size;
  min-width: 0;
  padding: 1rem;
  background: #fff;
  border: 1px solid rgba(0, 0, 0, .08);
  border-radius: 14px;
  box-shadow: 0 7px 18px rgba(0, 0, 0, .045);
}

.admin-dashboard-card--link {
  cursor: pointer;
  transition: border-color .15s ease, box-shadow .15s ease, transform .15s ease;
}

.admin-dashboard-card--link:hover,
.admin-dashboard-card--link:focus-visible {
  border-color: rgba(168, 0, 0, .25);
  box-shadow: 0 11px 24px rgba(0, 0, 0, .075);
  outline: none;
  transform: translateY(-1px);
}

.admin-dashboard-card-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: .82rem;
}

.admin-dashboard-card-head > div:first-child {
  min-width: 0;
}

.admin-dashboard-page .admin-dashboard-card-title {
  margin: 0;
  color: #222;
  text-align: left;
  font-size: 1rem;
  font-weight: 800;
}

.admin-dashboard-card-subtitle {
  margin: .16rem 0 0;
  color: #707070;
  font-size: .82rem;
}

.admin-dashboard-card-subtitle--empty {
  visibility: hidden;
}

.admin-dashboard-kpi-value {
  margin-bottom: 0;
  color: #a80000;
  font-size: 2rem;
  font-weight: 900;
  line-height: 1;
  text-align: left;
  white-space: nowrap;
}

.admin-dashboard-kpi-value-row {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: .55rem;
  margin-bottom: .55rem;
}

.admin-dashboard-kpi-value-row .admin-dashboard-trend:not(.admin-dashboard-trend--plain) {
  transform: translateY(2px);
}

.admin-dashboard-kpi-meta {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: .55rem .8rem;
  padding-top: .68rem;
  border-top: 1px solid rgba(0, 0, 0, .065);
  color: #666;
  font-size: .82rem;
}

.admin-dashboard-kpi-meta strong {
  color: #222;
}

.admin-dashboard-kpi-small {
  display: inline-flex;
  align-items: baseline;
  justify-content: flex-end;
  gap: .28rem;
  margin-left: auto;
  text-align: right;
  line-height: 1.15;
  white-space: nowrap;
}

.admin-dashboard-kpi-small-label::after {
  content: ":";
}

.admin-dashboard-kpi-small-data {
  display: inline-flex;
  align-items: baseline;
  gap: .4rem;
  min-width: 0;
}

.admin-dashboard-kpi-small--link {
  color: #222;
  font-weight: 700;
  text-decoration: none;
}

.admin-dashboard-kpi-small--link:hover .admin-dashboard-kpi-small-value,
.admin-dashboard-kpi-small--link:focus .admin-dashboard-kpi-small-value {
  text-decoration: underline;
}

.admin-dashboard-kpi-small-value {
  display: inline;
  height: auto;
  line-height: 1;
}

.admin-dashboard-trend {
  display: inline-grid;
  grid-auto-flow: column;
  grid-auto-columns: max-content;
  align-items: center;
  justify-content: center;
  gap: .28rem;
  height: 24px;
  box-sizing: border-box;
  padding: 0 .48rem;
  border: 1px solid transparent;
  border-radius: 999px;
  font-size: .76rem;
  font-weight: 850;
  line-height: 1;
  white-space: nowrap;
}

.admin-dashboard-trend--up {
  color: #15803d;
  background: #ecfdf3;
  border-color: #bbf7d0;
}

.admin-dashboard-trend--down {
  color: #b91c1c;
  background: #fff1f2;
  border-color: #fecdd3;
}

.admin-dashboard-trend--neutral {
  color: #475569;
  background: #f1f5f9;
  border-color: #e2e8f0;
}

.admin-dashboard-trend--plain {
  display: inline-flex;
  align-items: baseline;
  min-height: auto;
  height: auto;
  padding: 0;
  border: 0;
  background: transparent;
  font-size: .72rem;
  line-height: inherit;
  transform: none;
  vertical-align: baseline;
}

.admin-dashboard-trend--plain span {
  display: inline;
  height: auto;
  line-height: inherit;
}

@container admin-dashboard-kpi (max-width: 205px) {
  .admin-dashboard-kpi-meta {
    align-items: flex-start;
  }

  .admin-dashboard-kpi-small {
    display: grid;
    flex: 0 0 100%;
    grid-template-columns: minmax(0, 1fr);
    gap: .18rem;
    width: 100%;
    max-width: 100%;
    margin-left: 0;
    text-align: left;
    white-space: normal;
  }

  .admin-dashboard-kpi-small-label {
    display: block;
  }

  .admin-dashboard-kpi-small-data {
    justify-content: flex-start;
    white-space: nowrap;
  }
}

.admin-dashboard-insight-switcher {
  display: grid;
  grid-template-columns: 24px minmax(0, 1fr) 24px;
  align-items: center;
  gap: .3rem;
  min-width: 0;
}

.admin-dashboard-insight-groups,
.admin-dashboard-insight-group {
  min-width: 0;
}

.admin-dashboard-insight-group {
  display: none;
}

.admin-dashboard-insight-group.is-desktop-active {
  display: block;
}

.admin-dashboard-carousel-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 42px;
  padding: 0 0 .15rem;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: #a80000;
  box-shadow: none;
  font: inherit;
  font-size: 1.65rem;
  font-weight: 700;
  line-height: 1;
  cursor: pointer;
  opacity: .8;
  transition: color .15s ease, opacity .15s ease, transform .15s ease;
}

.admin-dashboard-carousel-button:hover,
.admin-dashboard-carousel-button:focus-visible {
  color: #7e0000;
  opacity: 1;
  outline: none;
  transform: scale(1.08);
}

.admin-dashboard-carousel-button--mobile {
  display: none;
}

.admin-dashboard-insights-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .7rem;
  min-width: 0;
  touch-action: pan-y;
}

.admin-dashboard-insight-panel {
  min-width: 0;
  min-height: 320px;
  box-sizing: border-box;
  padding: 1rem 1.05rem;
  background: #fff;
  border: 1px solid rgba(0, 0, 0, .09);
  border-radius: 14px;
}

.admin-dashboard-insight-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: .85rem;
  margin-bottom: .9rem;
}

.admin-dashboard-page .admin-dashboard-insight-head h3 {
  margin: 0;
  color: #222;
  text-align: left;
  font-size: 1rem;
  font-weight: 850;
  line-height: 1.25;
}

.admin-dashboard-insight-head p {
  margin: .18rem 0 0;
  color: #707070;
  font-size: .82rem;
  line-height: 1.3;
}

.admin-dashboard-live-badge {
  display: inline-flex;
  align-items: center;
  gap: .38rem;
  flex: 0 0 auto;
  padding: .3rem .58rem;
  border: 1px solid #bbf7d0;
  border-radius: 999px;
  background: #ecfdf3;
  color: #15803d;
  font-size: .7rem;
  font-weight: 850;
  line-height: 1;
  text-transform: uppercase;
  letter-spacing: .04em;
}

.admin-dashboard-live-badge > span {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #22c55e;
  box-shadow: 0 0 0 0 rgba(34, 197, 94, .38);
  animation: admin-dashboard-live-pulse 2s ease-out infinite;
}

@keyframes admin-dashboard-live-pulse {
  0% { box-shadow: 0 0 0 0 rgba(34, 197, 94, .38); }
  70%, 100% { box-shadow: 0 0 0 7px rgba(34, 197, 94, 0); }
}

.admin-dashboard-recent-orders {
  display: grid;
  max-height: 228px;
  overflow-x: hidden;
  overflow-y: auto;
  padding-right: .28rem;
  overscroll-behavior: contain;
  scrollbar-width: thin;
  scrollbar-color: rgba(168, 0, 0, .32) transparent;
}

.admin-dashboard-recent-orders::-webkit-scrollbar {
  width: 5px;
}

.admin-dashboard-recent-orders::-webkit-scrollbar-track {
  background: transparent;
}

.admin-dashboard-recent-orders::-webkit-scrollbar-thumb {
  border-radius: 999px;
  background: rgba(168, 0, 0, .28);
}

.admin-dashboard-recent-order {
  container-name: admin-dashboard-recent-order;
  container-type: inline-size;
  display: block;
  min-width: 0;
  padding: .56rem .15rem;
  border-top: 1px solid rgba(0, 0, 0, .065);
  color: inherit;
  text-decoration: none;
  transition: background .15s ease, transform .15s ease;
}

.admin-dashboard-recent-order:first-child {
  padding-top: .15rem;
  border-top: 0;
}

.admin-dashboard-recent-order:last-child {
  padding-bottom: .15rem;
}

.admin-dashboard-recent-order:hover,
.admin-dashboard-recent-order:focus-visible {
  background: linear-gradient(90deg, rgba(255, 77, 77, .055), transparent);
  transform: translateX(2px);
}

.admin-dashboard-recent-order:focus-visible {
  border-radius: 7px;
  outline: 2px solid rgba(168, 0, 0, .38);
  outline-offset: -2px;
}

.admin-dashboard-recent-content {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: .65rem;
  min-width: 0;
}

.admin-dashboard-recent-line {
  display: flex;
  align-items: baseline;
  min-width: 0;
  gap: .35rem;
  color: #555;
  font-size: .84rem;
  line-height: 1.25;
}

.admin-dashboard-recent-line strong {
  flex: 0 0 auto;
  color: #222;
  font-weight: 850;
}

.admin-dashboard-recent-line span {
  color: #aaa;
}

.admin-dashboard-recent-line b {
  min-width: 0;
  overflow: hidden;
  color: #a80000;
  font-weight: 800;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.admin-dashboard-recent-time {
  display: block;
  color: #7a7a7a;
  font-size: .72rem;
  line-height: 1.2;
  white-space: nowrap;
}

@container admin-dashboard-recent-order (max-width: 360px) {
  .admin-dashboard-recent-content {
    grid-template-columns: minmax(0, 1fr);
    gap: .16rem;
  }
}

.admin-dashboard-recent-more {
  display: block;
  min-width: 92px;
  margin: .68rem auto 0;
  padding: .38rem .85rem;
  border: 1px solid rgba(168, 0, 0, .18);
  border-radius: 999px;
  background: #fff7f7;
  color: #a80000;
  font: inherit;
  font-size: .78rem;
  font-weight: 850;
  line-height: 1.2;
  cursor: pointer;
  transition: background .15s ease, border-color .15s ease, transform .15s ease;
}

.admin-dashboard-recent-more:hover,
.admin-dashboard-recent-more:focus-visible {
  border-color: rgba(168, 0, 0, .36);
  background: #ffeded;
  outline: none;
  transform: translateY(-1px);
}

.admin-dashboard-recent-more:disabled {
  opacity: .6;
  cursor: wait;
  transform: none;
}

.admin-dashboard-recent-more[hidden] {
  display: none;
}

.admin-dashboard-empty {
  padding: .5rem 0;
  color: #666;
  font-size: .9rem;
}

.admin-dashboard-rank-list {
  display: grid;
  gap: .85rem;
}

.admin-dashboard-rank-item {
  display: grid;
  gap: .42rem;
  min-width: 0;
}

.admin-dashboard-rank-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  min-width: 0;
}

.admin-dashboard-rank-name {
  min-width: 0;
  overflow: hidden;
  color: #222;
  font-size: .88rem;
  font-weight: 750;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.admin-dashboard-rank-value {
  color: #a80000;
  font-size: .82rem;
  font-weight: 850;
  white-space: nowrap;
}

.admin-dashboard-rank-bar {
  box-sizing: border-box;
  width: 100%;
  max-width: 100%;
  height: 8px;
  overflow: hidden;
  border-radius: 999px;
  background: rgba(0, 0, 0, .08);
}

.admin-dashboard-rank-bar-fill {
  min-width: 5px;
  height: 100%;
  border-radius: 999px;
  background: linear-gradient(135deg, #ff4d4d, #a80000);
}

.admin-dashboard-month-chart {
  display: grid;
  grid-template-columns: repeat(6, minmax(34px, 1fr));
  align-items: end;
  gap: .5rem;
  min-height: 240px;
  padding: .2rem .1rem 0;
}

.admin-dashboard-month-column {
  display: grid;
  grid-template-rows: auto 178px auto;
  align-items: end;
  gap: .35rem;
  min-width: 0;
  text-align: center;
}

.admin-dashboard-month-value {
  overflow: hidden;
  color: #555;
  font-size: .72rem;
  font-weight: 850;
  line-height: 1;
  text-overflow: ellipsis;
}

.admin-dashboard-month-track {
  display: flex;
  align-items: flex-end;
  width: 100%;
  height: 178px;
  overflow: hidden;
  border-radius: 7px 7px 3px 3px;
  background: #f1f1f1;
}

.admin-dashboard-month-bar {
  display: block;
  width: 100%;
  border-radius: 7px 7px 3px 3px;
  background: linear-gradient(180deg, #ff5a5a 0%, #a80000 100%);
}

.admin-dashboard-month-label {
  overflow: hidden;
  color: #666;
  font-size: .68rem;
  font-weight: 700;
  line-height: 1.15;
  text-overflow: ellipsis;
  white-space: nowrap;
}

@media (max-width: 850px) {
  .admin-dashboard-heading-desktop {
    display: none;
  }

  .admin-dashboard-heading-mobile {
    display: inline;
  }

  .admin-dashboard-card-subtitle--empty {
    display: none;
  }

  .admin-dashboard-kpi-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .admin-dashboard-kpi-grid--six {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .admin-dashboard-kpi-meta > span:first-child {
    flex: 0 0 auto;
  }

  .admin-dashboard-kpi-small {
    flex: 0 0 auto;
    min-width: 0;
    max-width: 100%;
    margin-left: 0;
    row-gap: .2rem;
    text-align: left;
    white-space: normal;
  }

  .admin-dashboard-kpi-small-data,
  .admin-dashboard-kpi-small-value,
  .admin-dashboard-kpi-small .admin-dashboard-trend {
    white-space: nowrap;
  }

  .admin-dashboard-rank-value-label {
    display: none;
  }

  .admin-dashboard-insight-switcher {
    display: block;
  }

  .admin-dashboard-carousel-button--desktop {
    display: none;
  }

  .admin-dashboard-insight-groups {
    display: grid;
    gap: .9rem;
  }

  .admin-dashboard-insight-group,
  .admin-dashboard-insight-group.is-desktop-active {
    display: grid;
    grid-template-columns: 22px minmax(0, 1fr) 22px;
    align-items: center;
    gap: .16rem;
  }

  .admin-dashboard-carousel-button--mobile {
    display: inline-flex;
    width: 22px;
    height: 38px;
    font-size: 1.45rem;
  }

  .admin-dashboard-insights-grid {
    grid-template-columns: minmax(0, 1fr);
    gap: 0;
  }

  .admin-dashboard-insight-panel {
    display: none;
  }

  .admin-dashboard-insight-panel.is-mobile-active {
    display: block;
  }
}

@media (max-width: 560px) {
  .admin-dashboard-page .admin-dashboard-section-head {
    align-items: flex-start;
    gap: .65rem;
  }

  .admin-dashboard-section-head p {
    display: none;
  }

  .admin-dashboard-kpi-grid {
    gap: .58rem;
  }

  .admin-dashboard-kpi-card {
    padding: .78rem;
    border-radius: 12px;
  }

  .admin-dashboard-card-head {
    margin-bottom: .65rem;
  }

  .admin-dashboard-card-subtitle {
    font-size: .74rem;
  }

  .admin-dashboard-kpi-value {
    font-size: 1.55rem;
  }

  .admin-dashboard-kpi-meta {
    align-items: baseline;
    justify-content: flex-start;
    gap: .3rem .55rem;
    padding-top: .55rem;
    font-size: .74rem;
  }

  .admin-dashboard-kpi-small {
    justify-content: flex-start;
    text-align: left;
  }

  .admin-dashboard-insight-group,
  .admin-dashboard-insight-group.is-desktop-active {
    grid-template-columns: 18px minmax(0, 1fr) 18px;
    gap: .1rem;
  }

  .admin-dashboard-carousel-button--mobile {
    width: 18px;
    height: 34px;
    font-size: 1.32rem;
  }

  .admin-dashboard-insight-panel {
    min-height: 306px;
    padding: .85rem;
  }

  .admin-dashboard-month-chart {
    gap: .28rem;
    min-height: 226px;
  }

  .admin-dashboard-month-column {
    grid-template-rows: auto 164px auto;
  }

  .admin-dashboard-month-track {
    height: 164px;
  }

  .admin-dashboard-month-label {
    font-size: .62rem;
  }
}

@media (max-width: 480px) {
  .admin-dashboard-kpi-grid,
  .admin-dashboard-kpi-grid--six {
    grid-template-columns: minmax(0, 1fr);
    gap: .5rem;
  }

  .admin-dashboard-kpi-card {
    padding: .78rem .88rem;
  }

  .admin-dashboard-card-head {
    margin-bottom: .48rem;
  }

  .admin-dashboard-kpi-value-row {
    margin-bottom: .48rem;
  }

  .admin-dashboard-kpi-meta {
    justify-content: space-between;
    gap: .32rem 1rem;
  }

  .admin-dashboard-kpi-small {
    margin-left: 0;
    text-align: left;
  }
}

@media (max-width: 400px) {
  .admin-dashboard-kpi-card {
    padding: .7rem;
  }

  .admin-dashboard-page .admin-dashboard-card-title {
    font-size: .9rem;
  }

  .admin-dashboard-trend {
    height: 21px;
    padding: 0 .35rem;
    font-size: .68rem;
  }

  .admin-dashboard-recent-content {
    grid-template-columns: minmax(0, 1fr);
    gap: .16rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  .admin-dashboard-live-badge > span {
    animation: none;
  }

  .admin-dashboard-card--link,
  .admin-dashboard-carousel-button,
  .admin-dashboard-recent-order {
    transition: none;
  }
}
/* ADMIN DASHBOARD ENDE */
/* LOGIN MOBILE */
/* Login Layout-Umschalter */
.login-tiles { display: block; }
.login-compact { display: none; }

@media (max-width: 600px) {
  .login-tiles { display: none; }
  .login-compact {
    display: flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    min-height: calc(100vh - 58px);
    min-height: calc(100svh - 58px);
    padding: 1.25rem 0.75rem 2rem;
  }
}

.login-compact .settings-center {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  width: min(100%, 420px);
  margin: 0 auto;
  align-items: stretch;
}

.login-compact-heading {
  display: grid;
  gap: 0.28rem;
  padding-bottom: 0.85rem;
  justify-items: center;
  text-align: center;
}

.login-compact-heading::after {
  content: "";
  display: block;
  width: 58px;
  height: 4px;
  margin-top: 0.45rem;
  border-radius: 999px;
  background: #a80000;
}

.login-compact-title {
  margin: 0;
  color: #222;
  font-size: 2rem;
  font-weight: 900;
  line-height: 1.1;
  text-align: center;
}

.login-compact-subtitle {
  margin: 0;
  color: #666;
  font-size: 0.98rem;
  line-height: 1.35;
  text-align: center;
}

.login-compact .settings-form {
  display: flex;
  flex-direction: column;
  background: transparent;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  gap: 0.9rem;
  padding: 0;
  text-align: center;
  align-items: stretch;
}

.login-compact .settings-form .form-row {
  display: flex;
  width: 100%;
  align-items: stretch;
  gap: 0.45rem;
  text-align: center;
}

.login-compact .settings-form .form-row label {
  color: #555;
  font-size: 0.9rem;
  font-weight: 800;
  width: 100%;
  text-align: center;
}

.login-compact .settings-form .login-remember-option {
  align-self: center;
  display: inline-flex;
  flex: 0 1 auto;
  width: auto;
  min-height: auto;
  margin: -0.15rem auto 0;
  padding: 0.15rem 0.25rem;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  color: #555;
  font-size: 0.9rem;
  font-weight: 700;
  justify-content: center;
  white-space: nowrap;
}

.login-compact .settings-form .input-control,
.login-compact .settings-form input[type="text"],
.login-compact .settings-form select {
  width: 100%;
  max-width: 100%;
  height: 3rem;
  padding: 0.72rem 0.95rem;
  border: 1px solid rgba(34,34,34,0.12);
  border-radius: 14px;
  background-color: #fff;
  color: #222;
  font-size: 1rem;
  line-height: 1.2;
  box-shadow: 0 8px 18px rgba(0,0,0,0.06);
  text-align: center;
  transition: border-color 0.15s ease, box-shadow 0.15s ease, background-color 0.15s ease;
}

.login-compact .settings-form input[type="text"]::placeholder {
  color: #8a8a8a;
  font-weight: 500;
}

.login-compact .settings-form .login-search-row {
  align-items: center;
  margin-top: -0.1rem;
}

.login-compact .settings-form .login-search-row label,
.login-desktop-search-label {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.login-compact .settings-form .login-search-row input[type="text"] {
  width: min(82%, 300px);
  height: 2.35rem;
  padding: 0.48rem 0.9rem;
  border-color: rgba(34,34,34,0.08);
  border-radius: 999px;
  background: rgba(255,255,255,0.72);
  color: #555;
  font-size: 0.9rem;
  box-shadow: none;
}

.login-compact .settings-form .login-user-select-row .input-control {
  width: min(82%, 300px);
  align-self: center;
}

.login-compact .settings-form .login-user-select-row {
  align-items: center;
}

.login-user-select-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  width: min(82%, 300px);
  align-self: center;
}

.login-compact .settings-form .login-user-select-head label {
  width: auto;
  margin: 0;
  text-align: left;
}

.login-mobile-filter-picker {
  z-index: 45;
}

.history-period-options.login-mobile-filter-options {
  min-width: 155px;
}

.login-compact .settings-form select.input-control {
  padding-left: 2.25rem;
  padding-right: 2.25rem;
  background-image:
    linear-gradient(45deg, transparent 50%, #a80000 50%),
    linear-gradient(135deg, #a80000 50%, transparent 50%);
  background-position:
    calc(100% - 21px) 50%,
    calc(100% - 15px) 50%;
  background-repeat: no-repeat;
  background-size: 7px 7px, 7px 7px;
}

.login-compact .settings-form .input-control:focus,
.login-compact .settings-form input[type="text"]:focus,
.login-compact .settings-form select:focus {
  background-color: #fff;
  border-color: rgba(168,0,0,0.42);
  box-shadow: 0 0 0 4px rgba(168,0,0,0.12), 0 10px 22px rgba(0,0,0,0.08);
}

.login-compact .settings-form .login-search-row input[type="text"]:focus {
  border-color: rgba(168,0,0,0.28);
  box-shadow: 0 0 0 3px rgba(168,0,0,0.09);
}

.login-compact-actions {
  display: grid;
  gap: 0.55rem;
  justify-items: center;
  width: 100%;
  align-items: center;
}

.login-compact-new-user-form {
  display: flex;
  justify-content: center;
  margin: 0;
  min-width: 0;
  width: auto;
}

.login-compact-actions .btn-admin {
  min-width: 0;
  height: 2.8rem;
  padding: 0 1.2rem;
  box-sizing: border-box;
  text-align: center;
  white-space: nowrap;
}

.login-compact-actions > .btn-admin {
  padding: 0 2.35rem;
}

.login-compact-new-user-form .btn-admin {
  height: 2rem;
  padding: 0 0.72rem;
  font-size: 0.78rem;
  line-height: 1;
}
/* LOGIN MOBILE ENDE */

.secure-login-page {
  min-height: 100vh;
  min-height: 100svh;
  margin: 0;
  background: #f6f7f8;
  color: #222;
}

.secure-login-shell {
  box-sizing: border-box;
  min-height: 100vh;
  min-height: 100svh;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1.25rem;
}

.secure-login-panel {
  width: min(100%, 420px);
  display: grid;
  justify-items: center;
  gap: 0.85rem;
  text-align: center;
}

.secure-login-mark {
  width: 3.25rem;
  height: 3.25rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  background: #e8f6ee;
  color: #177245;
  font-size: 1.5rem;
  font-weight: 900;
}

.secure-login-panel--error .secure-login-mark {
  background: #fff1f1;
  color: #a80000;
}

.secure-login-panel--inactive .secure-login-mark {
  background: #f0f1f2;
  color: #555;
}

.secure-login-panel h1 {
  margin: 0;
  font-size: 1.9rem;
  line-height: 1.1;
  font-weight: 900;
}

.secure-login-panel p {
  max-width: 32rem;
  margin: 0;
  color: #666;
  font-size: 0.98rem;
  line-height: 1.45;
}

.secure-login-copy-link {
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
  padding: 0.7rem 0.8rem;
  border: 1px solid rgba(0,0,0,0.08);
  border-radius: 10px;
  background: #fff;
  color: #333 !important;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 0.8rem !important;
  overflow-wrap: anywhere;
}

.secure-login-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.6rem;
  justify-content: center;
  margin-top: 0.45rem;
}

.secure-login-actions form {
  margin: 0;
}

.secure-pin-form {
  width: min(100%, 320px);
  display: grid;
  gap: 0.75rem;
  text-align: left;
}

.secure-pin-form label {
  display: grid;
  gap: 0.35rem;
  color: #333;
  font-weight: 800;
}

.secure-pin-input {
  width: 100%;
  box-sizing: border-box;
  height: 2.8rem;
  border: 1px solid rgba(0,0,0,0.14);
  border-radius: 10px;
  background: #fff;
  color: #222;
  font-size: 1.25rem;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-align: center;
  outline: none;
}

.secure-pin-input:focus {
  border-color: rgba(168,0,0,0.5);
  box-shadow: 0 0 0 3px rgba(168,0,0,0.12);
}

.secure-pin-form.is-invalid .secure-pin-input {
  border-color: #a80000;
  background: #fff5f5;
  box-shadow: 0 0 0 3px rgba(168,0,0,.12);
}

.secure-pin-form.is-shaking .secure-pin-input {
  animation: login-field-shake .34s ease-in-out;
}

.secure-pin-input:disabled {
  cursor: not-allowed;
  opacity: .78;
}

.secure-login-panel .secure-pin-error {
  width: 100%;
  color: #a80000;
  font-size: .82rem;
  font-weight: 700;
  line-height: 1.3;
  text-align: left;
}

.secure-pin-error[hidden] {
  display: none;
}

.secure-pin-form button {
  justify-self: center;
}

.secure-pin-form button:disabled {
  cursor: not-allowed;
  opacity: .55;
}

.secure-login-status {
  min-height: 1.2em;
  color: #666;
  font-size: 0.88rem !important;
}

.secure-desktop-auth {
  display: none;
  width: 100%;
  justify-items: center;
  gap: 0.85rem;
}

.secure-desktop-panel {
  display: grid;
  justify-items: center;
  gap: 0.7rem;
}

.secure-desktop-panel[hidden] {
  display: none;
}

.secure-desktop-qr {
  width: min(62vw, 260px);
  height: auto;
  display: block;
}

.secure-desktop-panel p {
  font-size: 0.9rem;
}

@media (min-width: 800px) {
  .secure-desktop-auth {
    display: grid;
  }
}

.legal-page {
  box-sizing: border-box;
  margin: 0 auto;
  max-width: 900px;
  padding: 2rem 1rem 3rem;
}

.legal-card {
  background: #fff;
  border: 1px solid rgba(0,0,0,.08);
  border-radius: 10px;
  box-shadow: 0 8px 22px rgba(0,0,0,.08);
  padding: 1.5rem;
}

.legal-eyebrow {
  color: #a80000;
  font-size: 0.78rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  margin: 0 0 0.2rem;
  text-transform: uppercase;
}

.legal-card h1 {
  font-size: clamp(1.55rem, 4vw, 2.15rem);
  line-height: 1.2;
  margin: 0 0 1.25rem;
}

.legal-section {
  border-top: 1px solid rgba(0,0,0,.08);
  padding-top: 1rem;
}

.legal-section + .legal-section {
  margin-top: 1rem;
}

.legal-section h2 {
  font-size: 1rem;
  margin: 0 0 0.7rem;
}

.legal-section h3 {
  font-size: 0.94rem;
  margin: 0.8rem 0 0.35rem;
}

.legal-section p {
  margin: 0;
}

.legal-section p + p {
  margin-top: 0.65rem;
}

.legal-section ul {
  margin: 0.65rem 0 0;
  padding-left: 1.2rem;
}

.legal-section li + li {
  margin-top: 0.25rem;
}

.legal-link {
  color: #a80000;
  font-weight: 700;
  text-decoration: underline;
  text-underline-offset: 0.14em;
}

.legal-link:hover,
.legal-link:focus-visible {
  color: #7d0000;
}

.legal-actions {
  display: flex;
  justify-content: flex-end;
  margin-top: 1.25rem;
}

.legal-stand {
  color: #666;
  font-size: 0.9rem;
  margin: 1.25rem 0 0;
}

@media (max-width: 600px) {
  .legal-page {
    padding: 1rem 0.75rem 2rem;
  }

  .legal-card {
    border-radius: 8px;
    padding: 1.1rem;
  }

}

.login-tiles {
  padding: 0.6rem 0 2.5rem;
}

.login-desktop-filter-badges {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 0.5rem;
  box-sizing: border-box;
  width: 94%;
  max-width: 1120px;
  margin: 0.75rem auto 0;
  padding: 0 0.75rem;
}

.login-filter-badge {
  flex: 0 0 auto;
  font-family: inherit;
  cursor: pointer;
}

.login-search-badge {
  flex: 0 0 auto;
  width: 28px;
  padding-right: 0;
  padding-left: 0;
  font-family: inherit;
  cursor: pointer;
}

.login-search-badge-icon {
  display: block;
  font-family: "Segoe UI Symbol", "Arial Unicode MS", sans-serif;
  font-size: 0.9rem;
  font-style: normal;
  font-weight: 400;
  line-height: 1;
}

.login-desktop-search {
  display: flex;
  justify-content: center;
  box-sizing: border-box;
  width: 94%;
  max-width: 1120px;
  margin: 0.65rem auto 0;
  padding: 0 0.75rem;
}

.login-desktop-search[hidden] {
  display: none;
}

.login-tiles .login-desktop-search-input {
  width: min(100%, 320px);
  max-width: 320px;
  min-height: 2.35rem;
  height: 2.35rem;
  padding: 0.48rem 0.9rem;
  border-radius: 999px;
  text-align: left;
}

.login-desktop-filter-empty {
  margin: 0.6rem 0 0;
  color: #666;
  font-size: 0.92rem;
  font-weight: 700;
  text-align: center;
}

.login-remember-option {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.55rem;
  min-height: 2.5rem;
  padding: 0.48rem 0.85rem;
  box-sizing: border-box;
  border: 1px solid rgba(168,0,0,0.16);
  border-radius: 10px;
  background: #fff;
  color: #333;
  font-size: 0.95rem;
  font-weight: 700;
  box-shadow: 0 6px 14px rgba(0,0,0,0.07);
  cursor: pointer;
  user-select: none;
}

.login-remember-option input {
  width: 1.05rem;
  height: 1.05rem;
  accent-color: #a80000;
  cursor: pointer;
}

.login-footer-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.7rem;
  justify-content: center;
  align-items: center;
  margin: 0 auto 2rem;
  width: 94%;
}

.login-footer-actions .btn-admin {
  box-sizing: border-box;
  max-width: 220px;
  text-decoration: none;
}

/* BUTTONS & CONTAINER */

/* BUTTON-USER & BUTTON-USER-CONTAINER */
/* === Container für die Benutzer-Buttons === */
.button-user-container {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  justify-content: center;
  align-items: center;
  margin: 2rem auto;
  max-width: 90%;
}


/* === Formulare innerhalb des Containers === */
.button-user-container > form:not(.admin-rule-form) {
  flex: 1 1 200px; /* alle Buttons nehmen gleiche Breite bis 200px oder mehr ein */
  max-width: 250px;
  margin: 0.5rem;
}

/* === Benutzer-Button-Styling === */
.button-user {
  width: 100%; /* Button füllt das Form-Element aus */
  height: 70px;
  background: #d9d9d9; /* hellgrau als Standard */
  color: #000; /* schwarze Schrift */
  border: none;
  border-radius: 12px;
  font-size: 1rem;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.25s ease;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.15);
}

.button-user:hover {
  transform: translateY(-2px);
  box-shadow: 0 6px 14px rgba(0, 0, 0, 0.25);
}

.button-user:active {
  transform: translateY(0);
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.2);
}

.button-user--new {
  outline: 2px dashed rgba(255,255,255,0.6);
  outline-offset: -4px;
}

.login-tiles .button-user-container {
  display: block;
  width: 94%;
  max-width: 1120px;
  margin: 1.5rem auto 2.5rem;
}

.login-tile-group {
  min-width: 0;
}

.login-tile-group + .login-tile-group {
  margin-top: 1.25rem;
  padding-top: 1.25rem;
  border-top: 1px solid rgba(0, 0, 0, 0.12);
}

.login-tile-group.is-first-visible {
  margin-top: 0;
  padding-top: 0;
  border-top: 0;
}

.login-tile-group__title {
  margin: 0 0 0.8rem;
  color: #a80000;
  font-size: 1rem;
  font-weight: 800;
  line-height: 1.2;
  text-align: left;
}

.login-tile-group__grid {
  display: flex;
  flex-wrap: wrap;
  align-items: stretch;
  justify-content: flex-start;
  gap: 0.75rem;
}

.login-tile-group__grid > form,
.login-new-user-row > form {
  flex: 0 1 240px;
  width: 240px;
  max-width: 100%;
  margin: 0;
}

.login-new-user-row {
  display: flex;
  align-items: stretch;
  justify-content: flex-start;
  margin-top: 1.25rem;
  padding-top: 1.25rem;
  border-top: 1px solid rgba(0, 0, 0, 0.12);
}

.login-user-tile {
  position: relative;
  overflow: hidden;
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  height: 88px;
  min-height: 88px;
  padding: 0.85rem 1rem 0.85rem 1.15rem;
  border: 1px solid rgba(0,0,0,0.08);
  border-left: 5px solid rgba(168,0,0,0.55);
  border-radius: 14px;
  background: #fff;
  color: #222;
  text-align: left;
  box-shadow: 0 8px 18px rgba(0,0,0,0.08);
}

.login-user-tile__name {
  display: block;
  max-width: 100%;
  font-size: 1.03rem;
  font-weight: 600;
  line-height: 1.2;
}

.login-user-tile__meta {
  display: block;
  max-width: 100%;
  margin-top: 0.3rem;
  font-size: 0.84rem;
  font-weight: 500;
  line-height: 1.2;
  opacity: 0.76;
}

.login-user-tile:hover,
.login-user-tile:focus-visible {
  transform: translateY(-2px);
  border-color: rgba(168,0,0,0.18);
  box-shadow: 0 12px 24px rgba(0,0,0,0.14);
  outline: none;
}

.login-user-tile--new {
  border: 1px dashed rgba(168,0,0,0.35);
  border-left: 5px solid rgba(168,0,0,0.35);
  background: #fff8f8;
  color: #a80000;
  outline: none;
}

/* === Mobile Darstellung === */
@media (max-width: 600px) {
  .button-user {
    min-width: unset;
  }

  .button-user-container form {
    flex: 1 1 100%;
    max-width: none;
  }
}

/* BUTTON-USER & BUTTON-CONTAINER ENDE */

/* BUTTON-SET-SMALL & INPUT-SET-SMALL & BANNER-PW */
/* === Navigations-Buttons im Banner === */
.button-set-small {
  background: rgba(255, 255, 255, 0.2);               /* etwas deckender Hintergrund */
  border: 1px solid rgba(255, 255, 255, 0.4);         /* klarerer Rahmen */
  color: #fff;
  border-radius: 10px;
  padding: 0.5rem 1rem;
  font-size: 0.95rem;
  font-weight: 600;
  text-decoration: none;
  cursor: pointer;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.25);          /* feiner Schlagschatten */
  backdrop-filter: blur(4px);                         /* Glas-Effekt für Tiefe */
}

/* === Hover / Fokus === */
.button-set-small:hover,
.button-set-small:focus {
  background: rgba(255, 255, 255, 0.35);              /* stärkerer Kontrast */
  color: #222;                                        /* Text dunkler für Lesbarkeit */
  transform: translateY(-2px);
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.35);
}

/* === Aktiver Zustand (beim Klicken gedrückt) === */
.button-set-small:active {
  transform: translateY(0);
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.3);
}

/* Gleicher Look im Banner für <a> und <button> */
.nav-links a.button-set-small,
.nav-links button.button-set-small {
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: .35rem;                  /* Platz fürs Emoji/Icon */
  font-weight: 600;             /* sicherheitshalber vereinheitlichen */
}

/* === Passwortfeld-Bereich unter dem Header === */
.admin-login {
  overflow: hidden;
  max-height: 0;
  transition: max-height 0.25s ease;
  background: #ffeaea;
  border-top: 1px solid rgba(0,0,0,0.08);
  box-shadow: inset 0 2px 6px rgba(0,0,0,0.06);
  position: relative; z-index: 5;
}
.admin-login:not(.is-hidden) { max-height: 140px; }

.admin-login-form {
  display: flex; gap: .5rem; align-items: center; justify-content: center;
  padding: .8rem 1rem;
}

.admin-login-field-wrap {
  display: grid;
  gap: .3rem;
  width: 100%;
  min-width: 0;
}

.admin-password-field {
  position: relative;
  display: flex;
  align-items: center;
}

.admin-password-field input {
  width: 100%;
  box-sizing: border-box;
  padding: .5rem 2.45rem .5rem .8rem;
  border-radius: 6px;
  border: 1px solid #aaa;
  font-size: 1rem;
  text-align: left;
}

.admin-password-field input:focus {
  outline: none;
  border-color: #ff4d4d; box-shadow: 0 0 4px rgba(255,77,77,.35);
}

.admin-password-field.is-invalid input {
  border-color: #a80000;
  background: #fff5f5;
  box-shadow: 0 0 0 3px rgba(168,0,0,.12);
}

.admin-password-field input:disabled {
  cursor: not-allowed;
  opacity: .78;
}

.admin-login-form button:disabled,
.admin-popup form button:disabled {
  cursor: not-allowed;
  opacity: .55;
}

.admin-password-field.is-shaking {
  animation: login-field-shake .34s ease-in-out;
}

.admin-login-field-error {
  margin: 0;
  color: #a80000;
  font-size: .78rem;
  font-weight: 700;
  line-height: 1.25;
  text-align: left;
}

.admin-login-field-error[hidden] {
  display: none;
}

@keyframes login-field-shake {
  0%,
  100% {
    transform: translateX(0);
  }
  25% {
    transform: translateX(-4px);
  }
  50% {
    transform: translateX(4px);
  }
  75% {
    transform: translateX(-2px);
  }
}

@media (prefers-reduced-motion: reduce) {
  .admin-password-field.is-shaking,
  .secure-pin-form.is-shaking .secure-pin-input {
    animation: none;
  }
}

.admin-password-toggle {
  position: absolute;
  right: .25rem;
  top: 50%;
  transform: translateY(-50%);
  width: 2rem;
  height: 2rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  border: none;
  border-radius: 6px;
  background: transparent;
  color: #555;
  cursor: pointer;
  transition: background .15s ease, color .15s ease;
}

.admin-password-toggle:hover,
.admin-password-toggle:focus-visible {
  background: rgba(168,0,0,.08);
  color: #a80000;
  outline: none;
}

.admin-password-toggle-icon {
  width: 1.15rem;
  height: 1.15rem;
  display: block;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.admin-password-toggle-icon--hide {
  display: none;
}

.admin-password-toggle.is-visible .admin-password-toggle-icon--show {
  display: none;
}

.admin-password-toggle.is-visible .admin-password-toggle-icon--hide {
  display: block;
}

/* --- Admin-Popup-Login (kleines Fenster unter Button) --- */
.admin-popup {
  position: absolute;
  top: 110%;
  left: 50%;
  transform: translateX(-50%);
  width: 90vw;
  max-width: 260px;
  background: #fff;
  color: #333;
  border: 1px solid rgba(0,0,0,0.15);
  border-radius: 10px;
  box-shadow: 0 6px 16px rgba(0,0,0,0.25);
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 1rem 0;
  z-index: 1101;
}

.admin-popup.hidden {
  display: none;
}

.admin-popup form {
  display: flex;
  flex-direction: column;
  width: 90%;
  gap: 0.5rem;
  margin: 0;
}

.admin-popup .admin-password-field input {
  font-size: 0.95rem;
}

.admin-popup .button-set-small {
  background: #ff4d4d;
  border: none;
  color: white;
  padding: 0.4rem 0.8rem;
  border-radius: 6px;
  cursor: pointer;
  font-size: 0.9rem;
  transition: background 0.2s ease;
  justify-content: center;
}

.admin-popup .button-set-small:hover {
  background: #c00000;
}

/* === Zentrierter Button am unteren Rand === */
.back-fab-wrap {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 16px;
  display: flex;
  justify-content: center;
  z-index: 1100;
  pointer-events: none;
}

.button-back {
  background: #ffffff;
  pointer-events: auto;
  color: #a80000;
  border: 2px solid #a80000;
  border-radius: 999px;
  padding: 0.6rem 1.4rem;
  font-size: 1rem;
  font-weight: 700;
  cursor: pointer;
  box-shadow: 0 6px 16px rgba(0,0,0,0.2);
  transition: transform .15s ease, box-shadow .15s ease, background .15s ease, color .15s ease;
}

.button-back:hover,
.button-back:focus-visible {
  transform: translateY(-2px);
  box-shadow: 0 10px 20px rgba(0,0,0,0.25);
  background: #a80000;
  color: #fff;
}

@media (max-width: 640px) {
  .button-back {
    padding: 0.5rem 1.2rem;
    font-size: 0.95rem;
  }
}

/* BUTTON-SET-SMALL & BANNER-PW ENDE*/

/* GEMEINSAME FORMULARFELDER */
.form-row {
  display: inline-flex;
  flex-direction: column;
  gap: 0.4rem;
  align-items: center; /* Label & Input mittig ausrichten */
}

.form-row label {
  font-weight: 600;
}

/* Einheitliche Eingabe-Komponente */
.input-control,
.form-row input[type="text"],
.form-row input[type="password"],
.form-row input[type="number"],
.form-row input[type="date"],
.form-row input[type="email"],
.form-row input[type="tel"],
.form-row select,
.form-row textarea {
  width: 100%;
  max-width: 360px;
  padding: 0.6rem 0.75rem;
  border: 1px solid #cfcfcf;
  border-radius: 10px;
  font-family: inherit;
  font-size: 1rem;
  box-sizing: border-box;
  text-align: center; /* du willst zentriert */
  background: #fff;
  height: 2.6rem;
  line-height: 1.3rem;
  align-items: center;
}

/* iOS-Sonderbehandlung fürs Datum (optional, hilft oft bei der Höhe) */
input[type="date"] {
  -webkit-appearance: none;
  appearance: none;
  font-family: inherit;
}

input[type="date"]::-webkit-datetime-edit,
input[type="date"]::-webkit-datetime-edit-fields-wrapper,
input[type="date"]::-webkit-datetime-edit-text,
input[type="date"]::-webkit-datetime-edit-day-field,
input[type="date"]::-webkit-datetime-edit-month-field,
input[type="date"]::-webkit-datetime-edit-year-field {
  font-family: inherit;
}
.input-control:focus,
.form-row input:focus,
.form-row select:focus,
.form-row textarea:focus {
  outline: none;
  border-color: #ff4d4d;
  box-shadow: 0 0 0 3px rgba(255, 77, 77, 0.18);
}

/* Selects hübscher */
.form-row select {
  -webkit-appearance: none;
  appearance: none;
  background-image:
    linear-gradient(45deg, transparent 50%, #999 50%),
    linear-gradient(135deg, #999 50%, transparent 50%);
  background-position:
    calc(100% - 18px) 50%,
    calc(100% - 13px) 50%;
  background-size: 6px 6px, 6px 6px;
  background-repeat: no-repeat;
}

/* Mobile Feinheiten */
@media (max-width: 520px) {
  .form-row input { max-width: 100%; }
}
/* GEMEINSAME FORMULARFELDER ENDE */

/* MONITOR & KAFFE-FLAT */
.monitor-empty {
  display: block;
  width: 100%;
  box-sizing: border-box;
  margin: 0;
  padding: 0.85rem 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  color: #777;
  font-size: 0.9rem;
  font-weight: 600;
  text-align: center;
}

.monitor-empty p {
  margin: 0;
}

@media (max-width: 600px) {
  .monitor-empty {
    padding: 0.7rem 0;
    font-size: 0.86rem;
  }
}

.monitor-team-search {
  width: 100%;
  max-width: 440px;
  margin: 0 0 0.85rem;
}

.monitor-team-search-input {
  width: 100%;
  box-sizing: border-box;
}
/* =========================
   Dashboard / Bedarf
========================= */

.monitor-prep-table,
.monitor-people-table {
  width: 100%;
  overflow: hidden;
  border: 1px solid rgba(0,0,0,.1);
  border-radius: 14px;
  background: #fff;
}

.monitor-prep-row {
  --monitor-prep-accent: #a80000;
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 0.8rem;
  overflow: hidden;
  min-width: 0;
  min-height: 3.8rem;
  box-sizing: border-box;
  padding: 0.68rem 0.9rem;
  border-top: 1px solid rgba(0,0,0,.07);
  background: #fff;
  cursor: pointer;
  transition: background .15s ease, transform .15s ease;
}

.monitor-prep-row.has-icon {
  grid-template-columns: 52px minmax(0, 1fr) auto;
}

.monitor-prep-row::before {
  content: "";
  position: absolute;
  inset: 0 auto 0 0;
  width: 4px;
  background: var(--monitor-prep-accent);
}

.monitor-prep-row--broetchen {
  --monitor-prep-accent: #c27b13;
}

.monitor-prep-row--broetchen::before {
  display: none;
}

.monitor-prep-row--eggs {
  --monitor-prep-accent: #d2a100;
}

.monitor-prep-row--tonno {
  --monitor-prep-accent: #257eaa;
}

.monitor-prep-row--extras {
  --monitor-prep-accent: #a64c78;
}

.monitor-prep-icon {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 52px;
  height: 52px;
  overflow: hidden;
  border-radius: 11px;
  background: #f7f7f7;
}

.monitor-prep-icon > img:not(.monitor-prep-icon-layer) {
  display: block;
  width: 92%;
  height: 92%;
  object-fit: contain;
}

.monitor-prep-icon-layer {
  position: absolute;
  display: block;
  width: 56%;
  height: 56%;
  object-fit: contain;
}

.monitor-prep-icon-layer--0 {
  z-index: 4;
  top: 60%;
  left: 50%;
  width: 70%;
  height: 70%;
  transform: translate(-50%, -50%);
}

.monitor-prep-icon-layer--0:only-child {
  top: 50%;
  width: 92%;
  height: 92%;
  transform: translate(-50%, -50%);
}

.monitor-prep-icon-layer--1 {
  z-index: 3;
  top: 4px;
  right: 3px;
  transform: rotate(7deg);
}

.monitor-prep-icon-layer--2 {
  z-index: 2;
  top: 7px;
  left: 3px;
  transform: rotate(-7deg);
}

.monitor-prep-icon-layer--3 {
  z-index: 1;
  top: 2px;
  left: 50%;
  transform: translateX(-50%);
}

.monitor-prep-icon--layers-2 .monitor-prep-icon-layer--0 {
  top: 60%;
  left: 44%;
}

.monitor-prep-icon--layers-3 .monitor-prep-icon-layer--0,
.monitor-prep-icon--layers-4 .monitor-prep-icon-layer--0 {
  top: 63%;
}

.monitor-prep-copy {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 0.4rem;
  min-width: 0;
}

.monitor-prep-name {
  min-width: 0;
  overflow-wrap: anywhere;
  color: #222;
  font-size: 0.92rem;
  font-weight: 800;
  line-height: 1.25;
}

.monitor-prep-details {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.3rem;
  min-width: 0;
}

.monitor-prep-details > span {
  display: inline-flex;
  align-items: center;
  gap: 0.28rem;
  max-width: 100%;
  padding: 0.25rem 0.45rem;
  border-radius: 7px;
  background: #f4f4f5;
  color: #4b4b4b;
  font-size: 0.78rem;
  font-weight: 600;
  line-height: 1.2;
}

.monitor-prep-details strong {
  color: #222;
  font-weight: 850;
}

.monitor-prep-total {
  align-self: center;
  min-width: 2.5rem;
  color: #a80000;
  text-align: right;
  font-size: 1.3rem;
  font-weight: 900;
  line-height: 1;
}

.monitor-prep-row:hover {
  background: #fffafa;
}

.monitor-prep-row:focus-visible,
.monitor-overview-card.is-clickable:focus-visible {
  outline: 3px solid rgba(168,0,0,.2);
  outline-offset: -3px;
}

.monitor-prep-row:active,
.monitor-overview-card.is-clickable:active {
  transform: translateY(1px);
}

.monitor-overview-card.is-clickable {
  cursor: pointer;
}

.monitor-overview-card.is-clickable:hover {
  border-color: rgba(168,0,0,.2);
  box-shadow: 0 8px 20px rgba(0,0,0,.07);
}

@media (min-width: 701px) {
  .monitor-prep-table {
    overflow: visible;
    border: 0;
    border-radius: 0;
    background: transparent;
  }

  .monitor-prep-list {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.7rem;
  }

  .monitor-prep-row {
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 0.7rem;
    min-height: 5.4rem;
    padding: 0.78rem 0.85rem 0.78rem 1rem;
    border: 1px solid rgba(0,0,0,.09);
    border-radius: 14px;
    box-shadow: 0 5px 14px rgba(0,0,0,.04);
  }

  .monitor-prep-row::before {
    border-radius: 0;
  }

  .monitor-prep-total {
    align-self: center;
    min-width: 2.8rem;
    text-align: center;
    font-size: 1.55rem;
  }
}

@media (min-width: 1000px) {
  .monitor-prep-list {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 700px) {
  .monitor-prep-row {
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 0.7rem;
    padding: 0.68rem 0.75rem 0.7rem 0.85rem;
  }

  .monitor-prep-row.has-icon {
    grid-template-columns: 44px minmax(0, 1fr) auto;
  }

  .monitor-prep-row.has-icon.is-icon-hidden {
    grid-template-columns: minmax(0, 1fr) auto;
  }

  .monitor-prep-row.is-icon-hidden .monitor-prep-icon {
    display: none;
  }

  .monitor-prep-icon {
    width: 44px;
    height: 44px;
    border-radius: 9px;
  }

  .monitor-prep-row:first-child {
    border-top: 0;
  }

  .monitor-prep-total {
    align-self: center;
    text-align: center;
  }

  .monitor-prep-details > span {
    font-size: 0.74rem;
  }

  .monitor-page .monitor-section-subtitle {
    display: none;
  }
}

body.is-content-sheet-open {
  overflow: hidden;
}

.content-sheet-backdrop {
  position: fixed;
  z-index: 99998;
  inset: 0;
  display: block;
  border: 0;
  background: rgba(0, 0, 0, 0.34);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition:
    opacity 0.18s ease,
    visibility 0s linear 0.24s;
}

.content-sheet-backdrop.is-open {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transition:
    opacity 0.18s ease,
    visibility 0s linear 0s;
}

.content-sheet {
  position: fixed;
  z-index: 99999;
  bottom: 0;
  left: 50%;
  display: grid;
  grid-template-rows: auto auto minmax(0, 1fr);
  width: min(calc(100% - 2rem), 640px);
  max-height: min(76vh, 640px);
  max-height: min(76dvh, 640px);
  padding: 0.35rem 1rem calc(0.85rem + env(safe-area-inset-bottom, 0px));
  box-sizing: border-box;
  border: 1px solid rgba(0, 0, 0, 0.1);
  border-bottom: 0;
  border-radius: 20px 20px 0 0;
  background: #fff;
  box-shadow: 0 -16px 40px rgba(0, 0, 0, 0.2);
  opacity: 0;
  visibility: hidden;
  transform: translate(-50%, 104%);
  transition:
    opacity 0.18s ease,
    visibility 0s linear 0.24s,
    transform 0.24s ease;
}

.content-sheet.is-open,
.admin-meals-breakfast-sheet.is-open {
  opacity: 1;
  visibility: visible;
  transform: translate(-50%, var(--knt-bottom-sheet-drag-y, 0px));
  transition:
    opacity 0.18s ease,
    visibility 0s linear 0s,
    transform 0.24s ease;
}

.content-sheet-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.75rem;
  padding: 0.1rem 0 0.65rem;
  border-bottom: 1px solid rgba(0, 0, 0, 0.09);
}

.content-sheet-heading {
  min-width: 0;
}

.content-sheet-heading > span {
  display: block;
  margin-bottom: 0.05rem;
  color: #a80000;
  font-size: 0.68rem;
  font-weight: 900;
  letter-spacing: 0.06em;
  line-height: 1.2;
  text-transform: uppercase;
}

.content-sheet-heading h3 {
  margin: 0;
  overflow-wrap: anywhere;
  color: #171717;
  font-size: 1.2rem;
  font-weight: 850;
  line-height: 1.2;
}

.content-sheet-heading p {
  margin: 0.16rem 0 0;
  color: #6a6a6a;
  font-size: 0.78rem;
  line-height: 1.35;
}

.content-sheet-close {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 2.2rem;
  width: 2.2rem;
  height: 2.2rem;
  padding: 0;
  border: 1px solid rgba(0, 0, 0, 0.1);
  border-radius: 50%;
  background: #fff;
  color: #333;
  cursor: pointer;
}

.content-sheet-close:hover,
.content-sheet-close:focus-visible {
  border-color: rgba(168, 0, 0, 0.28);
  color: #a80000;
  outline: none;
}

.content-sheet-close .material-symbols-outlined {
  font-size: 1.2rem;
}

.content-sheet-close-icon {
  font-size: 1.5rem;
  font-weight: 400;
  line-height: 1;
}

.content-sheet-body {
  min-height: 0;
  overflow-y: auto;
  overscroll-behavior: contain;
  padding: 0.7rem 0.1rem 0.1rem;
  scrollbar-gutter: stable;
}

.content-sheet-grid {
  display: grid;
  grid-template-columns: minmax(145px, 0.72fr) minmax(0, 1.28fr);
  gap: 0.85rem;
}

.content-sheet-grid.is-single {
  grid-template-columns: minmax(0, 1fr);
}

.content-sheet-section {
  min-width: 0;
}

.content-sheet-section + .content-sheet-section {
  padding-left: 0.85rem;
  border-left: 1px solid rgba(0, 0, 0, 0.08);
}

.content-sheet-section h4 {
  margin: 0 0 0.38rem;
  color: #333;
  font-size: 0.78rem;
  font-weight: 900;
  letter-spacing: 0.045em;
  line-height: 1.2;
  text-transform: uppercase;
}

.content-sheet-list {
  margin: 0;
  padding-left: 1.05rem;
  color: #333;
  font-size: 0.84rem;
  line-height: 1.35;
}

.content-sheet-list li {
  margin: 0.24rem 0;
  padding-left: 0.08rem;
}

.content-sheet-note {
  margin: 0.7rem 0 0;
  padding: 0.55rem 0.65rem;
  border-left: 3px solid #d6a000;
  background: #fff9ea;
  color: #5c4300;
  font-size: 0.8rem;
  line-height: 1.4;
}

.content-sheet-empty {
  margin: 0;
  color: #666;
  font-size: 0.84rem;
}

.monitor-need-sheet-sections {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(145px, 1fr));
  gap: 0.8rem;
}

.monitor-need-sheet-section {
  min-width: 0;
}

.monitor-need-sheet-heading {
  display: flex;
  align-items: baseline;
  justify-content: flex-start;
  gap: 0.35rem;
  margin-bottom: 0.35rem;
}

.monitor-need-sheet-heading h4 {
  margin: 0;
  color: #333;
  font-size: 0.82rem;
  font-weight: 850;
  line-height: 1.25;
}

.monitor-need-sheet-heading strong {
  flex: 0 0 auto;
  color: #a80000;
  font-size: 1rem;
  font-weight: 900;
  line-height: 1;
}

.content-sheet-actions {
  display: flex;
  justify-content: flex-end;
  gap: 0.5rem;
  margin-top: 0.75rem;
  padding-top: 0.65rem;
  border-top: 1px solid rgba(0, 0, 0, 0.08);
}

.content-sheet-actions .btn-admin {
  width: auto;
}

.order-confirm-copy {
  display: grid;
  gap: 0.45rem;
}

.order-confirm-copy > p,
.knt-confirm-prompt > p {
  margin: 0;
  color: #4d5560;
  font-size: 0.92rem;
  line-height: 1.45;
}

.knt-confirm-prompt {
  display: grid;
  gap: 0.45rem;
}

.knt-confirm-prompt > label {
  color: #252525;
  font-size: 0.86rem;
  font-weight: 800;
}

.knt-confirm-prompt > .input-control {
  width: 100%;
  max-width: none;
  box-sizing: border-box;
}

.order-confirm-summary {
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: 0.3rem;
}

.order-confirm-summary-row {
  display: inline-flex;
  align-items: baseline;
  gap: 0.25rem;
  padding: 0;
}

.order-confirm-summary-row + .order-confirm-summary-row {
  border-top: 0;
}

.order-confirm-summary-row + .order-confirm-summary-row::before {
  content: "·";
  margin-right: 0.05rem;
  color: #9a9a9a;
  font-weight: 800;
}

.order-confirm-summary-row span {
  color: #626a75;
  font-size: 0.84rem;
  font-weight: 700;
}

.order-confirm-summary-row strong {
  color: #a80000;
  font-size: 1rem;
  font-weight: 900;
  white-space: nowrap;
}

.order-confirm-note {
  font-size: 0.82rem !important;
  color: #717781 !important;
}

body.is-knt-confirm-popup-open {
  overflow: hidden;
}

.knt-confirm-popup-root {
  position: fixed;
  z-index: 100000;
  inset: 0;
}

.knt-confirm-popup-root[hidden] {
  display: none !important;
}

.knt-confirm-popup-backdrop {
  position: fixed;
  z-index: 0;
  inset: 0;
  width: 100%;
  height: 100%;
  padding: 0;
  border: 0;
  background: rgba(0, 0, 0, 0.42);
  opacity: 0;
  cursor: default;
  transition: opacity 0.16s ease;
}

.knt-confirm-popup {
  position: fixed;
  z-index: 1;
  top: 50%;
  left: 50%;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
  width: min(calc(100% - 2rem), 420px);
  max-height: min(calc(100vh - 2rem), 520px);
  max-height: min(calc(100dvh - 2rem), 520px);
  padding: 0.8rem 0.9rem 0.85rem;
  box-sizing: border-box;
  border: 1px solid rgba(0, 0, 0, 0.1);
  border-radius: 18px;
  background: #fff;
  box-shadow: 0 18px 48px rgba(0, 0, 0, 0.24);
  opacity: 0;
  transform: translate(-50%, -47%) scale(0.96);
  transition: opacity 0.16s ease, transform 0.18s ease;
}

.knt-confirm-popup-root.is-open .knt-confirm-popup-backdrop,
.knt-confirm-popup-root.is-open .knt-confirm-popup {
  opacity: 1;
}

.knt-confirm-popup-root.is-open .knt-confirm-popup {
  transform: translate(-50%, -50%) scale(1);
}

.knt-confirm-popup-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.65rem;
  padding-bottom: 0.55rem;
  border-bottom: 1px solid rgba(0, 0, 0, 0.09);
}

.knt-confirm-popup-head > div {
  min-width: 0;
}

.knt-confirm-popup-head span {
  display: block;
  margin-bottom: 0.04rem;
  color: #a80000;
  font-size: 0.68rem;
  font-weight: 900;
  letter-spacing: 0.06em;
  line-height: 1.2;
  text-transform: uppercase;
}

.knt-confirm-popup-head h3 {
  margin: 0;
  color: #171717;
  font-size: 1.12rem;
  font-weight: 850;
  line-height: 1.2;
}

.knt-confirm-popup-close {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 2rem;
  width: 2rem;
  height: 2rem;
  padding: 0;
  border: 1px solid rgba(0, 0, 0, 0.1);
  border-radius: 50%;
  background: #fff;
  color: #333;
  font-size: 1.35rem;
  line-height: 1;
  cursor: pointer;
}

.knt-confirm-popup-body {
  min-height: 0;
  overflow-y: auto;
  padding: 0.55rem 0.05rem 0;
}

.knt-confirm-popup-actions {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin-top: 0.6rem;
  padding-top: 0.6rem;
  gap: 0.5rem;
  border-top: 1px solid rgba(0, 0, 0, 0.08);
}

.knt-confirm-popup-actions[hidden],
.knt-confirm-popup-actions .btn-admin[hidden] {
  display: none !important;
}

.knt-confirm-popup-actions.is-single-action {
  grid-template-columns: minmax(0, 1fr);
}

.knt-confirm-popup-actions .btn-admin {
  width: 100%;
  min-width: 0;
}

@media (prefers-reduced-motion: reduce) {
  .knt-confirm-popup-backdrop,
  .knt-confirm-popup {
    transition: none;
  }
}

@media (max-width: 640px) {
  .content-sheet {
    left: 0;
    width: 100%;
    max-height: min(82vh, 680px);
    max-height: min(82dvh, 680px);
    transform: translateY(104%);
  }

  .content-sheet.is-open {
    transform: translateY(var(--knt-bottom-sheet-drag-y, 0px));
  }

  .content-sheet-grid {
    grid-template-columns: minmax(0, 1fr);
    gap: 0;
  }

  .content-sheet-section + .content-sheet-section {
    margin-top: 0.7rem;
    padding-top: 0.7rem;
    padding-left: 0;
    border-top: 1px solid rgba(0, 0, 0, 0.08);
    border-left: 0;
  }
}

@media (prefers-reduced-motion: reduce) {
  .content-sheet,
  .content-sheet-backdrop {
    transition: none;
  }
}

.monitor-section-subtitle {
  margin: 0.18rem 0 0;
  color: #707070;
  font-size: 0.86rem;
  font-weight: 600;
  line-height: 1.35;
}

.monitor-section-head {
  align-items: flex-end;
  margin-bottom: 0.85rem;
}

.monitor-page .monitor-section-head h2,
.kaffe-page .kaffe-section-head h2 {
  color: #222;
  line-height: 1.25;
}

/* =========================
   Monitorübersichten
========================= */

.monitor-hero-card .monitor-view-nav {
  margin: 0.75rem auto 0;
}

.monitor-fresh-note {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.45rem;
  order: 3;
  margin: 0.75rem 0 0;
  color: #666;
  text-align: center;
  font-size: 0.82rem;
  font-weight: 600;
  line-height: 1.35;
}

.monitor-fresh-dot {
  box-sizing: border-box;
  flex: 0 0 auto;
  width: 0.65rem;
  height: 0.65rem;
  border: 2px solid rgba(214,153,0,.62);
  border-radius: 3px;
  background: transparent;
}

.monitor-articles-section,
.monitor-meals-section,
.monitor-people-section {
  display: flex;
  flex-direction: column;
}

.monitor-articles-section .monitor-section-head,
.monitor-meals-section .monitor-section-head,
.monitor-people-section .monitor-section-head {
  order: 0;
}

.monitor-articles-section .monitor-overview-grid,
.monitor-articles-section .monitor-empty,
.monitor-meals-section .monitor-overview-grid,
.monitor-meals-section .monitor-empty,
.monitor-people-section .monitor-team-search {
  order: 1;
}

.monitor-people-section .monitor-people-table {
  order: 2;
}

.monitor-status-note {
  display: block;
  margin: 0.65rem 0 0;
  color: #795a13;
  text-align: center;
  font-size: 0.82rem;
  font-weight: 600;
  line-height: 1.35;
}

.monitor-status-note strong {
  color: #664800;
}

.monitor-overview-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.75rem;
  width: 100%;
}

.monitor-overview-card {
  position: relative;
  display: grid;
  grid-template-columns: 52px minmax(0, 1fr);
  align-items: center;
  gap: 0.75rem;
  min-width: 0;
  min-height: 5.8rem;
  width: 100%;
  box-sizing: border-box;
  overflow: hidden;
  padding: 0.8rem;
  border: 1px solid rgba(0,0,0,.08);
  border-radius: 14px;
  background: #fff;
  box-shadow: 0 6px 16px rgba(0,0,0,.045);
  text-align: left;
  transition: border-color .15s ease, box-shadow .15s ease, transform .15s ease;
}

.monitor-overview-card.is-icon-hidden {
  grid-template-columns: minmax(0, 1fr);
}

.monitor-overview-card.is-icon-hidden .monitor-overview-visual {
  display: none;
}

.monitor-overview-visual {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 52px;
  height: 52px;
  overflow: hidden;
  border-radius: 11px;
  background: #fff1f1;
}

.monitor-overview-img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.monitor-overview-fallback {
  color: #a80000;
  font-size: 1.5rem;
  line-height: 1;
}

.monitor-overview-content {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  min-width: 0;
}

.monitor-overview-label {
  min-width: 0;
  overflow-wrap: anywhere;
  color: #222;
  font-size: 0.9rem;
  font-weight: 750;
  line-height: 1.25;
}

.monitor-overview-meta {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.32rem;
  margin-top: 0.15rem;
}

.monitor-fresh-badge {
  display: inline-flex;
  align-items: center;
  padding: 0.08rem 0.32rem;
  border: 1px solid rgba(191,135,0,.5);
  border-radius: 999px;
  background: transparent;
  color: #795600;
  font-size: 0.66rem;
  font-weight: 800;
  line-height: 1.2;
}

.monitor-overview-value {
  margin-top: 0.25rem;
  color: #a80000;
  font-size: 1.35rem;
  font-weight: 850;
  line-height: 1;
}

.monitor-overview-card.is-fresh {
  border-color: rgba(214,153,0,.72);
  box-shadow: 0 0 0 2px rgba(255,193,7,.38), 0 6px 16px rgba(0,0,0,.045);
}

.monitor-overview-card.has-need-accent.is-icon-hidden::before {
  content: "";
  position: absolute;
  z-index: 1;
  inset: 0 auto 0 0;
  width: 4px;
  background: var(--monitor-item-need-accent);
}

.monitor-overview-card.has-need-eggs {
  --monitor-item-need-accent: #d2a100;
}

.monitor-overview-card.has-need-tonno {
  --monitor-item-need-accent: #257eaa;
}

.monitor-overview-card.has-need-extras {
  --monitor-item-need-accent: #a64c78;
}

.monitor-overview-card.has-need-eggs.has-need-tonno {
  --monitor-item-need-accent: linear-gradient(
    to bottom,
    #d2a100 0 50%,
    #257eaa 50% 100%
  );
}

.monitor-overview-card.has-need-eggs.has-need-extras {
  --monitor-item-need-accent: linear-gradient(
    to bottom,
    #d2a100 0 50%,
    #a64c78 50% 100%
  );
}

.monitor-overview-card.has-need-tonno.has-need-extras {
  --monitor-item-need-accent: linear-gradient(
    to bottom,
    #257eaa 0 50%,
    #a64c78 50% 100%
  );
}

.monitor-overview-card.has-need-eggs.has-need-tonno.has-need-extras {
  --monitor-item-need-accent: linear-gradient(
    to bottom,
    #d2a100 0 33.333%,
    #257eaa 33.333% 66.666%,
    #a64c78 66.666% 100%
  );
}

/* =========================
   Personenübersicht
========================= */

.monitor-people-head,
.monitor-person-row {
  display: grid;
  grid-template-columns: minmax(160px, 0.8fr) minmax(0, 2fr) minmax(190px, 0.8fr);
  align-items: center;
  gap: 0.85rem;
  min-width: 0;
  box-sizing: border-box;
  padding: 0.72rem 0.9rem;
}

.monitor-people-head {
  background: #f7f7f8;
  color: #737373;
  font-size: 0.74rem;
  font-weight: 800;
  letter-spacing: 0.045em;
  text-transform: uppercase;
}

.monitor-people-head > :last-child {
  text-align: right;
}

.monitor-person-row {
  min-height: 4rem;
  border-top: 1px solid rgba(0,0,0,.07);
}

.monitor-person-name {
  min-width: 0;
  overflow-wrap: anywhere;
  color: #222;
  font-size: 0.92rem;
  font-weight: 800;
  line-height: 1.3;
}

.monitor-person-items,
.monitor-person-meals {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  min-width: 0;
  gap: 0.35rem;
}

.monitor-person-meals {
  justify-content: flex-end;
}

.monitor-item-chip {
  display: inline-flex;
  align-items: center;
  gap: 0.28rem;
  max-width: 100%;
  padding: 0.3rem 0.5rem;
  border: 1px solid rgba(0,0,0,.06);
  border-radius: 999px;
  background: #f4f4f4;
  color: #333;
  font-size: 0.78rem;
  font-weight: 600;
  line-height: 1.2;
}

.monitor-item-chip strong {
  color: #a80000;
  font-weight: 800;
}

.monitor-item-chip.is-fresh {
  border-color: rgba(191,135,0,.62);
  background: #f4f4f4;
  box-shadow: inset 0 0 0 1px rgba(255,193,7,.28);
}

.monitor-item-chip--empty {
  color: #777;
  background: #f7f7f7;
}

.monitor-meal-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  min-width: 5.8rem;
  padding: 0.32rem 0.52rem;
  box-sizing: border-box;
  border: 1px solid rgba(0,0,0,.08);
  border-radius: 999px;
  font-size: 0.76rem;
  font-weight: 800;
  line-height: 1.2;
  text-align: center;
}

.monitor-meal-badge.is-booked {
  border-color: rgba(24,122,47,.18);
  background: #e8f7ea;
  color: #187a2f;
}

.monitor-meal-badge.is-missing {
  border-color: rgba(168,0,0,.16);
  background: #fff0f0;
  color: #9e2424;
}

@media (max-width: 900px) {
  .monitor-overview-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .monitor-people-head,
  .monitor-person-row {
    grid-template-columns: minmax(135px, 0.75fr) minmax(0, 1.6fr) minmax(150px, 0.7fr);
  }
}

@media (max-width: 700px) {
  .monitor-fresh-note {
    order: 1;
    align-self: stretch;
    justify-content: flex-start;
    margin: 0 0 0.75rem;
    text-align: left;
  }

  .monitor-articles-section .monitor-overview-grid,
  .monitor-articles-section .monitor-empty,
  .monitor-meals-section .monitor-overview-grid,
  .monitor-meals-section .monitor-empty,
  .monitor-people-section .monitor-team-search {
    order: 2;
  }

  .monitor-people-section .monitor-people-table {
    order: 3;
  }

  .monitor-overview-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.6rem;
  }

  .monitor-people-head {
    display: none;
  }

  .monitor-person-row {
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 0.55rem 0.7rem;
    padding: 0.72rem 0.75rem;
  }

  .monitor-person-row:first-child {
    border-top: 0;
  }

  .monitor-person-name {
    grid-column: 1;
    grid-row: 1;
  }

  .monitor-person-meals {
    grid-column: 2;
    grid-row: 1;
  }

  .monitor-person-items {
    grid-column: 1 / -1;
    grid-row: 2;
  }

  .monitor-meal-badge {
    min-width: 0;
  }
}

@media (max-width: 420px) {
  .monitor-overview-card {
    grid-template-columns: 42px minmax(0, 1fr);
    gap: 0.58rem;
    min-height: 5.25rem;
    padding: 0.65rem;
  }

  .monitor-overview-visual {
    width: 42px;
    height: 42px;
    border-radius: 9px;
  }

  .monitor-overview-label {
    font-size: 0.82rem;
  }

  .monitor-overview-value {
    font-size: 1.18rem;
  }

  .monitor-fresh-note,
  .monitor-status-note {
    font-size: 0.76rem;
  }
}

.kaffe-section-head {
  align-items: flex-end;
  margin-bottom: 0.9rem;
}

.kaffe-section-subtitle {
  margin: 0.2rem 0 0;
  color: #707070;
  font-size: 0.86rem;
  font-weight: 600;
  line-height: 1.35;
}

.kaffe-flat-group:only-child {
  grid-column: 1 / -1;
}

.kaffe-user-list {
  overflow: hidden;
  border: 1px solid rgba(0,0,0,.1);
  border-radius: 14px;
  background: #fff;
}

.kaffe-booking-list {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.45rem;
}

.kaffe-booking-badge {
  display: inline-flex;
  align-items: center;
  gap: 0.42rem;
  max-width: 100%;
  box-sizing: border-box;
  padding: 0.38rem 0.48rem 0.38rem 0.65rem;
  border: 1px solid rgba(168,0,0,.1);
  border-radius: 999px;
  background: #fff7f0;
}

.kaffe-booking-name {
  min-width: 0;
  overflow-wrap: anywhere;
  color: #222;
  font-size: 0.86rem;
  font-weight: 700;
  line-height: 1.2;
}

.kaffe-booking-count {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  min-width: 1.75rem;
  min-height: 1.35rem;
  padding: 0.08rem 0.35rem;
  box-sizing: border-box;
  border-radius: 999px;
  background: #a80000;
  color: #fff;
  font-size: 0.76rem;
  font-weight: 800;
  line-height: 1;
}

.kaffe-flat-groups {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: start;
  gap: 1.1rem;
}

.kaffe-flat-group {
  min-width: 0;
}

.kaffe-flat-group-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 0.75rem;
  min-height: 2.8rem;
  margin-bottom: 0.55rem;
}

.kaffe-page .kaffe-flat-group-head h3 {
  margin: 0;
  color: #222;
  text-align: left;
  font-size: 0.96rem;
  font-weight: 800;
  line-height: 1.25;
}

.kaffe-flat-group-head p {
  margin: 0.14rem 0 0;
  color: #777;
  font-size: 0.78rem;
  font-weight: 600;
}

.kaffe-flat-group-head > strong {
  flex: 0 0 auto;
  color: #a80000;
  font-size: 0.78rem;
  line-height: 1.25;
  text-align: right;
}

.kaffe-user-row {
  --flat-progress: 0%;
  --kaffe-flat-accent: #a80000;
  position: relative;
  isolation: isolate;
  display: flex;
  align-items: center;
  min-height: 3.45rem;
  box-sizing: border-box;
  overflow: hidden;
  padding: 0.68rem 0.85rem 0.68rem 1rem;
  border-bottom: 1px solid rgba(0,0,0,.07);
}

.kaffe-user-row:last-child {
  border-bottom: 0;
}

.kaffe-user-row::before {
  content: "";
  position: absolute;
  inset: 0 auto 0 0;
  z-index: 0;
  width: 4px;
  background: var(--kaffe-flat-accent);
}

.kaffe-user-row--day {
  --kaffe-flat-accent: #d98b00;
  background: linear-gradient(
    90deg,
    rgba(255,184,77,.2) 0%,
    rgba(255,184,77,.2) var(--flat-progress),
    #fff var(--flat-progress),
    #fff 100%
  );
}

.kaffe-user-row--month {
  --kaffe-flat-accent: #2c86d1;
  background: linear-gradient(
    90deg,
    rgba(77,163,255,.17) 0%,
    rgba(77,163,255,.17) var(--flat-progress),
    #fff var(--flat-progress),
    #fff 100%
  );
}

.kaffe-user-main {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  min-width: 0;
}

.kaffe-user-name {
  min-width: 0;
  overflow-wrap: anywhere;
  color: #222;
  font-size: 0.92rem;
  font-weight: 700;
  line-height: 1.25;
}

.kaffe-user-sub {
  margin-top: 0.12rem;
  color: #666;
  font-size: 0.79rem;
  font-weight: 600;
  line-height: 1.25;
}

.kaffe-empty-small {
  padding: 0.8rem 0.9rem;
  border: 1px dashed rgba(168,0,0,.22);
  border-radius: 12px;
  background: #fffafa;
  color: #8f2525;
  text-align: center;
  font-size: 0.86rem;
  font-weight: 600;
  line-height: 1.35;
}

@media (max-width: 700px) {
  .kaffe-flat-groups {
    grid-template-columns: minmax(0, 1fr);
    gap: 1.2rem;
  }

}
/* MONITOR & KAFFE-FLAT ENDE */

/* LAGE.PHP */
.lage-create-form {
  width: 100%;
  margin: 0;
}

.index-section-head.lage-section-head,
.index-section-head.lage-list-head {
  align-items: flex-end;
  margin-bottom: 0.9rem;
}

.lage-section-head > div,
.lage-list-head > div {
  display: grid;
  gap: 0.16rem;
  min-width: 0;
}

.lage-section-subtitle,
.admin-lage-list-subtitle,
.admin-item-section-subtitle,
.admin-user-section-subtitle {
  margin: 0;
  color: #666;
  font-size: 0.94rem;
  line-height: 1.4;
}

.lage-create-full-row {
  grid-column: 1 / -1;
}

.lage-create-groups > .admin-lage-settings-group {
  padding-top: 0;
  border-top: 0;
}

.lage-create-period-grid {
  align-items: start;
}

@media (min-width: 721px) {
  .admin-grid--two.lage-create-period-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .lage-create-period-grid .lage-recipient-field {
    grid-column: auto;
  }
}

.lage-create-form .form-row,
.lage-create-form .input-control {
  min-width: 0;
  max-width: 100%;
  box-sizing: border-box;
}

.lage-page .admin-actions.lage-create-actions,
.admin-lage-edit-page .admin-actions.admin-lage-edit-actions {
  justify-content: flex-end;
  margin-top: 1rem;
  padding-top: 0;
  border-top: 0;
}

.lage-recipient-field {
  grid-column: 1 / -1;
}

.lage-recipient-summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .75rem;
  margin-top: .55rem;
  padding: .58rem .7rem;
  border-radius: 10px;
  background: #f6f7f8;
  color: #4b5563;
  font-size: .88rem;
  line-height: 1.35;
}

.lage-recipient-summary[hidden] {
  display: none;
}

.lage-recipient-summary-edit {
  flex: 0 0 auto;
  padding: 0;
  border: 0;
  background: transparent;
  color: #a80000;
  font: inherit;
  font-weight: 800;
  text-decoration: underline;
  text-underline-offset: .16em;
  cursor: pointer;
}

.lage-recipient-dialog {
  width: min(620px, calc(100vw - 2rem));
  max-height: min(760px, calc(100vh - 2rem));
  max-height: min(760px, calc(100dvh - 2rem));
  padding: 1.25rem;
  border: 1px solid rgba(0, 0, 0, .1);
  border-radius: 20px;
  background: #fff;
  color: #202020;
  box-shadow: 0 24px 64px rgba(0, 0, 0, .24);
  box-sizing: border-box;
}

.lage-recipient-dialog::backdrop {
  background: rgba(20, 20, 20, .48);
  backdrop-filter: blur(2px);
}

.lage-recipient-dialog-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
}

.lage-recipient-dialog-head .index-eyebrow {
  margin: 0 0 .25rem;
}

.lage-recipient-dialog-head h3 {
  margin: 0;
  font-size: 1.35rem;
}

.lage-recipient-dialog-close,
.lage-recipient-rule-remove {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  border: 0;
  border-radius: 999px;
  background: #f1f2f4;
  cursor: pointer;
  font-weight: 800;
}

.lage-recipient-dialog-close {
  width: 2.1rem;
  height: 2.1rem;
  color: #4b5563;
  font-size: 1.35rem;
}

.lage-recipient-dialog-help {
  margin: .65rem 0 1rem;
  color: #687386;
  font-size: .92rem;
}

.lage-recipient-rules {
  display: grid;
  gap: .65rem;
  max-height: min(430px, 50vh);
  max-height: min(430px, 50dvh);
  overflow-y: auto;
  overscroll-behavior: contain;
}

.lage-recipient-rule {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) auto;
  gap: .6rem;
  align-items: end;
  padding: .7rem;
  border: 1px solid rgba(0, 0, 0, .09);
  border-radius: 12px;
  background: #fafafa;
}

.lage-recipient-rule-field {
  display: grid;
  gap: .32rem;
  min-width: 0;
  color: #4b5563;
  font-size: .8rem;
  font-weight: 800;
}

.lage-recipient-rule-field .input-control {
  min-width: 0;
}

.lage-recipient-rule-remove {
  width: 2.35rem;
  height: 2.35rem;
  margin-bottom: .02rem;
  color: #a80000;
  font-size: 1.15rem;
}

.lage-recipient-add {
  margin-top: .75rem;
}

.lage-recipient-error {
  margin: .7rem 0 0;
  color: #a80000;
  font-size: .88rem;
  font-weight: 750;
}

.lage-recipient-dialog-actions {
  justify-content: flex-end;
  margin-top: 1rem;
  padding-top: .9rem;
  border-top: 1px solid rgba(0, 0, 0, .09);
}

@media (max-width: 720px) {
  .lage-recipient-dialog {
    width: 100%;
    max-width: none;
    max-height: min(86vh, 760px);
    max-height: min(86dvh, 760px);
    margin: auto 0 0;
    padding: 1rem;
    border-width: 1px 0 0;
    border-radius: 20px 20px 0 0;
  }

  .lage-recipient-rule {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) 2.2rem;
    gap: .45rem;
    padding: .6rem;
  }

  .lage-recipient-rule-remove {
    width: 2.2rem;
    height: 2.35rem;
  }

  .lage-recipient-dialog-actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

}

.lage-stat-count {
  margin-top: 0.75rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 110px;
  padding: 0.45rem 0.75rem;
  border-radius: 999px;
  background: #ffe8e8;
  color: #a80000;
  font-size: 0.92rem;
  font-weight: 800;
  border: none;
  cursor: pointer;
  transition: transform .15s ease, filter .15s ease, box-shadow .15s ease;
}

.lage-stat-count:hover,
.lage-stat-count:focus-visible {
  transform: translateY(-1px);
  filter: brightness(1.03);
  box-shadow: 0 6px 14px rgba(168, 0, 0, 0.14);
}

.lage-entry-usage {
  display: grid;
  align-items: center;
  justify-content: center;
  justify-items: center;
  width: 100%;
  margin: 0;
  padding: 0.3rem 0.25rem;
  border: 0;
  border-radius: 9px;
  background: transparent;
  font-family: inherit;
  cursor: pointer;
  transition: background 0.15s ease, color 0.15s ease;
}

.lage-entry-usage:hover,
.lage-entry-usage:focus-visible {
  background: #fff2f2;
  color: #a80000;
  outline: none;
}

.lage-entry-usage:focus-visible {
  box-shadow: 0 0 0 2px rgba(168, 0, 0, 0.22);
}

.input-control[readonly],
.input-control.is-locked {
  background: #f2f2f2;
  color: #666;
  border-style: dashed;
  cursor: not-allowed;
}

@media (max-width: 720px) {
  .lage-max-items-label-prefix {
    display: none;
  }

  .lage-entry-table .lage-entry-row td {
    padding-top: 0.8rem;
    padding-bottom: 0.8rem;
  }

  .lage-page .admin-lage-status-badge {
    min-width: 58px;
    padding-right: 0.35rem;
    padding-left: 0.35rem;
  }

  .lage-entry-usage strong {
    font-size: 0.9rem;
  }

  .lage-entry-usage span {
    font-size: 0.68rem;
  }
}
/* LAGE ENDE */
/* ADMIN_LAGE.PHP */
.admin-lage-section-form {
  width: 100%;
  margin: 0;
}

.index-section-head.admin-lage-section-head {
  align-items: flex-end;
  flex-wrap: wrap;
  margin-bottom: 0;
}

.admin-lage-section-head > div:first-child {
  flex: 1 1 280px;
}

.admin-lage-section-head .muted,
.admin-evaluation-section-head .muted {
  color: #666;
  font-size: 0.9rem;
  font-weight: 600;
  line-height: 1.35;
}

.index-section-head.admin-lage-list-head {
  align-items: flex-end;
}

.admin-lage-settings-form {
  position: relative;
}

.admin-lage-module-switches {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(132px, 1fr));
  gap: 0 1rem;
  width: 100%;
  margin-top: 1rem;
  border-top: 1px solid rgba(0, 0, 0, 0.09);
  border-bottom: 1px solid rgba(0, 0, 0, 0.09);
}

.admin-lage-module-switch {
  display: grid;
  grid-template-columns: 44px minmax(0, auto);
  align-items: center;
  justify-content: start;
  gap: 0.75rem;
  min-width: 0;
  padding: 0.75rem 0;
  cursor: pointer;
}

.admin-lage-module-switch-name {
  min-width: 0;
  color: #222;
  font-size: 0.9rem;
  font-weight: 750;
  line-height: 1.25;
}

.admin-lage-module-switch .admin-lage-switch {
  flex: 0 0 auto;
}

.admin-lage-module-switch .admin-lage-switch-slider {
  width: 44px;
  height: 26px;
  flex-basis: 44px;
}

.admin-lage-module-switch .admin-lage-switch-slider::before {
  width: 20px;
  height: 20px;
}

.admin-lage-module-switch .admin-lage-switch input:checked + .admin-lage-switch-slider::before {
  transform: translateX(18px);
}

.admin-lage-module-switch .admin-lage-switch input:focus-visible + .admin-lage-switch-slider {
  outline: 2px solid rgba(168, 0, 0, 0.32);
  outline-offset: 3px;
}

.admin-lage-settings-groups {
  display: grid;
  gap: 1rem;
  width: 100%;
  margin-top: 0.25rem;
}

.admin-lage-settings-group {
  min-width: 0;
  padding-top: 1rem;
  border-top: 1px solid rgba(0, 0, 0, 0.09);
}

.admin-lage-settings-group:first-child {
  border-top: 0;
}

.admin-lage-settings-group[hidden] {
  display: none !important;
}

.admin-lage-settings-group-head {
  margin-bottom: 0.75rem;
}

.admin-lage-page .admin-lage-settings-group-head h3 {
  margin: 0;
  color: #222;
  font-size: 1rem;
  font-weight: 800;
  line-height: 1.3;
  text-align: left;
}

.admin-lage-settings-grid {
  margin-bottom: 0;
}

.admin-lage-settings-grid .form-row,
.admin-lage-settings-grid .input-control {
  min-width: 0;
  max-width: 100%;
  box-sizing: border-box;
}

.admin-lage-label-mobile {
  display: none;
}

.admin-lage-list-head > div:first-child {
  display: grid;
  gap: 0.16rem;
  min-width: 0;
}

.admin-lage-list-head-actions,
.admin-item-list-head-actions,
.admin-user-list-head-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 0.75rem;
  flex-wrap: wrap;
}

.admin-lage-list {
  width: 100%;
  box-sizing: border-box;
}

.admin-lage-row-title {
  display: grid;
  gap: 0.12rem;
  min-width: 0;
}

.admin-lage-row-subtitle {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  min-width: 0;
  color: #6b7280;
  font-size: 0.8rem;
  font-weight: 650;
  line-height: 1.35;
}

.admin-lage-row-subtitle > span + span::before {
  content: "·";
  display: inline-block;
  margin: 0 0.38rem;
  color: #9ca3af;
}

.admin-lage-row-break {
  display: block;
  flex: 0 0 100%;
  width: 0;
  height: 0;
  margin: 0;
  padding: 0;
}

.admin-lage-row-status,
.admin-lage-row-actions {
  text-align: center;
}

.admin-lage-status-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  min-width: 64px;
  padding: 0.28rem 0.5rem;
  border-radius: 999px;
  font-size: 0.78rem;
  font-weight: 800;
  line-height: 1.2;
}

button.admin-lage-status-badge {
  border: 0;
  font-family: inherit;
  cursor: pointer;
  transition: filter 0.15s ease, transform 0.15s ease, opacity 0.15s ease;
}

button.admin-lage-status-badge:hover,
button.admin-lage-status-badge:focus-visible {
  filter: brightness(0.97);
  transform: translateY(-1px);
}

button.admin-lage-status-badge:focus-visible {
  outline: 2px solid rgba(168, 0, 0, 0.3);
  outline-offset: 2px;
}

button.admin-lage-status-badge:disabled {
  opacity: 0.62;
  cursor: wait;
  transform: none;
}

.admin-lage-status-badge.is-active {
  background: #e6f6ea;
  color: #187a2f;
}

.admin-lage-status-badge.is-inactive {
  background: #eef0f3;
  color: #6b7280;
}

.admin-lage-row-usage {
  display: inline-grid;
  gap: 0.06rem;
  justify-items: center;
  color: #6b7280;
  font-size: 0.74rem;
  line-height: 1.2;
}

.admin-lage-row-usage-cell {
  text-align: center;
}

.admin-lage-row-usage strong {
  color: #222;
  font-size: 0.98rem;
  font-weight: 800;
}

.admin-lage-row-actions .btn-admin,
.admin-item-row-actions .btn-admin {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 42px;
  min-width: 42px;
  height: 42px;
  padding: 0;
  border-radius: 12px;
}

.admin-lage-edit-group-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
}

.admin-lage-edit-group-head .lage-stat-count {
  margin-top: 0;
  flex: 0 0 auto;
}

.admin-lage-edit-group-heading {
  display: grid;
  gap: 0.12rem;
  min-width: 0;
}

.admin-lage-edit-group-subtitle {
  margin: 0;
  color: #6b7280;
  font-size: 0.86rem;
  font-weight: 600;
  line-height: 1.3;
}

.admin-lage-edit-type-switches {
  grid-template-columns: repeat(auto-fit, minmax(132px, 200px));
  justify-content: start;
  margin: 0 0 1rem;
  border-top: 0;
  border-bottom: 0;
}

.admin-lage-edit-general-grid {
  align-items: end;
}

@media (min-width: 721px) {
  .admin-grid--two.admin-lage-edit-general-grid--single-date {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .admin-lage-edit-general-grid--single-date .admin-lage-edit-full-row {
    grid-column: auto;
  }

  .admin-grid--two.admin-lage-edit-release-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .admin-lage-edit-release-grid .lage-recipient-field {
    grid-column: auto;
  }
}

.admin-lage-edit-full-row {
  grid-column: 1 / -1;
}

.admin-lage-edit-groups {
  gap: 0;
  margin-top: 0;
}

.admin-lage-edit-groups > .admin-lage-settings-group {
  padding-top: 0;
  border-top: 0;
}

.admin-lage-edit-groups > .admin-lage-settings-group ~ .admin-lage-settings-group {
  margin-top: 1.15rem;
}

.admin-lage-edit-groups > .admin-lage-settings-group ~ .admin-lage-settings-group::before {
  content: "";
  display: block;
  width: 72px;
  height: 2px;
  margin: 0 auto 1.15rem;
  border-radius: 999px;
  background: rgba(168, 0, 0, 0.28);
}

.admin-lage-edit-info-control[readonly] {
  border-style: solid;
  background: #f4f5f7;
  color: #4b5563;
  cursor: default;
}

.admin-lage-edit-form .form-row[hidden] {
  display: none !important;
}

.admin-lage-edit-page .admin-lage-settings-grid > .form-row:only-child {
  grid-column: 1 / -1;
}

.admin-lage-switch {
  display: inline-flex;
  align-items: center;
  gap: 0.65rem;
  cursor: pointer;
  user-select: none;
}

.admin-lage-switch input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

.admin-lage-switch-slider {
  position: relative;
  width: 52px;
  height: 30px;
  border-radius: 999px;
  background: #d9d9d9;
  transition: background .2s ease;
  flex: 0 0 52px;
}

.admin-lage-switch-slider::before {
  content: "";
  position: absolute;
  top: 3px;
  left: 3px;
  width: 24px;
  height: 24px;
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 2px 6px rgba(0,0,0,.18);
  transition: transform .2s ease;
}

.admin-lage-switch input:checked + .admin-lage-switch-slider {
  background: #4caf50;
}

.admin-lage-switch input:checked + .admin-lage-switch-slider::before {
  transform: translateX(22px);
}

.admin-lage-switch-label {
  font-size: 0.92rem;
  font-weight: 700;
  color: #333;
}

.admin-lage-head-actions {
  display: inline-flex;
  align-items: center;
  gap: 0.75rem;
  flex: 0 0 auto;
}

.admin-lage-head-actions .lage-stat-count {
  margin-top: 0;
}

.admin-lage-entry-form {
  width: 100%;
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

.admin-lage-page .admin-actions {
  justify-content: flex-end;
}

.admin-lage-switch[data-stop-toggle="1"] {
  cursor: default;
}

@media (max-width: 720px) {
  .admin-lage-edit-type-switches {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.75rem;
  }

  .admin-lage-edit-type-switches .admin-lage-module-switch:only-child {
    grid-column: 1 / -1;
  }

  .admin-lage-edit-page .admin-actions.admin-lage-edit-actions {
    flex-wrap: nowrap;
  }

  .admin-grid--two.admin-lage-settings-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.75rem;
  }

  .admin-lage-label-desktop {
    display: none;
  }

  .admin-lage-label-mobile {
    display: inline;
  }

  .index-section-head.admin-lage-section-head {
    align-items: flex-start;
    flex-wrap: nowrap;
    gap: 0.65rem;
  }

  .admin-lage-section-head > div:first-child {
    flex-basis: auto;
  }

  .admin-lage-section-head .muted {
    display: none;
  }

  .admin-lage-head-actions {
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 0.5rem;
  }

  .admin-lage-head-actions .lage-stat-count {
    min-width: 0;
    padding: 0.35rem 0.55rem;
    font-size: 0.82rem;
  }

  .admin-lage-edit-group-head .lage-stat-count {
    min-width: 0;
    padding: 0.35rem 0.55rem;
    font-size: 0.82rem;
  }

}

@media (max-width: 640px) {
  .index-section-head.admin-lage-list-head {
    align-items: flex-start;
    flex-direction: row;
    gap: 0.5rem;
  }

  .admin-lage-list-head > div:first-child {
    flex: 1 1 auto;
  }

  .admin-lage-list-head-actions {
    flex: 0 0 auto;
    align-self: flex-start;
    width: auto;
  }

  .admin-lage-list-head-actions .btn-admin {
    white-space: nowrap;
  }

  .admin-lage-table .admin-lage-col-usage,
  .admin-lage-table .admin-lage-row-usage-cell {
    display: none;
  }

  .admin-lage-table-head .admin-lage-col-action {
    font-size: 0;
  }

  .admin-lage-table tbody td {
    padding-top: 0.8rem;
    padding-bottom: 0.8rem;
  }

  .admin-lage-row-actions .btn-admin,
  .admin-item-row-actions .btn-admin {
    width: 40px;
    min-width: 40px;
    height: 40px;
    padding: 0;
    border-radius: 12px;
  }

  .admin-lage-status-badge {
    min-width: 60px;
    padding-right: 0.4rem;
    padding-left: 0.4rem;
  }
}
/* ADMIN_LAGE ENDE */
/* FORM MOBILE */
@media (max-width: 820px),
       (any-pointer: coarse) and (max-width: 1024px) {

  .form-row {
    display: flex;        /* statt inline-flex */
    width: 100%;
    align-items: stretch; /* Feld nimmt die ganze Breite */
  }

  .input-control,
  .form-row input[type="date"], .form-row input[type="text"],  .form-row input[type="email"],
  .form-row select {
    width: 100%;
    max-width: 100%;
  }
}
/* Betragszustände */
.user-amount-text {
  font-size: 1rem;
  font-weight: 800;
  line-height: 1.2;
}

.amount-text--ok {
  color: #6b7280;
}

.amount-text--warn {
  color: #d97706;
}

.amount-text--danger {
  color: #b91c1c;
}

/* Einheitlicher Inhaltsrahmen unter dem Banner */
.page-wrap {
  box-sizing: border-box;
  width: 98%;
  max-width: 1200px;
  width: min(98%, 1200px);
  margin: 0 auto 2rem;
  padding: 0 8px;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  overflow-x: hidden;
}

/* Überschriften konsistent */
:where(.page-wrap) h2 {
  margin: 0 0 1rem;
  text-align: left;
  font-size: 1.6rem;
  font-weight: 800;
}
:where(.page-wrap) h3 {
  margin: 1.25rem 0 .6rem;
  text-align: left;
}

.centered-text {
  text-align: center;
  color: #666;
  margin-top: 0.75rem;
  font-style: italic;
}

.meal-popup-wrap {
  text-align: center;
}

.meal-popup-text {
  margin: 0 0 1rem;
  color: #555;
  font-size: 0.98rem;
}

.meal-popup-options {
  display: block;
}

.meal-option-card {
  width: 100%;
  border: 1px solid rgba(0,0,0,0.08);
  border-radius: 16px;
  background: #fff;
  padding: 0.9rem 1rem;
  display: flex;
  align-items: center;
  gap: 0.85rem;
  text-align: left;
  cursor: pointer;
  transition: transform 0.15s ease, box-shadow 0.15s ease, border-color 0.15s ease;
  box-sizing: border-box;

  appearance: none;
  -webkit-appearance: none;
  margin: 0 0 0.75rem 0;
  color: #222;
}

.meal-option-card:hover,
.meal-option-card:focus,
.meal-option-card:active {
  transform: translateY(-2px);
  border-color: rgba(168, 0, 0, 0.22);
  background: #fffdfd;
  outline: none;
}

.meal-option-icon {
  width: 44px;
  height: 44px;
  border-radius: 12px;
  background: linear-gradient(135deg, #ffe5e5, #fff3f3);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 1.35rem;
  flex: 0 0 44px;
}

.meal-option-icon img {
  display: block;
  width: 32px;
  height: 32px;
  object-fit: contain;
}

.meal-option-content {
  display: flex;
  flex-direction: column;
  gap: 0.15rem;
  min-width: 0;
  flex: 1 1 auto;
}

.meal-option-title {
  font-size: 1rem;
  font-weight: 700;
  color: #222;
}

.meal-option-subtitle {
  font-size: 0.9rem;
  color: #666;
}

@media (max-width: 520px) {
  .meal-option-card {
    padding: 0.8rem 0.85rem;
  }

  .meal-option-title {
    font-size: 0.96rem;
  }

  .meal-option-subtitle {
    font-size: 0.86rem;
  }
}

.meal-option-card-disabled {
  opacity: 0.55;
  cursor: not-allowed;
  pointer-events: none;
  filter: grayscale(0.2);
}

.meal-option-card-booked {
  background: #f3f4f6;
  border: 1px solid #d1d5db;
}

.meal-option-card-booked .meal-option-title {
  color: #6b7280;
}

.meal-option-card-booked .meal-option-icon {
  opacity: 0.7;
}

.meal-option-shell {
  margin: 0 0 0.75rem;
}

.meal-option-shell > .meal-option-card {
  margin-bottom: 0;
}

.meal-variant-options {
  border: 1px solid rgba(168, 0, 0, 0.18);
  border-top: 0;
  border-radius: 0 0 16px 16px;
  padding: 0.75rem;
  background: #fffafa;
  text-align: left;
}

.meal-option-shell > .meal-option-card[aria-expanded="true"] {
  border-radius: 16px 16px 0 0;
  border-color: rgba(168, 0, 0, 0.18);
}

.meal-variant-options > p {
  margin: 0 0 0.55rem;
  color: #666;
  font-size: 0.82rem;
  font-weight: 700;
}

.meal-variant-buttons {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.55rem;
}

.meal-variant-button {
  min-width: 0;
  border: 1px solid rgba(0, 0, 0, 0.1);
  border-radius: 12px;
  background: #fff;
  color: #222;
  padding: 0.55rem 0.65rem;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 0.5rem;
  font: inherit;
  font-weight: 700;
  cursor: pointer;
}

.meal-variant-button:hover,
.meal-variant-button:focus-visible,
.meal-variant-button.is-selected {
  border-color: #b90000;
  background: #fff3f3;
  outline: none;
}

.meal-variant-copy {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 0.08rem;
}

.meal-variant-copy strong {
  color: inherit;
}

.meal-variant-copy small {
  color: #667085;
  font-size: 0.78rem;
  font-weight: 500;
  line-height: 1.25;
}

.meal-variant-icon {
  width: 34px;
  height: 34px;
  flex: 0 0 34px;
  border-radius: 9px;
  background: #ffeaea;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: #a80000;
}

.meal-variant-icon img {
  width: 28px;
  height: 28px;
  object-fit: contain;
}

.meal-popup-wrap .meal-popup-text {
  margin-bottom: 0.7rem;
}

.meal-popup-wrap .meal-option-shell {
  overflow: hidden;
  margin-bottom: 0.6rem;
  border: 1px solid rgba(168, 0, 0, 0.18);
  border-radius: 15px;
  background: #fff;
}

.meal-popup-wrap .meal-option-shell > .meal-option-card,
.meal-popup-wrap .meal-option-shell > .meal-option-card:hover,
.meal-popup-wrap .meal-option-shell > .meal-option-card:focus,
.meal-popup-wrap .meal-option-shell > .meal-option-card:active,
.meal-popup-wrap .meal-option-shell > .meal-option-card[aria-expanded="true"] {
  margin: 0;
  padding: 0.68rem 0.75rem;
  border: 0;
  border-radius: 0;
  background: #fff;
  box-shadow: none;
  transform: none;
}

.meal-popup-wrap .meal-option-shell .meal-option-icon {
  width: 40px;
  height: 40px;
  flex-basis: 40px;
  border-radius: 11px;
}

.meal-popup-wrap .meal-option-shell .meal-option-icon img {
  width: 29px;
  height: 29px;
}

.meal-popup-wrap .meal-option-shell .meal-option-title {
  font-size: 0.96rem;
}

.meal-popup-wrap .meal-option-shell .meal-option-subtitle {
  font-size: 0.78rem;
}

.meal-popup-wrap .meal-option-shell > .meal-variant-options {
  padding: 0.55rem 0.65rem 0.65rem;
  border: 0;
  border-top: 1px solid rgba(0, 0, 0, 0.08);
  border-radius: 0;
  background: #fff;
}

.meal-popup-wrap .meal-variant-options > p {
  margin-bottom: 0.4rem;
  font-size: 0.76rem;
}

.meal-popup-wrap .meal-variant-buttons {
  gap: 0.45rem;
}

.meal-popup-wrap .meal-variant-button {
  min-height: 44px;
  padding: 0.38rem 0.48rem;
  border-color: transparent;
  border-radius: 13px;
  background: #f4f5f6;
  gap: 0.42rem;
}

.meal-popup-wrap .meal-variant-button:hover,
.meal-popup-wrap .meal-variant-button:focus-visible,
.meal-popup-wrap .meal-variant-button.is-selected {
  border-color: rgba(168, 0, 0, 0.28);
  background: #fff3f3;
}

.meal-popup-wrap .meal-variant-icon {
  width: 30px;
  height: 30px;
  flex-basis: 30px;
  border-radius: 8px;
  background: transparent;
}

.meal-popup-wrap .meal-variant-icon img {
  width: 27px;
  height: 27px;
}

.meal-popup-wrap .meal-variant-copy {
  flex: 1 1 auto;
  align-items: flex-start;
  text-align: left;
}

.meal-popup-wrap .meal-variant-copy strong {
  font-size: 0.82rem;
  line-height: 1.15;
}

.meal-popup-wrap .meal-variant-copy small {
  font-size: 0.7rem;
  line-height: 1.15;
}

.meal-both-variants {
  margin: -0.25rem 0 0.75rem;
  padding: 0.85rem;
  border: 1px solid rgba(168, 0, 0, 0.18);
  border-radius: 14px;
  background: #fffafa;
  text-align: left;
}

.meal-both-variant-row + .meal-both-variant-row {
  margin-top: 0.8rem;
}

.meal-both-variant-row > strong {
  display: block;
  margin-bottom: 0.35rem;
}

.meal-both-variant-row .meal-variant-options {
  border: 0;
  border-radius: 0;
  padding: 0;
  background: transparent;
}

.meal-both-variant-row .meal-variant-options > p {
  display: none;
}

.meal-both-submit {
  margin-top: 0.85rem;
  width: 100%;
}

.admin-meals-variant-dialog {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.65rem;
}

.admin-meals-variant-dialog .meal-variant-button {
  min-height: 58px;
  align-items: flex-start;
  padding: 0.65rem 0.55rem;
}

.admin-meals-variant-dialog .meal-variant-copy strong {
  font-size: 0.94rem;
  line-height: 1.18;
  overflow-wrap: anywhere;
}

.admin-meals-variant-dialog .meal-variant-copy small {
  font-size: 0.78rem;
  line-height: 1.2;
}

.admin-meals-plan-variant {
  display: block;
  margin-top: 0.25rem;
  color: #667085;
  font-weight: 600;
}

.breakfast-list {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  margin-top: 1rem;
}

.breakfast-entry {
  box-sizing: border-box;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 1rem;
  background: #fff;
  border: 1px solid rgba(0, 0, 0, 0.08);
  border-radius: 14px;
  padding: 0.9rem 1rem;
  box-shadow: 0 6px 16px rgba(0, 0, 0, 0.06);
  text-align: left;
}

.breakfast-entry-icon {
  flex: 0 0 auto;
  width: 48px;
  height: 48px;
  border-radius: 10px;
  background: #f5f5f5;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}

.breakfast-entry-icon img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
}

.breakfast-entry-fallback {
  font-size: 1.4rem;
  line-height: 1;
}

.breakfast-entry-main {
  flex: 1 1 auto;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 0.2rem;
}

.breakfast-entry-title {
  font-size: 1rem;
  font-weight: 700;
  color: #222;
  line-height: 1.3;
}

.breakfast-entry-note {
  font-size: 0.92rem;
  color: #666;
}

.breakfast-entry-price {
  flex: 0 0 auto;
  margin-left: auto;
  font-size: 1rem;
  font-weight: 700;
  color: #a80000;
  white-space: nowrap;
}

@media (max-width: 600px) {
  .breakfast-entry {
    gap: 0.75rem;
  }
}

/* INDEX.PHP */
.index-dashboard-grid {
  width: 100%;
  box-sizing: border-box;
}

.index-eyebrow {
  margin: 0 0 .25rem;
  color: #a80000;
  font-size: .82rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .06em;
}

.index-eyebrow-link,
.index-eyebrow-link:visited,
.index-eyebrow-link:hover,
.index-eyebrow-link:focus,
.index-eyebrow-link:active {
  color: inherit;
  text-decoration: none;
}

.index-eyebrow-link {
  display: inline-block;
}

.index-hero-card h1 {
  margin: 0;
  font-size: 1.9rem;
  font-size: clamp(1.6rem, 4vw, 2.25rem);
  line-height: 1.1;
}

.index-hero-subtitle {
  margin: .45rem 0 0;
  color: #666;
}

.index-login-remember-note {
  display: inline-flex;
  align-items: center;
  margin: .75rem 0 0;
  padding: .38rem .65rem;
  border: 1px solid rgba(24,122,47,.18);
  border-radius: 10px;
  background: rgba(24,122,47,.07);
  color: #187a2f;
  font-size: .9rem;
  font-weight: 700;
}

.index-section-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: .9rem;
}

.index-section-head h2 {
  margin: 0;
  font-size: 1.1rem;
  font-weight: 800;
}

.index-action-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: .85rem;
}

.index-action-grid > form {
  display: contents;
}

.index-action-card {
  width: 100%;
  min-height: 86px;
  padding: .9rem;
  border: 1px solid rgba(168,0,0,.14);
  border-radius: 16px;
  background: linear-gradient(135deg, #fff, #fff7f7);
  color: #222;
  box-shadow: 0 8px 18px rgba(0,0,0,.05);
  display: flex;
  align-items: center;
  gap: .75rem;
  text-align: left;
  cursor: pointer;
  transition: transform .15s ease, box-shadow .15s ease, border-color .15s ease;
}

.index-action-card:hover,
.index-action-card:focus-visible {
  transform: translateY(-2px);
  box-shadow: 0 12px 24px rgba(168,0,0,.12);
  border-color: rgba(168,0,0,.28);
  outline: none;
}

.index-action-icon {
  width: 44px;
  height: 44px;
  min-width: 44px;
  border-radius: 14px;
  background: #fff5f5;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 1.35rem;
}

.index-action-icon-img {
  display: block;
  width: 28px;
  height: 28px;
  object-fit: contain;
}

.index-action-card strong {
  display: block;
  font-size: 1rem;
}

.index-action-card small {
  display: block;
  margin-top: .15rem;
  color: #666;
  font-size: .82rem;
  line-height: 1.25;
}

.index-dashboard-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
  justify-content: stretch;
  gap: 0;
  margin: 0;
}

.index-page .index-dashboard-grid .index-info-card {
  position: relative;
  min-height: 0;
  box-sizing: border-box;
  padding: 0.2rem 1.15rem;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

.index-page .index-dashboard-grid .index-info-card::before {
  content: "";
  position: absolute;
  top: 0.25rem;
  bottom: 0.25rem;
  left: auto;
  right: 0;
  width: 1px;
  border-radius: 999px;
  background: rgba(0,0,0,0.12);
}

.index-page .index-dashboard-grid .index-info-card:last-child::before {
  display: none;
}

.index-page .index-dashboard-grid .index-info-card:first-child {
  padding-left: 0;
}

.index-page .index-dashboard-grid .index-info-card:last-child {
  padding-right: 0;
}

.index-info-label {
  display: block;
  margin-bottom: .35rem;
  color: #666;
  font-size: .85rem;
  font-weight: 700;
}

.index-info-card strong {
  display: block;
  color: #a80000;
  font-size: 1.35rem;
  font-weight: 900;
  line-height: 1.15;
}

.index-info-card strong.amount--ok {
  color: #187a2f;
}

.index-info-card strong.amount--danger {
  color: #a80000;
}

.index-info-card strong.amount--warn {
  color: #a85f00;
}

.index-other-debt-inline {
  display: inline-block;
  margin-left: .18rem;
  color: #a80000;
  font-size: .78em;
  font-weight: 800;
  white-space: nowrap;
}

.index-info-card p {
  margin: .35rem 0 0;
  color: #666;
}

.index-meal-name-with-icon {
  display: inline-flex;
  align-items: center;
  gap: 0.28rem;
  min-width: 0;
}

.index-meal-name-with-icon img {
  display: block;
  width: 1rem;
  height: 1rem;
  object-fit: contain;
}

.index-meal-name-separator {
  color: #aaa;
}

.meal-option-title {
  display: inline-flex;
  align-items: center;
  gap: 0.32rem;
}

.meal-option-title-vegetarian {
  display: block;
  width: 1rem;
  height: 1rem;
  flex: 0 0 auto;
  object-fit: contain;
}

.index-info-card form {
  margin-top: .75rem;
}

.index-meal-stack {
  display: grid;
  gap: 1rem;
}

.index-info-card--disabled {
  opacity: .55;
  filter: grayscale(.25);
}

.index-action-card--disabled {
  opacity: .62;
  background: #f4f4f4;
  filter: grayscale(1);
  cursor: help;
}

.index-action-card--disabled:hover {
  transform: none;
  box-shadow: none;
  border-color: rgba(0,0,0,.12);
}

.index-action-card--disabled:focus-visible {
  transform: none;
  border-color: rgba(0,0,0,.18);
  box-shadow: 0 0 0 3px rgba(0,0,0,.08);
}

.index-action-card--disabled .index-action-icon {
  background: #e5e5e5;
}

.index-action-card--disabled .index-action-icon-img {
  filter: grayscale(1);
  opacity: .58;
}

.index-info-card--disabled strong {
  color: #777;
}

.index-info-card-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .75rem;
  margin-bottom: .35rem;
}

.index-info-card-head .index-info-label {
  margin-bottom: 0;
}

.index-info-badge-link {
  border: 0;
  font-family: inherit;
  line-height: 1.2;
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 0.13em;
  white-space: nowrap;
  cursor: pointer;
  appearance: none;
  -webkit-appearance: none;
}

.index-info-badge-link:hover,
.index-info-badge-link:focus-visible {
  background: #ffdada;
  color: #8f0000;
  outline: none;
}

@media (max-width: 600px) {
  .index-page .index-action-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .65rem;
  }

  .index-page .index-action-card {
    flex-direction: row;
    justify-content: flex-start;
    min-height: 64px;
    padding: .55rem .7rem;
    gap: .55rem;
    text-align: left;
  }

  .index-page .index-action-card small {
    display: none;
  }

  .index-page .index-action-card strong {
    font-size: .95rem;
    line-height: 1.15;
  }

  .index-page .index-dashboard-grid {
    grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
    gap: 0;
  }

  .index-page .index-dashboard-grid .index-info-card {
    width: 100%;
    padding: 0.75rem 0;
  }

  .index-page .index-dashboard-grid .index-info-card::before {
    display: none;
  }

  .index-page .index-dashboard-grid .index-info-card:last-child::before {
    display: none;
  }

  .index-page .index-dashboard-grid .index-info-card + .index-info-card::before,
  .index-page .index-dashboard-grid .index-info-card + .index-info-card:last-child::before {
    content: "";
    display: block;
    position: absolute;
    top: 0;
    bottom: auto;
    left: 0;
    right: auto;
    width: 72px;
    height: 1px;
    margin: 0;
    border-radius: 999px;
    background: rgba(0,0,0,0.12);
  }
}

.index-page .breakfast-list {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: .85rem;
}

.index-hero-subtitle strong.amount--ok {
  color: #187a2f;
}

.index-hero-subtitle strong.amount--warn {
  color: #a85f00;
}

.index-hero-subtitle strong.amount--danger {
  color: #a80000;
}
/* INDEX.PHP ENDE */

/* SHOP.PHP */
.shop-admin-field {
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
  margin-top: 0.2rem;
}

.shop-admin-field span {
  color: #555;
  font-size: 0.86rem;
  font-weight: 800;
}

.shop-admin-field .input-control {
  width: 100%;
  max-width: none;
  font-size: 0.95rem;
  text-align: left;
}

.shop-cart-card-item__main {
  min-width: 0;
  flex: 1 1 auto;
}

.shop-cart-card-item__title {
  font-size: 0.95rem;
  font-weight: 700;
  color: #222;
  line-height: 1.35;
}

.shop-cart-card-item__price {
  margin-top: 0.18rem;
  color: #555;
  font-size: 0.84rem;
  font-weight: 800;
  line-height: 1.3;
}

.shop-card-form {
  display: block;
}

.shop-item-button {
  position: relative;
  width: 100%;
  background: #fff;
  border: 1px solid rgba(0,0,0,.08);
  border-radius: 16px;
  padding: 1rem;
  display: flex;
  align-items: center;
  gap: 0.9rem;
  text-align: left;
  cursor: pointer;
  box-shadow: 0 8px 18px rgba(0,0,0,.06);
  transition: transform .15s ease, box-shadow .15s ease, border-color .15s ease;
  appearance: none;
  -webkit-appearance: none;
  box-sizing: border-box;
}

.shop-item-button:hover,
.shop-item-button:focus-visible {
  transform: translateY(-2px);
  border-color: rgba(168,0,0,.2);
  box-shadow: 0 12px 22px rgba(0,0,0,.10);
  outline: none;
}

.shop-item-image-wrap,
.shop-item-icon {
  width: 52px;
  height: 52px;
  min-width: 52px;
  border-radius: 14px;
  background: linear-gradient(135deg, #ffe5e5, #fff3f3);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}

.shop-item-image {
  max-width: 100%;
  height: auto;
  display: block;
  margin: 0 auto;
}

@supports (object-fit: contain) {
  .shop-item-image {
    width: 100%;
    height: 100%;
    object-fit: contain;
  }
}

.shop-item-icon {
  color: #a80000;
  font-size: 30px;
  line-height: 1;
}

.shop-item-content {
  display: flex;
  flex-direction: column;
  gap: 0.2rem;
  min-width: 0;
  flex: 1 1 auto;
}

.shop-item-name {
  font-size: 1rem;
  font-weight: 700;
  color: #222;
  white-space: normal;
  word-break: break-word;
}

.shop-item-price {
  font-size: 0.95rem;
  color: #666;
  font-weight: 600;
}

/* Flaches Shop-Layout mit seitlichem Desktop-Warenkorb */
.shop-page .shop-hero-copy {
  width: 100%;
  text-align: center;
}

.shop-page > .shop-lage-section {
  padding-bottom: 0.35rem;
}

.shop-page > .shop-lage-section ~ .shop-order-section {
  padding-top: 0.75rem;
}

.shop-section-head {
  align-items: flex-end;
  margin-bottom: 0;
}

.shop-section-heading {
  min-width: 0;
}

.shop-section-subtitle {
  margin: 0.25rem 0 0;
  color: #666;
  font-size: 0.92rem;
  font-weight: 600;
  line-height: 1.35;
}

.shop-lage-invitation {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  gap: 1rem;
  padding: 0.15rem 0;
}

.shop-lage-invitation__icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 3rem;
  height: 3rem;
  border-radius: 999px;
  background: rgba(168, 0, 0, 0.09);
  color: #a80000;
  font-size: 1.55rem;
}

.shop-lage-invitation.has-free-booking .shop-lage-invitation__icon {
  background: rgba(24, 122, 47, 0.12);
  color: #187a2f;
}

.shop-lage-invitation__copy {
  min-width: 0;
}

.shop-lage-invitation__eyebrow {
  margin-bottom: 0.12rem;
  color: #a80000;
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.06em;
  line-height: 1.2;
  text-transform: uppercase;
}

.shop-lage-invitation.has-free-booking .shop-lage-invitation__eyebrow {
  color: #187a2f;
}

.shop-lage-invitation__copy h2 {
  margin: 0;
  color: #222;
  font-size: 1.13rem;
  line-height: 1.25;
  text-align: left;
}

.shop-lage-invitation__copy p {
  margin: 0.2rem 0 0;
  color: #5f6368;
  font-size: 0.91rem;
  line-height: 1.4;
}

.shop-lage-opt-in-form {
  margin: 0.65rem 0 0;
}

.shop-lage-opt-in {
  display: inline-flex;
  align-items: center;
  gap: 0.55rem;
  min-height: 1.75rem;
  padding: 0;
  box-sizing: border-box;
  border: 0;
  background: transparent;
  color: #25492e;
  font-size: 0.88rem;
  font-weight: 700;
  line-height: 1.25;
  cursor: pointer;
}

.shop-lage-opt-in:hover {
  color: #187a2f;
}

.shop-lage-opt-in input[type="checkbox"] {
  width: 1.05rem;
  height: 1.05rem;
  margin: 0;
  accent-color: #187a2f;
}

.shop-admin-fields {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
  margin-top: 0.9rem;
}

.shop-order-layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(300px, 340px);
  align-items: stretch;
  gap: 1.35rem;
}

.shop-catalog {
  min-width: 0;
}

.shop-catalog-head {
  margin-bottom: 0;
}

.shop-catalog-head,
.shop-cart-panel__head {
  min-height: 4.2rem;
  padding-bottom: 0.75rem;
  box-sizing: border-box;
  border-bottom: 1px solid rgba(0, 0, 0, 0.09);
}

.shop-page .shop-grid {
  display: grid;
  width: 100%;
  max-width: none;
  margin: 0.85rem 0 0;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.65rem;
}

.shop-page .shop-card-form {
  height: 100%;
}

.shop-page .shop-card-form.has-broetchen-options {
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  border: 1px solid rgba(0, 0, 0, 0.075);
  border-radius: 14px;
  background: #fff;
  box-shadow: 0 5px 13px rgba(0, 0, 0, 0.045);
  transition:
    box-shadow 0.15s ease,
    border-color 0.15s ease;
}

.shop-page .shop-grid.has-broetchen-open {
  align-items: start;
}

.shop-page .shop-grid.has-broetchen-open .shop-card-form {
  height: auto;
}

.shop-page .shop-grid.has-broetchen-open .shop-item-button {
  height: auto;
  min-height: 78px;
}

.shop-page .shop-item-button {
  height: 100%;
  min-height: 78px;
  padding: 0.7rem 0.75rem;
  gap: 0.7rem;
  border: 1px solid rgba(0, 0, 0, 0.075);
  border-radius: 14px;
  background: #fff;
  box-shadow: 0 5px 13px rgba(0, 0, 0, 0.045);
}

.shop-page .shop-item-button.is-frequently-ordered {
  padding-right: 1.9rem;
}

.shop-item-favorite-crown {
  position: absolute;
  z-index: 2;
  top: 0.38rem;
  right: 0.42rem;
  display: inline-flex;
  width: 0.95rem;
  height: 0.95rem;
  align-items: center;
  justify-content: center;
  color: #c58a00;
  pointer-events: none;
}

.shop-item-favorite-crown svg {
  display: block;
  width: 100%;
  height: 100%;
  fill: currentColor;
}

.shop-page .shop-item-button:hover,
.shop-page .shop-item-button:focus-visible {
  transform: translateY(-1px);
  border-color: rgba(168, 0, 0, 0.18);
  background: #fff;
  box-shadow: 0 8px 17px rgba(0, 0, 0, 0.075);
}

.shop-page .shop-card-form.has-broetchen-options:hover,
.shop-page .shop-card-form.has-broetchen-options:focus-within {
  border-color: rgba(168, 0, 0, 0.18);
  box-shadow: 0 8px 17px rgba(0, 0, 0, 0.075);
}

.shop-page .shop-card-form.has-broetchen-options .shop-item-button,
.shop-page .shop-card-form.has-broetchen-options .shop-item-button:hover,
.shop-page .shop-card-form.has-broetchen-options .shop-item-button:focus-visible {
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  transform: none;
}

.shop-page .shop-item-image-wrap,
.shop-page .shop-item-icon {
  width: 48px;
  height: 48px;
  min-width: 48px;
  border-radius: 12px;
}

.shop-page .shop-item-name {
  font-size: 0.94rem;
  line-height: 1.25;
}

.shop-page .shop-item-price {
  font-size: 0.88rem;
}

.shop-broetchen-chooser {
  display: grid;
  grid-template-rows: 0fr;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition:
    grid-template-rows 0.22s ease,
    opacity 0.16s ease,
    margin-top 0.22s ease,
    visibility 0s linear 0.22s;
}

.shop-broetchen-chooser__collapse {
  min-height: 0;
  overflow: hidden;
}

.shop-broetchen-chooser__panel {
  padding: 0.5rem 0.65rem 0.65rem;
  border-top: 1px solid rgba(0, 0, 0, 0.08);
}

.shop-broetchen-chooser__label {
  display: block;
  margin: 0 0 0.4rem;
  color: #686868;
  font-size: 0.76rem;
  font-weight: 800;
  line-height: 1.2;
}

.shop-broetchen-chooser__options {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(92px, 1fr));
  gap: 0.4rem;
}

.shop-broetchen-choice {
  box-sizing: border-box;
  display: flex;
  align-items: center;
  gap: 0.4rem;
  min-width: 0;
  min-height: 40px;
  padding: 0.3rem 0.45rem;
  border: 1px solid transparent;
  border-radius: 999px;
  background: #f4f5f6;
  color: #222;
  font: inherit;
  font-size: 0.8rem;
  font-weight: 750;
  line-height: 1.2;
  text-align: left;
  cursor: pointer;
}

.shop-broetchen-choice:hover,
.shop-broetchen-choice:focus-visible {
  border-color: rgba(168, 0, 0, 0.3);
  background: #fff3f3;
  color: #a80000;
  outline: none;
}

.shop-broetchen-choice__image {
  width: 30px;
  height: 30px;
  flex: 0 0 30px;
  object-fit: contain;
}

.shop-broetchen-choice__copy {
  min-width: 0;
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  align-items: flex-start;
  gap: 0.05rem;
}

.shop-broetchen-choice__copy > span {
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.shop-broetchen-choice__price {
  color: #667085;
  font-size: 0.7rem;
  font-weight: 650;
  white-space: nowrap;
}

.shop-broetchen-choice:hover .shop-broetchen-choice__price,
.shop-broetchen-choice:focus-visible .shop-broetchen-choice__price {
  color: inherit;
}

.shop-card-form.is-broetchen-open .shop-broetchen-chooser {
  grid-template-rows: 1fr;
  margin-top: 0;
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transition:
    grid-template-rows 0.22s ease,
    opacity 0.16s ease,
    margin-top 0.22s ease,
    visibility 0s linear 0s;
}

@keyframes shop-broetchen-nudge {
  0%,
  100% {
    transform: translateX(0);
  }

  22% {
    transform: translateX(-5px);
  }

  48% {
    transform: translateX(4px);
  }

  72% {
    transform: translateX(-2px);
  }
}

.shop-broetchen-chooser__options.is-nudging {
  animation: shop-broetchen-nudge 0.36s ease;
}

.shop-cart-column {
  position: relative;
  min-width: 0;
  align-self: stretch;
  padding: 0 0 0 1.35rem;
  box-sizing: border-box;
  border-left: 1px solid rgba(0, 0, 0, 0.08);
}

.shop-cart-panel {
  position: sticky;
  top: calc(var(--admin-header-offset, 58px) + 1rem);
  box-sizing: border-box;
  width: 100%;
  overflow: visible;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

.shop-cart-panel__head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.75rem;
  margin-bottom: 0;
}

.shop-catalog-head h2,
.shop-cart-panel__head h2 {
  margin: 0;
  color: #222;
  font-size: 1.1rem;
  font-weight: 800;
  line-height: 1.2;
  text-align: left;
}

.shop-cart-panel__count {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 2rem;
  height: 2rem;
  padding: 0 0.5rem;
  box-sizing: border-box;
  border-radius: 999px;
  background: #fff2f2;
  color: #a80000;
  font-size: 0.88rem;
  font-weight: 800;
}

.shop-cart-card-list {
  display: flex;
  flex-direction: column;
  gap: 0;
  margin-top: 0.85rem;
}

.shop-cart-card-list.is-scrollable {
  max-height: 13.5rem;
  overflow-x: hidden;
  overflow-y: auto;
  padding-right: 0.4rem;
  scrollbar-color: rgba(168, 0, 0, 0.35) transparent;
  scrollbar-width: thin;
}

.shop-cart-card-list.is-scrollable::-webkit-scrollbar {
  width: 5px;
}

.shop-cart-card-list.is-scrollable::-webkit-scrollbar-thumb {
  border-radius: 999px;
  background: rgba(168, 0, 0, 0.35);
}

.shop-cart-card-list.is-scrollable::-webkit-scrollbar-track {
  background: transparent;
}

.shop-cart-card-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  padding: 0.75rem 0;
  border: 0;
  border-bottom: 1px solid rgba(0, 0, 0, 0.08);
  border-radius: 0;
  background: transparent;
}

.shop-cart-card-item:first-child {
  padding-top: 0;
}

.shop-cart-card-item:last-child {
  padding-bottom: 0;
  border-bottom: 0;
}

.shop-cart-card-item__action .btn-admin {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2rem;
  min-width: 2rem;
  height: 2rem;
  padding: 0;
  border-radius: 999px;
  font-size: 1rem;
}

.shop-cart-remove-icon {
  font-size: 1.05rem;
  line-height: 1;
}

.shop-cart-remove-text {
  display: none;
}

.shop-flat-booking-notice {
  display: flex;
  align-items: flex-start;
  gap: 0.4rem;
  margin-top: 0.8rem;
  padding-left: 0.55rem;
  border-left: 3px solid rgba(168, 0, 0, 0.45);
  color: #66524a;
  font-size: 0.78rem;
  font-weight: 600;
  line-height: 1.35;
}

.shop-flat-booking-notice > .material-symbols-outlined {
  flex: 0 0 auto;
  margin-top: 0.02rem;
  color: #a80000;
  font-size: 1rem;
}

.shop-flat-booking-notice strong {
  color: #3b302c;
  font-weight: 800;
  white-space: nowrap;
}

.shop-cart-summary {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 1rem;
  margin-top: 0.9rem;
  padding: 0.75rem 0 0;
  border-top: 1px solid rgba(0, 0, 0, 0.09);
  color: #555;
  font-size: 0.86rem;
  font-weight: 700;
}

.shop-cart-summary strong {
  color: #222;
  font-size: 1rem;
  white-space: nowrap;
}

.shop-cart-card-order-form {
  margin: 1rem 0 0;
  text-align: center;
}

.shop-cart-card-order-form .btn-admin {
  width: 100%;
}

.shop-cart-panel__empty {
  display: grid;
  gap: 0.25rem;
  margin-top: 0.85rem;
  padding: 0.5rem 0 0.2rem;
  color: #666;
  font-size: 0.9rem;
  line-height: 1.4;
}

.shop-cart-panel__empty strong {
  color: #333;
  font-size: 0.98rem;
}

.shop-mobile-cart-toggle,
.shop-mobile-cart-backdrop {
  display: none;
}

.shop-cart-fly-item {
  position: fixed !important;
  z-index: 1158;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  width: 40px !important;
  min-width: 40px !important;
  height: 40px !important;
  margin: 0 !important;
  border-radius: 11px !important;
  background: #fff2f2;
  box-shadow: 0 7px 16px rgba(0, 0, 0, 0.16);
  overflow: hidden;
  pointer-events: none;
  will-change: transform, opacity;
}

.shop-cart-fly-item.shop-item-icon {
  color: #a80000;
  font-size: 25px !important;
}

.shop-cart-fly-item .shop-item-image {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.shop-cart-confetti-piece {
  position: fixed;
  z-index: 1159;
  width: 4px;
  height: 7px;
  border-radius: 2px;
  pointer-events: none;
  will-change: transform, opacity;
}

@keyframes shop-mobile-cart-hit {
  0%,
  100% {
    transform: translateX(-50%) scale(1);
  }
  45% {
    transform: translateX(-50%) scale(1.08);
  }
  72% {
    transform: translateX(-50%) scale(0.98);
  }
}

@media (max-width: 900px) {
  .shop-page {
    width: 100%;
    max-width: 100%;
  }

  .shop-order-layout {
    grid-template-columns: minmax(0, 1fr);
    gap: 1.1rem;
  }

  .shop-cart-column {
    padding: 1.1rem 0 0;
    border-top: 1px solid rgba(0, 0, 0, 0.08);
    border-left: 0;
  }

  .shop-cart-panel {
    position: static;
    max-height: none;
  }
}

@media (max-width: 1100px) and (min-width: 901px) {
  .shop-page .shop-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 640px) {
  body.shop-body.is-shop-cart-open {
    overflow: hidden;
  }

  .shop-body .back-fab-wrap {
    display: none;
  }

  .shop-page {
    padding-bottom: calc(4.8rem + env(safe-area-inset-bottom, 0px));
  }

  .shop-section-head {
    align-items: flex-start;
  }

  .shop-admin-fields {
    grid-template-columns: minmax(0, 1fr);
  }

  .shop-page .shop-grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .shop-page .shop-grid.shop-grid--mobile-pairs {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.55rem;
  }

  .shop-page .shop-grid.shop-grid--mobile-pairs.is-mobile-single {
    grid-template-columns: minmax(0, 1fr);
  }

  .shop-page .shop-grid--mobile-pairs .shop-item-button {
    min-height: 76px;
    padding: 0.55rem;
    gap: 0.5rem;
  }

  .shop-page .shop-grid--mobile-pairs .shop-item-image-wrap,
  .shop-page .shop-grid--mobile-pairs .shop-item-icon {
    width: 40px;
    height: 40px;
    min-width: 40px;
    border-radius: 10px;
  }

  .shop-page .shop-grid--mobile-pairs .shop-item-icon {
    font-size: 25px;
  }

  .shop-page .shop-grid--mobile-pairs .shop-item-name {
    font-size: 0.84rem;
    line-height: 1.2;
  }

  .shop-page .shop-grid--mobile-pairs .shop-item-price {
    font-size: 0.8rem;
  }

  .shop-page .shop-grid--mobile-pairs.is-mobile-single .shop-item-button {
    min-height: 78px;
    padding: 0.7rem 0.75rem;
    gap: 0.7rem;
  }

  .shop-page .shop-grid--mobile-pairs.is-mobile-single .shop-item-image-wrap,
  .shop-page .shop-grid--mobile-pairs.is-mobile-single .shop-item-icon {
    width: 48px;
    height: 48px;
    min-width: 48px;
    border-radius: 12px;
  }

  .shop-page .shop-grid--mobile-pairs.is-mobile-single .shop-item-icon {
    font-size: 30px;
  }

  .shop-page .shop-grid--mobile-pairs.is-mobile-single .shop-item-name {
    font-size: 0.94rem;
    line-height: 1.25;
  }

  .shop-page .shop-grid--mobile-pairs.is-mobile-single .shop-item-price {
    font-size: 0.88rem;
  }

  .shop-lage-invitation {
    display: block;
  }

  .shop-lage-invitation__icon {
    display: none;
  }

  .shop-cart-column {
    position: fixed;
    z-index: 1150;
    right: 0.75rem;
    bottom: calc(4.5rem + env(safe-area-inset-bottom, 0px));
    left: 0.75rem;
    max-height: min(72vh, 34rem);
    max-height: min(72svh, 34rem);
    overflow-x: hidden;
    overflow-y: auto;
    padding: 1rem;
    border: 1px solid rgba(0, 0, 0, 0.1);
    border-radius: 18px;
    background: #fff;
    box-shadow: 0 16px 38px rgba(0, 0, 0, 0.22);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transform: translateY(calc(100% + 5.5rem));
    transition:
      opacity 0.18s ease,
      visibility 0s linear 0.18s,
      transform 0.22s ease;
  }

  .shop-body.is-shop-cart-open .shop-cart-column {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: translateY(var(--knt-bottom-sheet-drag-y, 0px));
    transition:
      opacity 0.18s ease,
      visibility 0s linear 0s,
      transform 0.22s ease;
  }

  .shop-mobile-cart-toggle {
    position: fixed;
    z-index: 1160;
    bottom: calc(0.75rem + env(safe-area-inset-bottom, 0px));
    left: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.55rem;
    min-height: 3rem;
    padding: 0.55rem 0.9rem;
    border: 1px solid rgba(168, 0, 0, 0.24);
    border-radius: 999px;
    background: #fff;
    color: #a80000;
    box-shadow: 0 8px 22px rgba(0, 0, 0, 0.2);
    font: inherit;
    font-size: 0.9rem;
    font-weight: 800;
    white-space: nowrap;
    cursor: pointer;
    transform: translateX(-50%);
  }

  .shop-mobile-cart-toggle .material-symbols-outlined {
    font-size: 1.35rem;
  }

  .shop-mobile-cart-toggle[aria-expanded="true"] {
    border-color: #a80000;
    background: #a80000;
    color: #fff;
  }

  .shop-mobile-cart-toggle.is-cart-hit {
    animation: shop-mobile-cart-hit 0.36s ease;
  }

  .shop-mobile-cart-backdrop {
    position: fixed;
    z-index: 1140;
    inset: 0;
    display: block;
    width: 100%;
    height: 100%;
    padding: 0;
    border: 0;
    background: rgba(0, 0, 0, 0.28);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity 0.18s ease, visibility 0s linear 0.18s;
  }

  .shop-body.is-shop-cart-open .shop-mobile-cart-backdrop {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transition: opacity 0.18s ease, visibility 0s linear 0s;
  }

}

@media (prefers-reduced-motion: reduce) {
  .shop-cart-fly-item,
  .shop-cart-confetti-piece {
    display: none !important;
  }

  .shop-mobile-cart-toggle.is-cart-hit {
    animation: none;
  }
}
/* SHOP.PHP ENDE */

/* ADMIN ITEM LIST */
.item-admin-list {
  display: grid;
  gap: 0.9rem;
}

.item-admin-top-grid {
  align-items: end;
}

.item-admin-top-actions {
  width: 100%;
}

.item-admin-top-buttons {
  display: flex;
  gap: 0.75rem;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
}

.item-admin-top-actions--buttons .item-admin-top-buttons {
  justify-content: flex-start;
  margin-bottom: 0.25rem;
}

.item-admin-top-buttons #resetItemFilter,
.item-admin-top-buttons #resetUserFilter,
.item-admin-top-buttons #resetHistoryFilter {
  justify-content: flex-start;
  text-align: left;
}

.item-admin-top-buttons .button-set-small {
  margin-top: 0;
}

.item-admin-top-actions-label {
  font-weight: 600;
  visibility: hidden;
  height: 1.2rem;
}

.guest-account-actions-row {
  justify-content: flex-end;
}

.guest-account-actions-row .item-admin-top-actions-label {
  display: none;
}

.guest-account-actions-row .item-admin-top-buttons {
  margin-bottom: 0;
}

.guest-account-actions-row .btn-admin {
  min-height: 2.6rem;
}

/* ADMIN ITEM OVERVIEW */
.admin-item-list-head,
.admin-user-list-head {
  align-items: flex-end;
}

.admin-item-list-head > div:first-child,
.admin-user-list-head > div:first-child {
  display: grid;
  gap: 0.16rem;
  min-width: 0;
}

.standard-table-wrap {
  width: 100%;
  box-sizing: border-box;
  overflow: hidden;
  border: 1px solid rgba(0, 0, 0, 0.12);
  border-radius: 12px;
  background: #fff;
}

.standard-table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  table-layout: auto;
  color: #222;
  font-size: 0.95rem;
}

.standard-table th,
.standard-table td {
  min-width: 0;
  box-sizing: border-box;
  vertical-align: middle;
}

.standard-table thead {
  background: #f7f7f8;
}

.standard-table thead th,
.standard-table thead td {
  padding: 0.58rem 0.65rem;
  border: 0;
  border-bottom: 1px solid rgba(0, 0, 0, 0.1);
  background: #f7f7f8;
  color: #6b7280;
  font-size: 0.72rem;
  font-weight: 800;
  line-height: 1.2;
  letter-spacing: 0.045em;
  text-transform: uppercase;
}

.standard-table tr > :first-child {
  text-align: left;
}

.standard-table tr > :not(:first-child) {
  text-align: center;
}

.standard-table tbody td {
  padding: 0.9rem 0.65rem;
  border: 0;
  border-bottom: 1px solid rgba(0, 0, 0, 0.08);
}

.standard-table tbody tr:last-child > td,
.standard-table tbody tr:last-child > th {
  border-bottom: 0;
}

.standard-table tr[hidden] {
  display: none !important;
}

.standard-table-section-row > th,
.standard-table-section-row > td {
  padding: 0.48rem 0.65rem;
  border: 0;
  border-bottom: 1px solid rgba(0, 0, 0, 0.08);
  background: #fff7f7;
  color: #a80000;
  font-size: 0.76rem;
  font-weight: 800;
  line-height: 1.25;
  letter-spacing: 0.035em;
  text-align: left !important;
  text-transform: uppercase;
}

.standard-table-row--accented > td:first-child {
  position: relative;
  padding-left: 0.9rem;
}

.standard-table-row--accented > td:first-child::before {
  content: "";
  position: absolute;
  top: 0.55rem;
  bottom: 0.55rem;
  left: 0;
  width: 4px;
  border-radius: 0 999px 999px 0;
  background: var(--standard-table-row-accent);
  opacity: 0.58;
}

.standard-table-sort-button {
  display: inline-flex;
  align-items: center;
  justify-content: flex-start;
  gap: 0.28rem;
  min-width: 0;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  color: inherit;
  font: inherit;
  letter-spacing: inherit;
  text-align: inherit;
  text-transform: inherit;
  cursor: pointer;
}

.standard-table-sort-button--end {
  justify-content: center;
}

.standard-table th:not(:first-child) .standard-table-sort-button {
  width: 100%;
  justify-content: center;
}

.standard-table-sort-button:hover,
.standard-table-sort-button.is-active {
  color: #a80000;
}

.standard-table-sort-button:focus-visible {
  border-radius: 4px;
  outline: 2px solid rgba(168, 0, 0, 0.28);
  outline-offset: 3px;
}

.standard-table-sort-arrow {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  width: 0.68rem;
  height: 0.68rem;
  overflow: hidden;
  color: currentColor;
  font-family: inherit;
  font-size: 0.56rem;
  font-weight: 700;
  line-height: 1;
  letter-spacing: 0;
}

@media (min-width: 851px) {
  .standard-table-wrap--scroll {
    overflow: hidden;
  }

  .standard-table-wrap--scroll .standard-table.standard-table--measuring,
  .standard-table-wrap--scroll .standard-table.standard-table--synced {
    display: block;
  }

  .standard-table-wrap--scroll .standard-table.standard-table--measuring > thead,
  .standard-table-wrap--scroll .standard-table.standard-table--synced > thead {
    display: block;
    box-sizing: border-box;
    width: 100%;
    padding-right: var(--standard-table-scrollbar-width, 0px);
    background: #f7f7f8;
  }

  .standard-table-wrap--scroll .standard-table.standard-table--measuring > tbody,
  .standard-table-wrap--scroll .standard-table.standard-table--synced > tbody {
    display: block;
    max-height: calc(56vh - 2.1rem);
    overflow-y: auto;
    overflow-x: hidden;
    overscroll-behavior-y: contain;
    scrollbar-color: rgba(168, 0, 0, 0.34) transparent;
    scrollbar-width: thin;
    -webkit-overflow-scrolling: touch;
  }

  .standard-table-wrap--scroll .standard-table.standard-table--measuring > thead > tr,
  .standard-table-wrap--scroll .standard-table.standard-table--measuring > tbody > tr,
  .standard-table-wrap--scroll .standard-table.standard-table--synced > thead > tr,
  .standard-table-wrap--scroll .standard-table.standard-table--synced > tbody > tr {
    display: grid;
    grid-template-columns: var(--standard-table-columns);
    align-items: stretch;
    width: 100%;
    box-sizing: border-box;
  }

  .standard-table-wrap--scroll .standard-table.standard-table--measuring > thead > tr > *,
  .standard-table-wrap--scroll .standard-table.standard-table--measuring > tbody > tr > *,
  .standard-table-wrap--scroll .standard-table.standard-table--synced > thead > tr > *,
  .standard-table-wrap--scroll .standard-table.standard-table--synced > tbody > tr > * {
    display: flex;
    align-items: center;
    justify-content: center;
    width: auto !important;
  }

  .standard-table-wrap--scroll .standard-table.standard-table--measuring > thead > tr > :first-child,
  .standard-table-wrap--scroll .standard-table.standard-table--measuring > tbody > tr > :first-child,
  .standard-table-wrap--scroll .standard-table.standard-table--synced > thead > tr > :first-child,
  .standard-table-wrap--scroll .standard-table.standard-table--synced > tbody > tr > :first-child {
    justify-content: flex-start;
  }

  .standard-table-wrap--scroll .standard-table .standard-table-section-row > *,
  .standard-table-wrap--scroll .standard-table tr > [colspan] {
    grid-column: 1 / -1;
  }
}

.standard-table-wrap--scroll .standard-table tbody::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}

@media (max-width: 850px) {
  .standard-table-wrap--scroll {
    overflow-x: auto;
    overflow-y: hidden;
    overscroll-behavior-x: contain;
    touch-action: pan-x pan-y;
    -webkit-overflow-scrolling: touch;
  }

  .standard-table-wrap--scroll .standard-table {
    min-width: 100%;
  }
}

.admin-item-list-section .admin-item-filter-form,
.admin-user-list-section .admin-user-filter-form {
  margin-bottom: 0;
}

.admin-overview-list-divider {
  box-sizing: content-box;
  width: 72px;
  height: 2px;
  margin: 0 auto 1.15rem;
  padding-top: 1.35rem;
  border-radius: 999px;
  background: rgba(168, 0, 0, 0.28);
  background-clip: content-box;
}

.admin-item-row-main-content {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  min-width: 0;
}

.admin-item-row-visual {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 52px;
  width: 52px;
  height: 52px;
  border-radius: 14px;
  background: linear-gradient(135deg, #ffe5e5, #fff3f3);
  overflow: hidden;
}

.admin-item-row-visual img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  box-sizing: border-box;
}

.admin-item-row-visual .material-symbols-outlined {
  color: #a80000;
  font-size: 27px;
  line-height: 1;
}

.admin-item-row-visual img[hidden],
.admin-item-row-visual-fallback[hidden] {
  display: none !important;
}

.standard-table-primary {
  display: grid;
  gap: 0.08rem;
  min-width: 0;
}

.admin-lage-row-title h3,
.standard-table-primary h3 {
  min-width: 0;
  margin: 0;
  color: #222;
  font-size: 1.02rem;
  font-weight: 800;
  line-height: 1.3;
  text-align: left;
  overflow-wrap: anywhere;
}

.standard-table-subtitle {
  color: #6b7280;
  font-size: 0.8rem;
  font-weight: 650;
  line-height: 1.25;
  overflow-wrap: anywhere;
}

.standard-table-item {
  display: flex;
  align-items: center;
  gap: 0.7rem;
  min-width: 0;
}

.standard-table-item-visual {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 44px;
  width: 44px;
  height: 44px;
  overflow: hidden;
  border-radius: 12px;
  background: linear-gradient(135deg, #ffe5e5, #fff3f3);
  color: #a80000;
}

.standard-table-item-visual img {
  width: 100%;
  height: 100%;
  box-sizing: border-box;
  object-fit: contain;
}

.standard-table-item-visual .material-symbols-outlined {
  font-size: 24px;
  line-height: 1;
}

.standard-table-item-visual img[hidden],
.standard-table-item-visual-fallback[hidden] {
  display: none !important;
}

.admin-item-col-action,
.admin-item-row-actions {
  padding-right: 0.3rem !important;
  padding-left: 0.3rem !important;
}

.admin-item-row-price {
  color: #666;
  font-size: 0.78rem;
  text-align: center;
  white-space: nowrap;
}

.admin-item-row-price > strong {
  display: block;
}

.admin-item-row-price > span {
  display: none;
}

.admin-item-row-price strong {
  color: #a80000;
  font-size: 0.98rem;
  font-weight: 800;
}

.admin-item-row-actions {
  text-align: center;
}

.admin-edit-symbol {
  font-size: 20px;
  line-height: 1;
}

.admin-item-row-edit-icon {
  display: inline-flex;
}

@media (max-width: 640px) {
  .admin-item-list-head,
  .admin-user-list-head {
    align-items: flex-start;
    flex-direction: row;
    gap: 0.5rem;
  }

  .admin-item-list-head > div:first-child,
  .admin-user-list-head > div:first-child {
    flex: 1 1 auto;
  }

  .admin-item-list-head-actions,
  .admin-user-list-head-actions {
    width: auto;
    flex: 0 0 auto;
    justify-content: flex-end;
    align-self: flex-start;
  }

  .admin-item-list-head-actions .btn-admin,
  .admin-user-list-head-actions .btn-admin {
    white-space: nowrap;
  }

  .admin-item-table-head .admin-item-col-action {
    font-size: 0;
  }

}

/* ADMIN ITEM ENDE */

/* ADMIN-USER */
.admin-user-row-main {
  min-width: 0;
}

.admin-user-row-scope--kasse {
  display: flex;
  align-items: baseline;
  gap: 0.15rem 0;
  flex-wrap: wrap;
  font-weight: 400;
}

.admin-user-row-scope--kasse strong {
  font-weight: 800;
  white-space: nowrap;
}

.admin-user-row-scope--kasse > span + span::before {
  content: "·";
  display: inline-block;
  margin: 0 0.35rem;
  color: #9ca3af;
  font-weight: 800;
}

.admin-user-row-scope--kasse.is-wrapped {
  flex-direction: column;
  align-items: flex-start;
  gap: 0.08rem;
}

.admin-user-row-scope--kasse.is-wrapped > span + span::before {
  display: none;
  margin: 0;
}

.admin-user-row-balance {
  min-width: 0;
  text-align: center;
  white-space: nowrap;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.08rem;
}

.admin-user-row-balance-label,
.admin-user-row-balance .user-amount-text {
  display: block;
}

.admin-user-row-balance-label {
  color: #666;
  font-size: 0.78rem;
  line-height: 1.2;
}

.admin-user-row-actions {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  min-width: 0;
}

.admin-user-row-actions-cell {
  text-align: center;
}

.admin-user-row-actions-toggle {
  display: none;
}

.admin-user-row-form {
  display: inline-flex;
  margin: 0;
}

.admin-user-row-actions .btn-admin {
  white-space: nowrap;
}

.admin-user-row-edit-button {
  width: 42px;
  min-width: 42px;
  padding-right: 0;
  padding-left: 0;
}

.admin-user-export-form {
  width: 100%;
}

.admin-user-export-grid {
  grid-template-columns: minmax(220px, 1fr) minmax(320px, auto);
  gap: 1rem;
  align-items: end;
}

.admin-user-export-actions {
  justify-content: flex-end;
}

.admin-user-export-actions .item-admin-top-actions-label {
  display: none;
}

.admin-user-export-actions .item-admin-top-buttons {
  justify-content: flex-end;
  margin-bottom: 0;
}

@media (max-width: 720px) {
  .admin-user-export-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 640px) {
  .admin-user-table {
    display: block;
    table-layout: auto;
  }

  .admin-user-table thead,
  .admin-user-table tbody {
    display: block;
  }

  .admin-user-table thead tr,
  .admin-user-table tbody tr {
    width: 100%;
    box-sizing: border-box;
  }

  .admin-user-table thead tr,
  .admin-user-table tbody tr {
    display: grid;
    grid-template-columns: minmax(0, 1fr) max-content 34px;
    gap: 0;
  }

  .admin-user-table thead tr {
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
    background: #f7f7f8;
  }

  .admin-user-table thead th,
  .admin-user-table tbody td {
    display: block;
    width: auto;
    min-width: 0;
  }

  .admin-user-table thead th {
    border-bottom: 0;
  }

  .admin-user-table thead .admin-user-col-actions {
    font-size: 0;
  }

  .admin-user-row {
    position: relative;
    cursor: pointer;
    border-bottom: 1px solid rgba(0, 0, 0, 0.08);
  }

  .admin-user-table tbody tr:last-child {
    border-bottom: 0;
  }

  .admin-user-table tbody td {
    border-bottom: 0;
  }

  .admin-user-row-actions-cell {
    display: contents !important;
  }

  .admin-user-row-actions-toggle {
    grid-column: 3;
    grid-row: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    align-self: center;
    width: 28px;
    min-width: 28px;
    height: 28px;
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: transparent;
    color: #6b7280;
    cursor: pointer;
  }

  .admin-user-row-actions-toggle:focus-visible {
    outline: 2px solid rgba(168, 0, 0, 0.32);
    outline-offset: 2px;
  }

  .admin-user-row-actions-toggle-icon {
    font-size: 22px;
    line-height: 1;
    transition: transform 160ms ease;
  }

  .admin-user-row.is-actions-open .admin-user-row-actions-toggle-icon {
    transform: rotate(180deg);
  }

  .admin-user-row-actions {
    display: none;
    grid-column: 1 / -1;
    grid-template-columns: repeat(2, max-content) auto;
    justify-content: end;
    gap: 0.45rem;
    margin: 0;
    padding: 0 0.65rem 0.75rem;
  }

  .admin-user-row.is-actions-open .admin-user-row-actions {
    display: grid;
  }

  .admin-user-row--kasse .admin-user-row-actions {
    grid-template-columns: repeat(2, max-content);
  }

  .admin-user-row-edit-button {
    width: 40px;
    min-width: 40px;
    height: 40px;
    padding: 0;
    border-radius: 12px;
  }
}

.admin-user-pay-dialog {
  text-align: left;
}

.admin-user-pay-dialog > * + * {
  margin-top: 0.85rem;
}

.admin-user-pay-target {
  border: 1px solid rgba(0,0,0,0.08);
  border-radius: 12px;
  background: #f7f7f8;
  padding: 0.75rem 0.85rem;
}

.admin-user-pay-target-label {
  display: block;
  margin-bottom: 0.2rem;
  color: #666;
  font-size: 0.82rem;
  font-weight: 600;
  text-transform: uppercase;
}

.admin-user-pay-target strong {
  font-weight: 600;
}

.admin-user-pay-switch {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.4rem;
}

.admin-user-pay-mode {
  flex: 0 1 auto;
  min-width: 0;
  padding: 0.48rem 0.72rem;
  border: 1px solid rgba(0, 0, 0, 0.12);
  border-radius: 999px;
  background: #fff;
  color: #666;
  cursor: pointer;
  font: inherit;
  font-size: 0.84rem;
  font-weight: 700;
  line-height: 1.2;
}

.admin-user-pay-mode.is-active {
  border-color: rgba(168, 0, 0, 0.22);
  background: rgba(168, 0, 0, 0.07);
  color: #a80000;
}

.admin-user-pay-locked {
  border: 1px solid rgba(168,0,0,0.18);
  border-radius: 12px;
  background: #fff5f5;
  color: #a80000;
  font-weight: 600;
  padding: 0.75rem 0.85rem;
}

.admin-user-pay-field {
  display: block;
  color: #444;
  font-weight: 600;
}

.admin-user-pay-field span {
  display: block;
  margin-bottom: 0.35rem;
}

.admin-user-pay-field .input-control {
  width: 100%;
  max-width: none;
  text-align: left;
}

.admin-user-pay-field textarea.input-control {
  min-height: 5rem;
  resize: vertical;
}

.admin-user-pay-error {
  border: 1px solid rgba(168,0,0,0.25);
  border-radius: 10px;
  background: #fff5f5;
  color: #a80000;
  font-weight: 600;
  padding: 0.65rem 0.75rem;
}

.admin-user-pay-info {
  border: 1px solid #fde68a;
  border-radius: 10px;
  background: #fffbeb;
  color: #92400e;
  font-weight: 600;
  line-height: 1.35;
  padding: 0.65rem 0.75rem;
  text-align: left;
}

body.is-admin-user-pay-sheet-open {
  overflow: hidden;
}

.admin-user-pay-sheet-backdrop {
  position: fixed;
  z-index: 99998;
  inset: 0;
  display: block;
  background: rgba(0, 0, 0, 0.42);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity 0.18s ease, visibility 0s linear 0.18s;
}

.admin-user-pay-sheet-backdrop.is-open,
.index-cart-sheet-backdrop.is-open {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transition-delay: 0s;
}

.admin-user-pay-sheet {
  position: fixed;
  z-index: 99999;
  bottom: 0;
  left: 50%;
  display: grid;
  grid-template-rows: auto auto minmax(0, 1fr) auto;
  width: min(720px, calc(100% - 2rem));
  max-height: min(88vh, 700px);
  max-height: min(88dvh, 700px);
  box-sizing: border-box;
  padding: 0.38rem 1rem calc(0.85rem + env(safe-area-inset-bottom, 0px));
  border: 1px solid rgba(0, 0, 0, 0.1);
  border-bottom: 0;
  border-radius: 22px 22px 0 0;
  background: #fff;
  box-shadow: 0 -16px 40px rgba(0, 0, 0, 0.22);
  opacity: 0;
  visibility: hidden;
  transform: translate(-50%, 104%);
  transition:
    opacity 0.18s ease,
    visibility 0s linear 0.24s,
    transform 0.24s ease;
}

.admin-user-pay-sheet.is-open {
  opacity: 1;
  visibility: visible;
  transform: translate(-50%, var(--knt-bottom-sheet-drag-y, 0px));
  transition-delay: 0s;
}

.admin-user-pay-sheet-handle,
.admin-meals-breakfast-sheet-handle {
  width: 2.75rem;
  height: 0.28rem;
  margin: 0 auto 0.3rem;
  border-radius: 999px;
  background: #d1d1d1;
}

.admin-user-pay-sheet-head,
.admin-meals-breakfast-sheet-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: 0.2rem 0 0.7rem;
  border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}

.admin-user-pay-sheet-head > div {
  min-width: 0;
}

.admin-user-pay-sheet-head span {
  display: block;
  margin-bottom: 0.08rem;
  color: #a80000;
  font-size: 0.7rem;
  font-weight: 900;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.admin-user-pay-sheet-head h3 {
  overflow: hidden;
  margin: 0;
  color: #171717;
  font-size: 1.15rem;
  font-weight: 900;
  line-height: 1.2;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.admin-user-pay-sheet-close {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  justify-content: center;
  width: 2.25rem;
  height: 2.25rem;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: #f2f2f2;
  color: #555;
  font: inherit;
  font-size: 1.35rem;
  line-height: 1;
  cursor: pointer;
}

.admin-user-pay-sheet-body {
  min-height: 0;
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
  padding: 0.75rem 0;
}

.admin-user-pay-sheet-actions {
  display: grid;
  grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.2fr);
  gap: 0.55rem;
  padding-top: 0.7rem;
  border-top: 1px solid rgba(0, 0, 0, 0.09);
}

.admin-user-pay-sheet-actions .btn-admin {
  min-width: 0;
}

@media (max-width: 640px) {
  .admin-user-pay-sheet {
    width: 100%;
    border-width: 1px 0 0;
  }
}

@media (prefers-reduced-motion: reduce) {
  .admin-user-pay-sheet,
  .admin-user-pay-sheet-backdrop {
    transition: none;
  }
}

/* ADMIN-USER ENDE */

/* GEMEINSAME ADMIN-STEUERELEMENTE */
.admin-badge,
.item-edit-badge {
  display: inline-flex;
  align-items: center;
  padding: 0.25rem 0.65rem;
  border-radius: 999px;
  background: #ffe8e8;
  color: #a80000;
  font-size: 0.82rem;
  font-weight: 700;
}

.admin-grid {
  display: grid;
  gap: 0.9rem 1rem;
}

.admin-grid--two {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin-bottom: 1rem;
}

.admin-user-assignment-grid > .admin-row,
.admin-user-assignment-grid .input-control {
  min-width: 0;
}

.admin-grid--three {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.user-edit-row,
.admin-row,
.item-edit-row {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 0.4rem;
}

.user-edit-row label,
.admin-row label {
  text-align: left;
  font-weight: 700;
  color: #333;
}

.form-row.user-edit-row input[type="text"],
.form-row.user-edit-row input[type="number"],
.form-row.user-edit-row input[type="password"],
.form-row.user-edit-row input[type="date"],
.form-row.user-edit-row input[type="email"],
.form-row.user-edit-row input[type="tel"],
.form-row.user-edit-row select,
.form-row.user-edit-row textarea,
.form-row.admin-row input[type="text"],
.form-row.admin-row input[type="number"],
.form-row.admin-row input[type="password"],
.form-row.admin-row input[type="date"],
.form-row.admin-row input[type="email"],
.form-row.admin-row input[type="tel"],
.form-row.admin-row select,
.form-row.admin-row textarea {
  text-align: left;
  max-width: 100%;
  background: #fff;
}

.admin-alert {
  border-radius: 14px;
  padding: 0.85rem 1rem;
  font-weight: 600;
  font-size: 0.95rem;
}

.admin-alert--error {
  margin: 1rem 1.25rem 0;
  background: #fff1f1;
  border: 1px solid rgba(168,0,0,0.14);
  color: #a80000;
}

.admin-alert--info {
  background: #fff7e8;
  border: 1px solid rgba(255,184,77,0.35);
  color: #8a5a00;
  text-align: center;
}

.admin-alert--success {
  background: #e8f7ea;
  border: 1px solid rgba(24,122,47,.18);
  color: #187a2f;
  text-align: center;
}

.user-guest-account-hint {
  margin-top: 1rem;
  text-align: left;
}

.user-guest-duration-help {
  margin-bottom: 0;
  line-height: 1.45;
}

.admin-user-edit-flash {
  margin: 1rem 1.25rem 0;
}

.admin-user-autosave-status {
  min-height: 1.25rem;
  margin: 0.3rem 1rem 0;
  color: #666;
  font-size: 0.86rem;
  font-weight: 700;
  text-align: right;
}

.admin-user-autosave-status.is-pending,
.admin-user-autosave-status.is-saving {
  color: #8a5a00;
}

.admin-user-autosave-status.is-saved {
  color: #187a2f;
}

.admin-user-autosave-status.is-error {
  color: #a80000;
}

.admin-current-guest-status {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.8rem;
  margin-bottom: 1rem;
  text-align: left;
}

.admin-current-guest-status > span {
  min-width: 0;
}

.admin-current-guest-edit-button {
  flex: 0 0 auto;
  min-width: 2.35rem;
  padding: 0.45rem 0.6rem;
  line-height: 1;
}

#adminCurrentGuestEditor[hidden] {
  display: none !important;
}

.admin-current-guest-grid {
  margin-bottom: 0;
}

.admin-current-guest-help {
  margin: 0.7rem 0 0;
  line-height: 1.45;
}

.admin-current-guest-actions {
  padding-top: 1rem;
}

.admin-account-delete-area {
  display: flex;
  justify-content: flex-end;
  width: 100%;
  box-sizing: border-box;
  padding: 1.25rem 0 0.25rem;
}

.admin-account-delete-area .admin-alert {
  width: 100%;
  box-sizing: border-box;
}

.admin-account-delete-confirmation {
  display: grid;
  justify-items: end;
  gap: 0.85rem;
  width: 100%;
}

.admin-account-delete-warning {
  display: grid;
  gap: 0.35rem;
  text-align: left;
}

.admin-account-delete-warning strong {
  font-size: 0.98rem;
}

.admin-account-delete-warning span {
  font-weight: 500;
  line-height: 1.45;
}

.admin-account-delete-check {
  display: flex;
  align-items: flex-start;
  gap: 0.65rem;
  width: 100%;
  box-sizing: border-box;
  padding: 0.8rem 0.9rem;
  border: 1px solid rgba(168, 0, 0, 0.16);
  border-radius: 12px;
  background: #fff8f8;
  color: #4b1f1f;
  font-size: 0.9rem;
  font-weight: 650;
  line-height: 1.4;
  cursor: pointer;
}

.admin-account-delete-check input {
  flex: 0 0 auto;
  width: 18px;
  height: 18px;
  margin: 0.08rem 0 0;
  accent-color: #a80000;
}

.admin-user-pair-status {
  min-width: 0;
  color: #444;
  font-weight: 700;
}

.admin-user-pair-status-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  margin-bottom: 0.65rem;
}

.admin-user-pair-list {
  border-top: 1px solid rgba(0,0,0,0.08);
}

.admin-user-pair-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: 0.75rem 0;
  border-bottom: 1px solid rgba(0,0,0,0.08);
}

.admin-user-pair-main {
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
  min-width: 0;
  gap: 0.15rem;
}

.admin-user-pair-main strong {
  color: #222;
  font-weight: 800;
  overflow-wrap: anywhere;
}

.admin-user-pair-main span,
.admin-user-pair-empty,
.admin-user-pair-message {
  color: #666;
  font-size: 0.92rem;
  font-weight: 600;
}

.admin-user-pair-meta {
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  min-width: 0;
}

.admin-user-pair-meta > span + span::before {
  content: "·";
  display: inline-block;
  margin: 0 0.35rem;
  color: #9ca3af;
}

.admin-user-pair-main .admin-user-pair-source {
  color: #4b5563;
  font-weight: 800;
}

.admin-user-pair-empty,
.admin-user-pair-message {
  margin: 0.65rem 0 0;
}

.admin-user-pair-message.is-error {
  color: #a80000;
}

.admin-user-pair-button {
  flex: 0 0 auto;
  white-space: nowrap;
}

.admin-user-pair-unlink {
  flex: 0 0 auto;
  white-space: nowrap;
}

.admin-user-pair-unlink[hidden] {
  display: none !important;
}

.admin-user-pair-mobile-only {
  display: none !important;
}

.admin-user-pair-linked-icon {
  font-size: 1.2rem;
  line-height: 1;
}

.admin-item-edit-page .admin-actions.admin-user-pair-actions {
  justify-content: flex-start;
  margin-right: 0;
  margin-left: 0;
  padding-top: 0.85rem;
}

.admin-actions {
  display: flex;
  justify-content: flex-end;
  gap: 0.75rem;
  padding-top: 0.25rem;
  flex-wrap: wrap;
}

.admin-actions .button-set-small {
  min-width: 140px;
  justify-content: center;
}

.admin-update-detail-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.9rem 1rem;
}

.admin-update-overview {
  margin-bottom: 0.25rem;
}

.admin-update-detail-grid--compact {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.admin-update-value {
  min-height: 42px;
  display: flex;
  align-items: center;
  width: 100%;
  padding: 0.55rem 0.7rem;
  border: 1px solid rgba(0,0,0,0.08);
  background: #fff;
  border-radius: 10px;
  box-sizing: border-box;
  color: #222;
  font-size: 0.95rem;
  font-weight: 700;
  overflow-wrap: anywhere;
}

.admin-update-detail-grid > div,
.admin-update-result,
.admin-update-notice {
  min-width: 0;
}

.admin-update-detail-grid span {
  display: block;
  margin-bottom: 0.25rem;
  color: #666;
  font-size: 0.84rem;
  font-weight: 700;
}

.admin-update-detail-grid strong {
  display: block;
  color: #222;
  font-size: 0.98rem;
  overflow-wrap: anywhere;
}

.admin-update-actions-row {
  margin-top: 0.9rem;
}

.admin-update-actions-row form {
  margin: 0;
}

.admin-update-result,
.admin-update-notice {
  margin-top: 1rem;
  padding-top: 1rem;
  border-top: 1px solid rgba(0,0,0,0.08);
}

.admin-update-notice {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
}

.admin-update-notice--error {
  color: #8f0000;
}

.admin-update-result-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  margin-bottom: 0.75rem;
  flex-wrap: wrap;
}

.admin-update-status {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  width: fit-content;
  max-width: 100%;
  padding: 0.24rem 0.58rem;
  border-radius: 999px;
  font-size: 0.78rem !important;
  font-weight: 800;
  line-height: 1.2;
}

.admin-update-status.is-neutral {
  background: #f1f3f5;
  color: #555;
}

.admin-update-status.is-ok {
  background: #e9f8ef;
  color: #14713a;
}

.admin-update-status.is-warning {
  background: #fff4df;
  color: #965c00;
}

.admin-update-status.is-error {
  background: #fff0f0;
  color: #a80000;
}

.admin-update-message {
  margin: 0.85rem 0 0;
  font-weight: 700;
}

.admin-update-message--error {
  color: #8f0000;
}

.admin-security-form {
  margin: 0;
}

.admin-security-overview {
  display: flex;
  flex-wrap: wrap;
  gap: 0.85rem 1.2rem;
  align-items: flex-start;
}

.admin-security-overview .admin-row {
  flex: 1 1 14rem;
  min-width: 0;
}

.admin-security-lifetime-row {
  display: block;
}

.admin-security-lifetime-row .input-control {
  width: 100%;
  min-width: 9rem;
}

.admin-security-request-box {
  display: grid;
  gap: 0.45rem;
  margin-top: 1rem;
  padding-top: 1rem;
  border-top: 1px solid rgba(0,0,0,0.08);
}

.admin-security-request-box strong {
  color: #222;
}

.admin-security-request-box p {
  margin: 0;
}

.admin-security-qr-image {
  width: min(100%, 180px);
  height: auto;
  display: block;
  margin-top: 1rem;
}

.admin-security-empty {
  margin: 1rem 0 0;
}

.admin-title-with-info {
  display: flex;
  align-items: center;
  gap: 0.45rem;
}

.admin-lage-card-head > div:first-child {
  display: grid;
  gap: 0.16rem;
  min-width: 0;
}

.admin-update-message--warning {
  color: #965c00;
}

.admin-update-changelog {
  margin-top: 0.9rem;
}

.admin-update-changelog ul {
  margin: 0.45rem 0 0;
  padding-left: 1.25rem;
}

.admin-update-changelog li + li {
  margin-top: 0.25rem;
}

@media (max-width: 720px) {
  .admin-grid--two,
  .admin-grid--three {
    grid-template-columns: 1fr;
  }

  .admin-grid--two.admin-user-assignment-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.65rem;
  }

  .admin-user-autosave-status {
    text-align: left;
  }

  .admin-update-overview,
  .admin-update-detail-grid {
    grid-template-columns: 1fr;
  }

  .admin-user-pair-row {
    flex-direction: row;
    align-items: center;
    gap: 0.65rem;
  }

  .admin-user-pair-status-row {
    align-items: center;
    flex-direction: row;
    gap: 0.65rem;
  }

  .admin-user-pair-desktop-only {
    display: none !important;
  }

  .admin-user-pair-mobile-only {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
  }

  .admin-alert--error {
    margin: 1rem 1rem 0;
  }
}

.user-admin-top-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1rem;
  align-items: end;
}

@media (max-width: 900px) {
  .user-admin-top-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 600px) {
  .user-admin-top-grid {
    grid-template-columns: 1fr;
  }
}
/* USER EDIT + GEMEINSAME ADMIN-STEUERELEMENTE ENDE */

/* ADMIN-SETTINGS */
.rule-row { display:flex; align-items:center; gap:.6rem; }
.rule-row-actions { display:flex; gap:.35rem; }

.button-user-container.column-stretch { flex-direction:column; align-items:stretch; max-width:520px; }

.info-pill { padding:.15rem .45rem; line-height:1; border-radius:999px; color:#000; }
.checkbox-lg { transform: scale(1.2); }

.admin-settings-form--with-subtoggle {
  display: flex;
  align-items: center;
  gap: 0.95rem;
  flex-wrap: wrap;
}

.admin-settings-subtoggle {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  margin: 0;
  padding-left: 0.95rem;
  border-left: 1px solid rgba(0,0,0,0.12);
  color: #555;
}

.admin-settings-subtoggle input:disabled + span {
  opacity: 0.55;
}

.time-row{
  display:flex;
  align-items:center;
  gap:.5rem;
  margin:.5rem 0;
  justify-content:center;
  flex-wrap:wrap;
}

.time-label{
  min-width:100px;
  font-weight:600;
  text-align:right;
}

.time-fields{
  display:inline-flex;
  align-items:center;
  gap:.5rem;
  flex-wrap:wrap;
  min-width:0;
}

.time-end-group{
  display:inline-flex;
  align-items:center;
  gap:.5rem;
  min-width:0;
  white-space:nowrap;
}

.time-input{
  width:8rem;
  padding:.35rem .5rem;
  border:1px solid #aaa;
  border-radius:6px;
}

.time-stepper{
  display:inline-flex;
  align-items:stretch;
  gap:0;
  border:1px solid #aaa;
  border-radius:6px;
  overflow:hidden;
  background:#fff;
}

.time-stepper .time-input{
  width:5.8rem;
  border:0;
  border-radius:0;
  text-align:center;
}

.time-stepper-btn{
  width:30px;
  border:0;
  border-radius:0;
  background:#f3f4f6;
  color:#222;
  font-weight:700;
  cursor:pointer;
}

.time-stepper-btn:active{
  background:#e1e5ea;
}

.time-input.is-locked{
  width:118px;
  background:#f2f2f2;
  color:#666;
  border-style:dashed;
  text-align:center;
}

.time-sep{ opacity:.7; }
.time-suffix{ opacity:.7; }

.time-confirm-dialog {
  text-align: left;
}

.time-confirm-intro {
  margin: 0 0 0.75rem;
  color: #555;
}

.time-confirm-list {
  border: 1px solid rgba(0,0,0,0.08);
  border-radius: 10px;
  overflow: hidden;
  background: #fff;
}

.time-confirm-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: 0.7rem 0.8rem;
}

.time-confirm-row + .time-confirm-row {
  border-top: 1px solid rgba(0,0,0,0.07);
}

.time-confirm-row span {
  color: #555;
  font-weight: 600;
}

.time-confirm-row strong {
  color: #a80000;
  white-space: nowrap;
}

.admin-settings-sheet-text {
  margin: 0;
  color: #3f4650;
  font-size: 0.92rem;
  line-height: 1.55;
}

.admin-settings-content-sheet .time-confirm-intro {
  margin-top: 0;
}

@media (max-width: 520px) {
  .time-row{
    justify-content:flex-start;
    align-items:flex-start;
    gap:.35rem;
  }

  .time-label{
    width:100%;
    min-width:0;
    text-align:left;
  }

  .time-fields{
    width:100%;
    justify-content:flex-start;
    gap:.35rem;
  }

  .admin-settings-page .time-fields {
    flex-wrap: nowrap;
  }

  .admin-settings-page .time-end-group {
    flex: 0 0 auto;
    gap: .25rem;
  }

  .admin-settings-page .time-stepper {
    flex: 0 0 auto;
    min-width: 0;
  }

  .admin-settings-page .time-stepper .time-input {
    width: 5rem;
    min-width: 0;
    padding-right: .25rem;
    padding-left: .25rem;
  }

  .admin-settings-page .time-stepper-btn {
    flex: 0 0 26px;
    width: 26px;
  }

  .time-confirm-row {
    gap: .5rem;
    padding-inline: .45rem;
  }

  .time-confirm-row strong {
    font-size: .86rem;
  }
}

@media (max-width: 360px) {
  .admin-settings-page .time-stepper .time-input {
    width: 4.55rem;
  }

  .admin-settings-page .time-stepper-btn {
    flex-basis: 24px;
    width: 24px;
  }

  .admin-settings-page .time-input.is-locked {
    width:108px;
  }
}

.color-wrap {
  display: flex;
  justify-content: center;
}

.admin-rule-panel {
  display: none;
  margin: 0.75rem 0 1rem;
  padding: 1rem 1.1rem;
  border: 1px solid rgba(0, 0, 0, 0.08);
  border-radius: 16px;
  background: #f8f9fb;
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.05);
  width: 100%;
  box-sizing: border-box;
}

.admin-rule-form {
  margin: 0;
  width: 100%;
}

.admin-autosave-status {
  display: inline-flex;
  align-items: center;
  min-height: 2.35rem;
  color: #666;
  font-size: 0.88rem;
  font-weight: 700;
}

.admin-autosave-status.is-saving {
  color: #a85f00;
}

.admin-autosave-status.is-error {
  color: #a80000;
}

.admin-autosave-status.is-saved {
  color: #187a2f;
}

.admin-save-bubble {
  position: fixed;
  z-index: 1200;
  top: calc(env(safe-area-inset-top, 0px) + 5.25rem);
  right: max(1rem, calc((100vw - 1200px) / 2));
  display: flex;
  align-items: center;
  width: max-content;
  max-width: min(420px, calc(100vw - 2rem));
  min-height: 0;
  box-sizing: border-box;
  margin: 0;
  padding: 0.75rem 1rem;
  border: 1px solid rgba(0, 0, 0, 0.12);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.97);
  box-shadow: 0 12px 30px rgba(0, 0, 0, 0.18);
  color: #444;
  font-size: 0.88rem;
  font-weight: 800;
  line-height: 1.35;
  text-align: left;
  pointer-events: none;
  opacity: 0;
  transform: translateY(-0.5rem);
  transition: opacity 180ms ease, transform 180ms ease;
}

.admin-save-bubble[hidden] {
  display: none !important;
}

.admin-save-bubble.is-visible {
  opacity: 1;
  transform: translateY(0);
}

.admin-save-bubble.is-pending,
.admin-save-bubble.is-saving {
  border-color: rgba(168, 95, 0, 0.3);
  background: rgba(255, 248, 232, 0.98);
  color: #8a5a00;
}

.admin-save-bubble.is-saved {
  border-color: rgba(24, 122, 47, 0.28);
  background: rgba(237, 250, 240, 0.98);
  color: #187a2f;
}

.admin-save-bubble.is-error {
  border-color: rgba(168, 0, 0, 0.28);
  background: rgba(255, 239, 239, 0.98);
  color: #a80000;
}

@media (max-width: 640px) {
  .admin-save-bubble {
    top: calc(env(safe-area-inset-top, 0px) + 4.65rem);
    right: auto;
    left: 50%;
    max-width: calc(100vw - 1.5rem);
    transform: translate(-50%, -0.5rem);
  }

  .admin-save-bubble.is-visible {
    transform: translate(-50%, 0);
  }
}

.admin-rule-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr)) 120px;
  gap: 1rem;
  width: 100%;
  margin-bottom: 1rem;
}

.admin-rule-grid select,
.admin-rule-grid .input-control,
.admin-rule-grid input[type="text"],
.admin-rule-grid input[type="number"] {
  width: 100%;
  min-width: 0;
}

.admin-rule-grid > * {
  min-width: 0;
  box-sizing: border-box;
}

.admin-rule-grid .form-row {
  min-width: 0rem;
  width: auto;
  max-width: 100%;
  margin: 0;
  box-sizing: border-box;
}

.admin-rule-grid label {
  display: block;
  margin-bottom: 0.45rem;
}

.admin-rule-color-row {
  width: 120px;
  min-width: 120px;
  max-width: 120px;
  justify-self: start;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

.admin-rule-color-row .color-wrap {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  width: 100%;
  min-height: 44px;
}

.admin-rule-panel .color-input {
  width: 96px;
  min-width: 96px;
  max-width: 96px;
  height: 44px;
  border-radius: 12px;
  border: 1px solid rgba(0, 0, 0, 0.12);
  background: #fff;
  box-sizing: border-box;
}

@media (max-width: 860px) {
  .admin-rule-grid {
    grid-template-columns: repeat(2, minmax(180px, 1fr));
  }

  .admin-rule-color-row {
    grid-column: 1 / -1;
  }
}

@media (max-width: 640px) {
  .admin-rule-grid {
    grid-template-columns: 1fr;
  }

  .admin-rule-grid select,
  .admin-rule-grid .input-control,
  .admin-rule-grid input[type="text"],
  .admin-rule-grid input[type="number"] {
    width: 100%;
    min-width: 0;
  }

  .admin-rule-color-row {
    grid-column: auto;
  }
}
/* ADMIN-SETTINGS ENDE */

/* ADMIN_PURCHASE.PHP */
.admin-purchase-section-head {
  align-items: flex-end;
}

.admin-purchase-section-head > div:first-child {
  display: grid;
  gap: 0.16rem;
  min-width: 0;
}

.admin-purchase-section-head .muted {
  display: block;
  line-height: 1.4;
}

.admin-purchase-form,
.admin-purchase-grid,
.admin-purchase-field-group {
  box-sizing: border-box;
}

.admin-purchase-form {
  margin: 0;
}

.admin-purchase-grid {
  align-items: start;
}

.admin-purchase-field-group {
  display: flex;
  flex-direction: column;
  gap: 0.85rem;
  min-width: 0;
}

.admin-purchase-field-group .admin-row {
  margin: 0;
  min-width: 0;
}

.admin-purchase-field-group .input-control {
  width: 100%;
  max-width: 100%;
  min-width: 0;
  text-align: left !important;
}

.admin-purchase-form input.input-control,
.admin-purchase-form select.input-control,
.admin-purchase-form textarea.input-control {
  text-align: left !important;
  text-align-last: left;
}

.admin-purchase-form input.input-control::placeholder {
  text-align: left;
}

.admin-purchase-field-group--booking .admin-row:first-child .input-control {
  min-height: 0;
  font-size: inherit;
  font-weight: inherit;
}

.admin-purchase-field-group--booking .admin-row:first-child .input-control::placeholder {
  font-size: 1rem;
  font-weight: 500;
}

.admin-purchase-section .admin-actions {
  margin-top: 1rem;
  justify-content: flex-end;
}

/* ADMIN-AUSWERTUNG ANFANG */
.admin-evaluation-content {
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
  transition: opacity 0.16s ease;
}

.admin-evaluation-content.is-loading {
  opacity: 0.55;
  pointer-events: none;
}

.admin-evaluation-section-head {
  align-items: flex-end;
  flex-wrap: wrap;
}

.admin-evaluation-section-head > div:first-child,
.admin-meals-section-head > div:first-child {
  display: grid;
  flex: 1 1 280px;
  gap: 0.16rem;
  min-width: 0;
}

.admin-evaluation-mode-nav,
.monitor-view-nav {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 0.5rem;
  width: 100%;
  margin: 0 auto 1rem;
}

.eval-tab {
  flex: 0 0 auto;
}

.admin-evaluation-filter-form,
.admin-evaluation-export-form {
  width: 100%;
  margin: 0;
}

.admin-evaluation-date-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.65rem;
  margin-bottom: 0;
}

.admin-evaluation-date-grid > .admin-row,
.admin-evaluation-date-grid .input-control {
  min-width: 0;
}

.admin-evaluation-page .form-row,
.admin-evaluation-page .input-control,
.admin-evaluation-page .btn-admin,
.admin-evaluation-page .admin-eval-empty {
  box-sizing: border-box;
  max-width: 100%;
}

.admin-eval-actions {
  justify-content: flex-start;
  padding-top: 0;
}

.admin-eval-pdf-types {
  margin-top: 0;
}

.admin-eval-pdf-type-list {
  display: flex;
  flex-wrap: wrap;
  gap: 0.55rem;
}

.admin-eval-pdf-type-option {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  padding: 0.45rem 0.65rem;
  border: 1px solid rgba(132, 42, 42, 0.22);
  border-radius: 8px;
  background: #fff7f7;
  color: #334155;
  font-size: 0.9rem;
  font-weight: 700;
}

.admin-eval-pdf-type-option input {
  accent-color: #842a2a;
}

.admin-eval-empty {
  padding: 0.85rem 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: #666;
  font-weight: 600;
  text-align: left;
}

.admin-eval-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 1.25rem;
  width: 100%;
  max-width: none;
  margin: 0;
  box-sizing: border-box;
}

.admin-eval-col {
  display: flex;
  flex-direction: column;
  min-width: 0;
}

@media (min-width: 900px) {
  .admin-eval-grid--with-need {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    width: 100%;
    align-items: flex-start;
  }

  .admin-eval-grid--with-need > .admin-evaluation-result-block + .admin-evaluation-result-block {
    padding-left: 1.25rem;
    border-left: 1px solid rgba(0, 0, 0, 0.09);
  }
}

.admin-evaluation-page .admin-evaluation-table-wrap {
  width: 100%;
  max-width: 100%;
  margin: 0;
  box-sizing: border-box;
}

.admin-evaluation-page .admin-evaluation-table {
  min-width: 0;
}

.admin-evaluation-page .admin-evaluation-table th:not(:first-child),
.admin-evaluation-page .admin-evaluation-table td:not(:first-child),
.admin-evaluation-page .admin-evaluation-need-table th:not(:first-child),
.admin-evaluation-page .admin-evaluation-need-table td:not(:first-child) {
  text-align: center;
}

.admin-evaluation-page .admin-evaluation-table th,
.admin-evaluation-page .admin-evaluation-table td,
.admin-evaluation-page .admin-evaluation-need-table th,
.admin-evaluation-page .admin-evaluation-need-table td {
  word-wrap: break-word;
  overflow-wrap: anywhere;
  word-break: normal;
}

.admin-evaluation-need-row--broetchen td:first-child {
  font-weight: 700;
}

.admin-eval-value-with-trend {
  display: inline-flex;
  align-items: baseline;
  justify-content: center;
  gap: 0.35rem;
  white-space: nowrap;
}

.admin-eval-trend {
  display: inline;
  font-size: 0.74rem;
  font-weight: 800;
  line-height: 1;
  white-space: nowrap;
}

.admin-eval-trend--up {
  color: #15803d;
}

.admin-eval-trend--down {
  color: #b91c1c;
}

.admin-eval-trend--neutral {
  color: #64748b;
}

.admin-evaluation-export-form {
  display: grid;
  grid-template-columns: minmax(220px, 0.8fr) minmax(0, 1.2fr);
  align-items: end;
  gap: 0.85rem 1rem;
}

.admin-evaluation-export-form .admin-eval-actions {
  grid-column: 1 / -1;
}

.admin-evaluation-add-section .admin-actions {
  justify-content: flex-start;
  padding-top: 0;
}

@media (max-width: 720px) {
  .admin-grid--two.admin-evaluation-date-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .admin-evaluation-section-head .muted {
    display: none;
  }

  .admin-evaluation-export-form {
    grid-template-columns: minmax(0, 1fr);
  }

  .admin-evaluation-export-form .admin-eval-actions {
    grid-column: auto;
  }

  .admin-eval-grid--with-need > .admin-evaluation-result-block + .admin-evaluation-result-block {
    padding-top: 1.15rem;
    border-top: 1px solid rgba(0, 0, 0, 0.09);
  }
}
/* ADMIN-AUSWERTUNG ENDE */

/* ADMIN COOKBOOK */
.admin-cookbook-page .admin-cookbook-section-head {
  align-items: flex-end;
  margin-bottom: 1rem;
}

.admin-cookbook-section-head > div {
  min-width: 0;
}

.admin-cookbook-page .admin-cookbook-section-head h2 {
  font-size: 1.15rem;
}

.admin-cookbook-section > .admin-alert {
  margin: 0 0 1rem;
}

.cookbook-layout {
  display: grid;
  grid-template-columns: minmax(250px, 280px) minmax(0, 1fr);
  gap: 1.25rem;
  align-items: start;
}

.cookbook-index,
.cookbook-editor {
  min-width: 0;
}

.cookbook-editor {
  transition: opacity .15s ease;
}

.cookbook-layout.is-loading .cookbook-editor {
  opacity: .45;
  pointer-events: none;
}

.cookbook-layout.is-loading .cookbook-item-list,
[data-cookbook-navigation].is-loading {
  pointer-events: none;
}

.cookbook-index {
  position: sticky;
  top: calc(var(--admin-header-offset) + 1rem);
  overflow: visible;
  padding-right: 1.25rem;
  border-right: 1px solid rgba(0, 0, 0, .09);
  background: transparent;
}

.cookbook-index-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  margin: 0;
  padding: 0 0 .72rem;
}

.admin-cookbook-page .cookbook-index-head h3,
.admin-cookbook-page .cookbook-editor-head h3 {
  margin: 0;
  color: #222;
  text-align: left;
  font-size: 1rem;
  font-weight: 850;
}

.cookbook-index-search {
  position: relative;
  padding: 0 0 .8rem;
}

.cookbook-index-search > .material-symbols-outlined {
  position: absolute;
  z-index: 1;
  top: 50%;
  left: .55rem;
  color: #777;
  font-size: 1.05rem;
  transform: translateY(-50%);
  pointer-events: none;
}

.cookbook-index-search .input-control {
  width: 100%;
  min-height: 36px;
  box-sizing: border-box;
  padding: .42rem .65rem .42rem 2rem;
  font-size: .82rem;
}

.cookbook-item-list {
  display: grid;
  max-height: min(58vh, 540px);
  overflow-x: hidden;
  overflow-y: auto;
  border-top: 1px solid rgba(0, 0, 0, .08);
  border-bottom: 1px solid rgba(0, 0, 0, .08);
  overscroll-behavior: contain;
  scrollbar-width: thin;
  scrollbar-color: rgba(168, 0, 0, .3) transparent;
}

.cookbook-item-list::-webkit-scrollbar {
  width: 5px;
}

.cookbook-item-list::-webkit-scrollbar-track {
  background: transparent;
}

.cookbook-item-list::-webkit-scrollbar-thumb {
  border-radius: 999px;
  background: rgba(168, 0, 0, .28);
}

.cookbook-item-link {
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr);
  align-items: center;
  gap: .58rem;
  min-width: 0;
  padding: .56rem .15rem;
  border-bottom: 1px solid rgba(0, 0, 0, .06);
  background: transparent;
  color: #222;
  text-decoration: none;
  transition: background .14s ease, box-shadow .14s ease;
}

.cookbook-item-link:last-child {
  border-bottom: 0;
}

.cookbook-item-link:hover,
.cookbook-item-link:focus-visible,
.cookbook-item-link.is-active {
  background: #fff5f5;
  outline: none;
}

.cookbook-item-link.is-active {
  box-shadow: inset 3px 0 0 #a80000;
}

.cookbook-item-visual {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  overflow: hidden;
  border-radius: 9px;
  background: #fff4f4;
}

.cookbook-item-visual img {
  display: block;
  width: 27px;
  height: 27px;
  object-fit: contain;
}

.cookbook-item-visual .material-symbols-outlined {
  color: #a80000;
  font-size: 1.25rem;
}

.cookbook-item-content {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: .5rem;
  min-width: 0;
}

.cookbook-item-content strong {
  min-width: 0;
  overflow: hidden;
  font-size: .84rem;
  font-weight: 800;
  line-height: 1.2;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.cookbook-item-state {
  flex: 0 0 auto;
  margin: 0;
  color: #777;
  font-size: .68rem;
  font-weight: 750;
  line-height: 1;
  white-space: nowrap;
}

.cookbook-item-state--individual {
  color: #a80000;
}

.cookbook-item-state--standard {
  color: #0f766e;
}

.cookbook-item-empty {
  margin: 0;
  padding: .9rem .75rem;
  color: #666;
  text-align: center;
  font-size: .82rem;
}

.cookbook-item-empty[hidden] {
  display: none;
}

.cookbook-editor-head {
  display: flex;
  align-items: center;
  gap: 0.85rem;
  margin-bottom: 1rem;
  padding-bottom: .9rem;
  border-bottom: 1px solid rgba(0, 0, 0, .08);
}

.cookbook-editor-head p {
  margin: .22rem 0 0;
  color: #666;
  font-size: .86rem;
  font-weight: 650;
}

.cookbook-selected-visual {
  flex: 0 0 58px;
  width: 58px;
  height: 58px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 14px;
  background: #fff7f7;
  border: 1px solid rgba(168, 0, 0, .12);
}

.cookbook-selected-visual img {
  max-width: 50px;
  max-height: 50px;
  object-fit: contain;
}

.cookbook-selected-visual .material-symbols-outlined {
  color: #a80000;
  font-size: 32px;
}

.cookbook-form {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.cookbook-textarea {
  min-height: 180px;
  resize: vertical;
}

.cookbook-textarea--small {
  min-height: 92px;
}

.cookbook-ingredients-list {
  display: flex;
  flex-direction: column;
  gap: 0.55rem;
  max-height: 180px;
  overflow-x: hidden;
  overflow-y: auto;
  padding-right: .35rem;
  overscroll-behavior: contain;
  scrollbar-width: thin;
  scrollbar-color: rgba(168, 0, 0, .3) transparent;
}

.cookbook-ingredients-list::-webkit-scrollbar {
  width: 5px;
}

.cookbook-ingredients-list::-webkit-scrollbar-track {
  background: transparent;
}

.cookbook-ingredients-list::-webkit-scrollbar-thumb {
  border-radius: 999px;
  background: rgba(168, 0, 0, .28);
}

.cookbook-ingredient-input[readonly] {
  background: #fff;
  color: #222;
  opacity: 1;
  cursor: default;
}

.admin-cookbook-page .admin-actions {
  justify-content: flex-end;
}

.cookbook-bottom-nav {
  display: none;
}

@media (max-width: 900px) {
  .cookbook-layout {
    grid-template-columns: 1fr;
    gap: 1rem;
  }

  .cookbook-index {
    position: static;
    padding-right: 0;
    border-right: 0;
  }

  .cookbook-item-list {
    max-height: 260px;
  }
}

@media (max-width: 640px) {
  .admin-cookbook-body {
    --cookbook-bottom-nav-height: 62px;
  }

  .admin-cookbook-body.has-cookbook-bottom-nav .site-offset {
    padding-bottom: 126px;
    padding-bottom: calc(
      var(--admin-bottom-nav-height)
      + var(--cookbook-bottom-nav-height)
    );
    padding-bottom: calc(
      var(--admin-bottom-nav-height)
      + var(--cookbook-bottom-nav-height)
      + constant(safe-area-inset-bottom)
    );
    padding-bottom: calc(
      var(--admin-bottom-nav-height)
      + var(--cookbook-bottom-nav-height)
      + env(safe-area-inset-bottom, 0px)
    );
    padding-bottom: calc(
      var(--admin-bottom-nav-rendered-height)
      + var(--cookbook-bottom-nav-height)
    );
  }

  .admin-cookbook-section-head p {
    display: none;
  }

  .cookbook-layout {
    display: block;
  }

  .cookbook-index {
    display: none;
  }

  .cookbook-bottom-nav {
    position: fixed;
    top: auto !important;
    right: 0;
    bottom: 64px !important;
    bottom: var(--admin-bottom-nav-height) !important;
    bottom: calc(var(--admin-bottom-nav-height) + constant(safe-area-inset-bottom)) !important;
    bottom: calc(var(--admin-bottom-nav-height) + env(safe-area-inset-bottom, 0px)) !important;
    bottom: var(--admin-bottom-nav-rendered-height) !important;
    left: 0;
    z-index: 1094;
    display: flex;
    align-items: stretch;
    gap: 0;
    width: 100%;
    max-width: 100%;
    height: var(--cookbook-bottom-nav-height);
    overflow-x: auto;
    overflow-y: hidden;
    margin: 0;
    padding: 0;
    border: 0;
    border-top: 1px solid rgba(0, 0, 0, .08);
    border-bottom: 1px solid rgba(0, 0, 0, .06);
    background: rgba(255, 255, 255, .98);
    box-shadow: 0 -5px 16px rgba(0, 0, 0, .07);
    box-sizing: border-box;
    white-space: nowrap;
    overscroll-behavior-x: contain;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    will-change: transform;
    isolation: isolate;
  }

  html.ios-device .cookbook-bottom-nav {
    position: fixed !important;
    top: auto !important;
    right: 0 !important;
    bottom: 64px !important;
    bottom: var(--admin-bottom-nav-height) !important;
    bottom: calc(var(--admin-bottom-nav-height) + constant(safe-area-inset-bottom)) !important;
    bottom: calc(var(--admin-bottom-nav-height) + env(safe-area-inset-bottom, 0px)) !important;
    bottom: var(--admin-bottom-nav-rendered-height) !important;
    left: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    -webkit-overflow-scrolling: auto;
  }

  .cookbook-bottom-nav::-webkit-scrollbar {
    display: none;
  }

  .cookbook-bottom-nav-link {
    position: relative;
    display: inline-flex;
    flex: 0 0 58px;
    align-items: center;
    justify-content: center;
    min-width: 58px;
    height: 100%;
    padding: .4rem .5rem;
    border: 0;
    border-radius: 0;
    background: transparent;
    color: #222;
    box-shadow: none;
    text-decoration: none;
    box-sizing: border-box;
    -webkit-tap-highlight-color: transparent;
    transition: background .15s ease, box-shadow .15s ease;
  }

  .cookbook-bottom-nav-link:hover,
  .cookbook-bottom-nav-link:focus-visible,
  .cookbook-bottom-nav-link.is-active {
    background: #fff5f5;
    outline: none;
  }

  .cookbook-bottom-nav-link.is-active {
    box-shadow: inset 0 3px 0 #a80000;
  }

  .cookbook-bottom-nav-visual {
    position: relative;
    display: inline-flex;
    flex: 0 0 42px;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    overflow: hidden;
    border-radius: 11px;
    background: #fff4f4;
  }

  .cookbook-bottom-nav-visual img {
    display: block;
    width: 36px;
    height: 36px;
    object-fit: contain;
  }

  .cookbook-bottom-nav-visual .material-symbols-outlined {
    color: #a80000;
    font-size: 1.45rem;
  }

  .cookbook-bottom-nav-link[data-recipe-state="individual"] .cookbook-bottom-nav-visual::after,
  .cookbook-bottom-nav-link[data-recipe-state="standard"] .cookbook-bottom-nav-visual::after,
  .cookbook-bottom-nav-link[data-recipe-state="empty"] .cookbook-bottom-nav-visual::after {
    content: "";
    position: absolute;
    right: 3px;
    bottom: 3px;
    width: 7px;
    height: 7px;
    border: 2px solid #fff;
    border-radius: 50%;
    box-sizing: content-box;
  }

  .cookbook-bottom-nav-link[data-recipe-state="individual"] .cookbook-bottom-nav-visual::after {
    background: #a80000;
  }

  .cookbook-bottom-nav-link[data-recipe-state="standard"] .cookbook-bottom-nav-visual::after {
    background: #0f766e;
  }

  .cookbook-bottom-nav-link[data-recipe-state="empty"] .cookbook-bottom-nav-visual::after {
    background: #9ca3af;
  }

  .cookbook-editor-head {
    gap: .7rem;
  }

  .cookbook-selected-visual {
    flex-basis: 50px;
    width: 50px;
    height: 50px;
  }

  .cookbook-selected-visual img {
    max-width: 43px;
    max-height: 43px;
  }

}
/* ADMIN COOKBOOK ENDE */

/* ADMIN ITEM EDIT */
.admin-item-autocomplete {
  position: relative;
  width: 100%;
}

.admin-item-suggestion-list {
  position: absolute;
  z-index: 80;
  top: calc(100% + 0.45rem);
  left: 0;
  right: 0;
  max-height: 360px;
  overflow-x: hidden;
  overflow-y: auto;
  padding: 0.4rem;
  border: 1px solid rgba(0,0,0,0.12);
  border-radius: 14px;
  background: #fff;
  box-shadow: 0 18px 42px rgba(0,0,0,0.16);
  overscroll-behavior: contain;
}

.admin-item-suggestion-list[hidden] {
  display: none !important;
}

.admin-item-suggestion-option {
  width: 100%;
  min-height: 58px;
  padding: 0.55rem 0.65rem;
  border: 0;
  border-radius: 11px;
  background: transparent;
  color: #222;
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr) auto;
  align-items: center;
  gap: 0.7rem;
  font: inherit;
  text-align: left;
  cursor: pointer;
}

.admin-item-suggestion-option.has-no-preview {
  grid-template-columns: minmax(0, 1fr) auto;
}

.admin-item-suggestion-option + .admin-item-suggestion-option {
  margin-top: 0.15rem;
}

.admin-item-suggestion-option:hover,
.admin-item-suggestion-option:focus-visible,
.admin-item-suggestion-option.is-active {
  background: #fff3f3;
  outline: none;
}

.admin-item-suggestion-preview {
  width: 42px;
  height: 42px;
  border-radius: 12px;
  background: #fff0f0;
  color: #a80000;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}

.admin-item-suggestion-preview img {
  width: 34px;
  height: 34px;
  display: block;
  object-fit: contain;
}

.admin-item-suggestion-preview .material-symbols-outlined {
  font-size: 1.35rem;
}

.admin-item-suggestion-content {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 0.28rem;
}

.admin-item-suggestion-content strong {
  overflow: hidden;
  color: #222;
  font-size: 0.96rem;
  line-height: 1.2;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.admin-item-suggestion-meta {
  display: flex;
  align-items: center;
  gap: 0.35rem;
  flex-wrap: wrap;
}

.admin-item-suggestion-category,
.admin-item-suggestion-deleted {
  display: inline-flex;
  align-items: center;
  min-height: 20px;
  padding: 0.12rem 0.45rem;
  border-radius: 999px;
  font-size: 0.74rem;
  font-weight: 750;
  line-height: 1.1;
}

.admin-item-suggestion-category {
  background: #f1f2f4;
  color: #555;
}

.admin-item-suggestion-deleted {
  background: #fff0d9;
  color: #965500;
}

.admin-item-suggestion-price {
  color: #333;
  font-size: 0.9rem;
  font-weight: 800;
  white-space: nowrap;
}

.admin-item-name-feedback {
  display: block;
  width: 100%;
  box-sizing: border-box;
  padding: 0.45rem 0 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  font-size: 0.84rem;
  font-weight: 700;
  line-height: 1.35;
  text-align: left;
  text-decoration: none;
}

.admin-item-name-feedback[hidden] {
  display: none !important;
}

.admin-item-name-feedback.is-duplicate {
  color: #a80000;
}

.admin-item-name-feedback.is-reactivate {
  color: #805000;
}

.form-row.admin-row #item_name.is-invalid {
  border-color: #b00020;
  box-shadow: 0 0 0 3px rgba(176,0,32,0.12);
}

.form-row.admin-row #item_name.is-reactivate {
  border-color: #b36a00;
  box-shadow: 0 0 0 3px rgba(179,106,0,0.12);
}

.admin-item-needs-section {
  background: linear-gradient(180deg, #fff 0%, #fff9f9 100%);
  border-color: rgba(168,0,0,0.08);
}

.admin-item-needs-grid {
  margin-top: 1rem;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 0.85rem;
}

.admin-item-need-field {
  border: 1px solid rgba(0,0,0,0.06);
  border-radius: 14px;
  background: #fff;
  padding: 0.85rem;
  display: flex;
  flex-direction: column;
  gap: 0.45rem;
  box-shadow: 0 4px 10px rgba(0,0,0,0.03);
}

.admin-item-need-field label {
  font-size: 0.92rem;
  font-weight: 700;
  color: #444;
  text-align: left;
}

.admin-item-need-field .input-control,
.admin-item-need-field input,
.admin-item-need-field select,
.admin-item-need-field textarea {
  max-width: 100%;
  text-align: left;
  background: #fff;
}

.admin-item-subsection {
  border-top: 1px solid rgba(0,0,0,0.06);
  padding-top: 1rem;
  margin-top: 1rem;
}

.admin-item-subsection:first-of-type {
  border-top: 0;
  padding-top: 0;
  margin-top: 0;
}

.admin-item-subsection-head {
  margin-bottom: 0.8rem;
}

.admin-item-subsection-head h4 {
  margin: 0;
  font-size: 0.98rem;
  font-weight: 800;
  color: #555;
  text-align: left;
}

.item-edit-grid {
  display: grid;
  gap: 0.9rem 1rem;
}

.item-edit-row label {
  text-align: left;
  font-weight: 700;
  color: #333;
}

.item-edit-row .input-control,
.item-edit-row input,
.item-edit-row select,
.form-row.item-edit-row input[type="text"],
.form-row.item-edit-row input[type="number"],
.form-row.item-edit-row input[type="password"],
.form-row.item-edit-row input[type="date"],
.form-row.item-edit-row input[type="email"],
.form-row.item-edit-row input[type="tel"],
.form-row.item-edit-row select,
.form-row.item-edit-row textarea {
  max-width: 100%;
  text-align: left;
  background: #fff;
}

@media (max-width: 640px) {
  .admin-item-suggestion-list {
    max-height: min(55vh, 360px);
  }

  .admin-item-suggestion-option {
    grid-template-columns: 38px minmax(0, 1fr) auto;
    gap: 0.55rem;
    padding: 0.5rem;
  }

  .admin-item-suggestion-option.has-no-preview {
    grid-template-columns: minmax(0, 1fr) auto;
  }

  .admin-item-suggestion-preview {
    width: 38px;
    height: 38px;
    border-radius: 11px;
  }

  .admin-item-suggestion-preview img {
    width: 31px;
    height: 31px;
  }

  .admin-item-needs-section {
    padding: 0.9rem;
  }

  .admin-item-subsection {
    background: #fff;
    border: 1px solid rgba(0,0,0,0.06);
    border-radius: 14px;
    padding: 0.9rem;
    margin-top: 0.9rem;
  }

  .admin-item-subsection:first-of-type {
    margin-top: 0;
  }

  .admin-item-subsection-head {
    margin-bottom: 0.7rem;
    padding-bottom: 0.45rem;
    border-bottom: 1px solid rgba(0,0,0,0.06);
  }

}

/* Flaches Layout analog zur Historie: Hero und Bereiche ohne Kartenrahmen. */
.admin-item-edit-hero-copy {
  min-width: 0;
}

.admin-item-edit-hero-copy h1 {
  min-width: 0;
  overflow-wrap: anywhere;
}

.admin-item-edit-form {
  --index-section-divider-spacing: 0.95rem;
  width: 100%;
  display: flex;
  flex-direction: column;
  box-sizing: border-box;
}

.admin-item-edit-section-head {
  margin-bottom: 1rem;
}

.admin-item-general-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  align-items: start;
  gap: 0.9rem 1rem;
}

.admin-settings-broetchen-list {
  width: 100%;
  margin-top: 0.25rem;
  align-self: flex-start;
  box-sizing: border-box;
}

.admin-settings-broetchen-list-head,
.admin-settings-broetchen-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 128px 112px;
  align-items: center;
  gap: 0.75rem;
}

.admin-settings-broetchen-list-head {
  padding: 0.2rem 0 0.45rem;
  border-bottom: 1px solid #e4e7ec;
  color: #667085;
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.admin-settings-broetchen-list-head span:last-child {
  text-align: center;
}

.admin-settings-broetchen-row {
  min-height: 3.5rem;
  padding: 0.45rem 0;
  border-bottom: 1px solid #e4e7ec;
}

.admin-settings-broetchen-row + .admin-settings-broetchen-row {
  margin-top: 0;
}

.admin-settings-broetchen-row--new {
  margin-top: 0.35rem !important;
  border-bottom: 0;
}

.admin-settings-broetchen-toggle,
.admin-settings-broetchen-new-type {
  display: flex;
  align-items: center;
  gap: 0.7rem;
  min-width: 0;
}

.admin-settings-broetchen-toggle {
  color: #202124;
  font-size: 1rem;
  font-weight: 800;
  cursor: pointer;
}

.admin-settings-broetchen-toggle .checkbox-lg {
  flex: 0 0 auto;
}

.admin-settings-broetchen-new-type .input-control {
  width: 100%;
  max-width: none;
  min-width: 0;
}

.admin-settings-broetchen-price {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 0.35rem;
  min-width: 0;
}

.admin-settings-money-prefix,
.admin-settings-money-currency {
  font-size: 0.86rem;
  font-weight: 800;
}

.admin-settings-money-prefix {
  color: #a80000;
}

.admin-settings-money-currency {
  color: #667085;
}

.admin-settings-broetchen-price .input-control {
  width: 100%;
  min-width: 0;
  max-width: none;
  box-sizing: border-box;
}

.admin-settings-broetchen-add-button {
  width: 100%;
  white-space: nowrap;
}

.admin-meals-breakfast-add.admin-settings-broetchen-add-button-mobile {
  display: none;
}

.admin-item-broetchen-surcharges {
  margin-top: 1rem;
  padding-top: 0.9rem;
  border-top: 1px solid rgba(0, 0, 0, 0.07);
}

.admin-item-broetchen-surcharges-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 0.75rem;
  margin-bottom: 0.7rem;
}

.admin-item-broetchen-surcharges-head h5,
.admin-item-broetchen-surcharges-head small {
  margin: 0;
}

.admin-item-broetchen-surcharges-head small {
  color: #667085;
  font-weight: 500;
}

.admin-item-broetchen-surcharge-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.75rem;
}

.admin-item-broetchen-surcharge-grid .admin-row {
  min-width: 0;
  width: 100%;
  align-items: stretch;
}

.admin-item-broetchen-surcharge-grid .input-control {
  width: 100%;
  max-width: none;
  box-sizing: border-box;
}

.admin-item-meal-variant-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: stretch;
  gap: 1rem;
}

.admin-item-meal-variant-grid--single {
  grid-template-columns: minmax(0, 1fr);
}

.admin-item-meal-variant-card {
  min-width: 0;
  margin: 0;
  padding: 1rem;
  border: 1px solid rgba(0, 0, 0, 0.09);
  border-radius: 14px;
  background: #fff;
  box-sizing: border-box;
}

.admin-item-meal-variant-card legend {
  padding: 0 0.35rem;
  color: #222;
  font-size: 1rem;
  font-weight: 800;
}

.admin-item-meal-variant-card .admin-row + .admin-row {
  margin-top: 0.85rem;
}

.admin-item-meal-variant-card .input-control {
  width: 100%;
  min-width: 0;
  box-sizing: border-box;
}

.admin-item-general-grid .admin-row,
.admin-item-general-grid .input-control,
.admin-item-edit-page .admin-item-need-field,
.admin-item-edit-page .admin-item-need-field .input-control {
  min-width: 0;
  width: 100%;
  box-sizing: border-box;
}

.admin-item-edit-page .admin-item-needs-section,
.admin-item-edit-page .admin-item-subsection,
.admin-item-edit-page .admin-item-need-field {
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

.admin-item-edit-page .admin-item-subsection {
  margin-top: 1.1rem;
  padding: 1.1rem 0 0;
}

.admin-item-edit-page .admin-item-subsection:first-of-type {
  margin-top: 0;
  padding-top: 0;
  border-top: 0;
}

.admin-item-edit-page .admin-item-edit-section-head + .admin-item-subsection {
  margin-top: 0;
  padding-top: 0;
  border-top: 0;
}

.admin-item-edit-page .admin-item-needs-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.admin-item-edit-page .admin-item-need-field {
  padding: 0;
}

.admin-item-icon-current {
  display: grid;
  grid-template-columns: 76px minmax(0, 1fr) auto;
  align-items: center;
  gap: 1rem;
  padding: 1rem;
  border: 1px solid rgba(0, 0, 0, 0.09);
  border-radius: 14px;
  background: #fff;
}

.admin-item-icon-preview {
  width: 76px;
  height: 76px;
  display: flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  padding: 0.4rem;
  border-radius: 12px;
  background: #f7f7f7;
}

.admin-item-icon-preview img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.admin-item-icon-preview.is-fallback {
  color: #777;
}

.admin-item-icon-preview.is-fallback .material-symbols-outlined {
  font-size: 2.2rem;
}

.admin-item-icon-current-copy,
.admin-item-icon-choice-copy {
  min-width: 0;
  display: flex;
  flex-direction: column;
}

.admin-item-icon-current-copy strong,
.admin-item-icon-choice-copy strong {
  overflow-wrap: anywhere;
}

.admin-item-icon-current-copy span,
.admin-item-icon-choice-copy span,
.admin-item-icon-status {
  color: #666;
  font-size: 0.88rem;
}

.admin-item-icon-suggestion[hidden] {
  display: none !important;
}

.admin-item-icon-selection[hidden] {
  display: none !important;
}

.admin-item-icon-suggestion,
.admin-item-icon-search {
  margin-top: 1.25rem;
}

.admin-item-icon-suggestion .admin-item-subsection-head {
  margin-bottom: 0.65rem;
}

.admin-item-icon-search .admin-row {
  width: min(100%, 520px);
}

.admin-item-icon-status {
  margin: 0.5rem 0 0;
}

.admin-item-icon-status.is-error {
  color: #a80000;
  font-weight: 700;
}

.admin-item-icon-results {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(245px, 1fr));
  gap: 0.75rem;
  margin-top: 0.85rem;
}

.admin-item-icon-choice {
  min-width: 0;
  display: grid;
  grid-template-columns: 58px minmax(0, 1fr);
  align-items: center;
  gap: 0.75rem;
  padding: 0.75rem;
  border: 1px solid rgba(0, 0, 0, 0.09);
  border-radius: 12px;
  background: #fff;
}

.admin-item-icon-choice img {
  width: 58px;
  height: 58px;
  object-fit: contain;
}

.admin-item-icon-choice .btn-admin {
  grid-column: 1 / -1;
  justify-self: end;
}

.admin-item-icon-actions {
  display: flex;
  justify-content: flex-end;
  margin-top: 1.25rem;
}

.admin-item-edit-page .admin-actions {
  margin: 0 1rem;
  padding: 1rem 0 0;
}

.admin-item-edit-page .admin-actions.admin-item-recipe-actions {
  justify-content: flex-start;
  margin-left: 0;
}

.admin-item-recipe-preview[hidden] {
  display: none !important;
}

.admin-item-name-feedback.is-link {
  cursor: pointer;
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 0.18em;
}

.admin-item-suggestion-option.is-existing {
  background: #fff8e8;
  box-shadow: inset 3px 0 0 #b36a00;
}

.admin-item-suggestion-option.is-existing:hover,
.admin-item-suggestion-option.is-existing:focus-visible,
.admin-item-suggestion-option.is-existing.is-active {
  background: #fff0cf;
}

.admin-item-suggestion-existing {
  display: inline-flex;
  align-items: center;
  min-height: 20px;
  padding: 0.12rem 0.45rem;
  border-radius: 999px;
  font-size: 0.74rem;
  font-weight: 750;
  line-height: 1.1;
  background: #ffe0a8;
  color: #754300;
}

/* USER CREATE + ADMIN USER EDIT: flaches Layout und Vorschläge wie bei Items. */
.user-account-edit-form .admin-grid--two {
  margin-bottom: 0;
}

.user-create-existing-suggestions {
  position: relative;
  width: 100%;
  margin: 0 auto;
  padding: 1.35rem 1rem 1rem;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  box-sizing: border-box;
  text-align: left;
}

.user-create-existing-suggestions::before {
  content: "";
  display: block;
  width: 72px;
  height: 2px;
  margin: 0 auto 0.95rem;
  border-radius: 999px;
  background: rgba(168, 0, 0, 0.28);
}

.user-create-existing-suggestions > p {
  margin: 0;
  color: #666;
  font-size: 0.94rem;
  font-weight: 600;
}

.user-suggestion-list--static {
  position: relative;
  inset: auto;
  max-height: none;
  margin-top: 0.85rem;
}

.user-suggestion-form {
  margin: 0;
}

.user-suggestion-form + .user-suggestion-form {
  margin-top: 0.15rem;
}

.user-suggestion-option.is-existing .user-suggestion-action {
  color: #754300;
}

@media (max-width: 900px) {
  .admin-item-general-grid,
  .admin-item-broetchen-surcharge-grid,
  .admin-item-edit-page .admin-item-needs-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 640px) {
  .admin-item-edit-page {
    width: 100%;
  }

  .admin-item-general-grid,
  .admin-item-meal-variant-grid,
  .admin-item-broetchen-surcharge-grid,
  .admin-item-edit-page .admin-item-needs-grid {
    grid-template-columns: 1fr;
  }

  .admin-settings-broetchen-row {
    grid-template-columns: minmax(0, 1fr) 116px 42px;
    gap: 0.45rem;
  }

  .admin-settings-broetchen-list-head {
    grid-template-columns: minmax(0, 1fr) 116px 42px;
    gap: 0.45rem;
    padding-left: 0;
    padding-right: 0;
  }

  .admin-settings-broetchen-add-button {
    display: none;
  }

  .admin-meals-breakfast-add.admin-settings-broetchen-add-button-mobile {
    display: inline-flex;
    justify-self: center;
  }

  .admin-item-broetchen-surcharges-head {
    align-items: flex-start;
    flex-direction: column;
    gap: 0.25rem;
  }

  .admin-item-edit-page .admin-item-subsection {
    margin-top: 1rem;
    padding: 1rem 0 0;
  }

  .admin-item-icon-current {
    grid-template-columns: 64px minmax(0, 1fr);
    padding: 0.85rem;
  }

  .admin-item-icon-preview {
    width: 64px;
    height: 64px;
  }

  .admin-item-icon-current > .btn-admin {
    grid-column: 1 / -1;
    justify-self: end;
  }

  .admin-item-icon-results {
    grid-template-columns: 1fr;
  }

  .admin-item-edit-page .admin-actions {
    margin: 0 0.85rem;
  }
}

/* ADMIN ITEM EDIT ENDE */
/* ADMIN_MEALS.PHP */
.admin-meals-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
}

.admin-meals-mode-nav {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
  align-items: center;
  column-gap: 0.5rem;
  width: max-content;
  max-width: 100%;
  margin: 0 auto 1rem;
}

.admin-meals-mode-nav .admin-meals-hero-mode:first-child {
  justify-self: end;
}

.admin-meals-mode-nav .admin-meals-hero-mode:nth-child(2) {
  justify-self: center;
}

.admin-meals-mode-nav .admin-meals-hero-mode:last-child {
  justify-self: start;
}

.admin-meals-hero-mode,
.admin-meals-hero-mode:visited {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 26px;
  padding: 0.18rem 0.65rem;
  border: 1px solid rgba(0, 0, 0, 0.09);
  border-radius: 999px;
  background: rgba(0, 0, 0, 0.045);
  color: #5f6368;
  font-size: 0.78rem;
  font-weight: 750;
  line-height: 1.2;
  text-decoration: none;
  box-sizing: border-box;
}

.admin-meals-hero-mode:hover,
.admin-meals-hero-mode:focus-visible {
  border-color: rgba(168, 0, 0, 0.24);
  background: rgba(168, 0, 0, 0.06);
  color: #a80000;
  text-decoration: none;
}

.admin-meals-hero-mode.is-active {
  border-color: #a80000;
  background: #a80000;
  color: #fff;
}

.admin-meals-section-head {
  align-items: flex-end;
  flex-wrap: wrap;
}

.admin-meals-section-head .muted {
  display: block;
  line-height: 1.4;
}

.admin-meals-date-form {
  display: flex;
  align-items: center;
  gap: 0.55rem;
  margin: 0;
  min-width: 220px;
}

.admin-meals-date-form label {
  color: #555;
  font-size: 0.86rem;
  font-weight: 800;
}

.admin-meals-date-form .input-control {
  max-width: 180px;
  text-align: left;
}

.admin-meals-editor-row label {
  color: #555;
  font-size: 0.86rem;
  font-weight: 800;
}

.admin-meals-editor-row .input-control {
  max-width: none;
  text-align: left;
}

.admin-meals-day-toggles .admin-meals-grid {
  grid-template-columns: repeat(3, minmax(180px, 1fr));
}

.admin-meals-day-toggles {
  margin: 0 0 0.95rem;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

.admin-meals-day-toggles .admin-lage-switch,
.admin-meals-plan-toggles .admin-lage-switch {
  width: 100%;
  min-height: 54px;
  justify-content: flex-start;
  padding: 0.65rem 0.75rem;
  border: 1px solid rgba(0,0,0,0.08);
  border-radius: 12px;
  background: #fafafa;
  box-sizing: border-box;
}

.admin-meals-day-toggles .admin-lage-switch-label {
  color: #222;
}

.admin-meals-day-toggles .admin-lage-switch.is-off .admin-lage-switch-label,
.admin-meals-plan-toggles .admin-lage-switch.is-off .admin-lage-switch-label {
  color: #777;
}

.admin-meals-day-toggles .admin-lage-switch.is-disabled-slot {
  background: #f3f4f6;
  border-color: rgba(0,0,0,0.06);
  color: #777;
  opacity: 0.74;
}

.admin-meals-day-toggles .admin-lage-switch.is-disabled-slot .admin-lage-switch-label {
  color: #777;
}

.admin-meals-day-toggles .admin-lage-switch.is-disabled-slot .admin-lage-switch-slider {
  opacity: 0.72;
}

.admin-meals-plan-toggles {
  grid-template-columns: repeat(3, minmax(180px, 1fr));
  margin-bottom: 0.95rem;
}

.admin-meals-editor-row.is-hidden {
  display: none;
}

.admin-meals-disabled-marker {
  color: #a80000;
  font-size: 1.08rem;
  font-weight: 900;
  line-height: 1;
}

.admin-meals-disabled-text {
  color: #a80000;
  font-style: italic;
  font-weight: 700;
}

.admin-meals-editor {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0;
  border-top: 1px solid rgba(0,0,0,0.08);
}

.admin-meals-editor-group-title {
  display: flex;
  align-items: baseline;
  gap: 0.5rem;
  margin: 0;
  padding: 1rem 0 0.25rem;
  color: #222;
  font-size: 1.05rem;
  font-weight: 900;
}

.admin-meals-editor-group-title [data-meal-group-state] {
  color: #a80000;
  font-size: 0.76rem;
  font-weight: 800;
}

.admin-meals-editor-group-toggle {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  width: 100%;
  padding: 0;
  border: 0;
  background: transparent;
  color: inherit;
  font: inherit;
  text-align: left;
  cursor: pointer;
}

.admin-meals-editor-group-toggle:focus-visible {
  color: #a80000;
  outline: 2px solid rgba(168, 0, 0, 0.24);
  outline-offset: 4px;
  border-radius: 4px;
}

.admin-meals-editor-group-toggle-icon {
  position: relative;
  width: 0.7rem;
  height: 0.7rem;
  margin-left: auto;
  flex: 0 0 0.7rem;
}

.admin-meals-editor-group-toggle-icon::before {
  content: "";
  position: absolute;
  inset: 0.05rem 0.12rem 0.12rem 0.05rem;
  border-right: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  transform: rotate(45deg);
  transition: transform 0.18s ease;
}

.admin-meals-editor-group-toggle[aria-expanded="false"] .admin-meals-editor-group-toggle-icon::before {
  transform: rotate(-45deg);
}

.admin-meals-editor-row {
  display: grid;
  /* Jede Mahlzeitenzeile benutzt dieselben vier Spalten: Titel, Merkmal,
     Beschreibung sowie Preis mit Freigabe. */
  grid-template-columns:
    clamp(180px, 16vw, 260px)
    clamp(150px, 14vw, 230px)
    minmax(180px, 1fr)
    minmax(220px, 300px);
  gap: 0.75rem;
  align-items: end;
  padding: 0.9rem 0;
  border: 0;
  border-bottom: 1px solid rgba(0,0,0,0.08);
  border-radius: 0;
  background: transparent;
}

.admin-meals-editor-row.is-collapsed {
  display: none;
}

.admin-meals-editor-row[data-meal-row="breakfast"] {
  grid-column: 1 / -1;
}

.admin-meals-editor-title {
  align-self: center;
  color: #222;
  font-weight: 900;
}

.admin-meals-editor-title > span {
  display: block;
  margin-top: 0.2rem;
  color: #a80000;
  font-size: 0.76rem;
  font-weight: 800;
}

.admin-meals-editor-title > span[hidden] {
  display: none;
}

.admin-meals-vegetarian-check {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  align-self: center;
  margin: 0;
  color: #555;
  font-size: 0.8rem;
  font-weight: 700;
  white-space: nowrap;
}

.admin-meals-vegetarian-check input[type="checkbox"] {
  width: 1rem;
  height: 1rem;
  margin: 0;
  accent-color: #16883f;
}

.admin-meals-editor-row.is-disabled-slot {
  background: transparent;
  color: #777;
}

.admin-meals-editor-row.is-disabled-meal {
  background: transparent;
}

.admin-meals-editor-row.is-disabled-meal .admin-meals-editor-title {
  color: #777;
}

.admin-meals-editor-row.is-disabled-slot .admin-meals-editor-title,
.admin-meals-editor-row.is-disabled-slot label {
  color: #777;
}

.admin-meals-editor-row.is-disabled-slot .input-control {
  background: #ededed;
  color: #777;
  cursor: not-allowed;
}

.admin-meals-editor-row.is-disabled-meal .admin-meals-editor-price .input-control {
  background: #f3f4f6;
  color: #777;
  cursor: not-allowed;
}

.admin-meals-editor-note--wide {
  grid-column: span 2;
}

.admin-meals-editor-row .form-row {
  display: flex;
  align-items: stretch;
  text-align: left;
}

.admin-meals-editor-price .input-control {
  text-align: right;
}

.admin-meals-editor-price-control {
  display: flex;
  align-items: center;
  gap: 0.55rem;
  min-width: 0;
}

.admin-meals-editor-price-control > .input-control {
  flex: 1 1 auto;
  min-width: 0;
}

.admin-meals-inline-switch {
  flex: 0 0 auto;
  gap: 0.35rem;
}

.admin-meals-inline-switch .admin-lage-switch-slider {
  width: 40px;
  height: 24px;
  flex-basis: 40px;
}

.admin-meals-inline-switch .admin-lage-switch-slider::before {
  width: 18px;
  height: 18px;
}

.admin-meals-inline-switch input:checked + .admin-lage-switch-slider::before {
  transform: translateX(16px);
}

.admin-meals-inline-switch .admin-lage-switch-label {
  min-width: 3.2rem;
  font-size: 0.76rem;
}

.admin-meals-table-check {
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  gap: 0.15rem;
  justify-content: center;
}

.admin-meals-booking-variant-label {
  min-height: 0.75rem;
  color: #667085;
  font-size: 0.66rem;
  font-weight: 700;
  line-height: 1;
}

.admin-meals-plan-cell {
  overflow-wrap: anywhere;
}

.admin-meals-plan-date {
  font-weight: 800;
}

.admin-meals-booking-summary {
  background: #f7f7f8;
}

.admin-meals-booking-summary > th,
.admin-meals-booking-summary > td {
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
  border-bottom: 1px solid rgba(0, 0, 0, 0.12);
  background: #f7f7f8;
  color: #222;
  font-size: 0.86rem;
  letter-spacing: 0;
  text-transform: none;
}

.admin-meals-booking-summary-tools {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.7rem;
  width: 100%;
  min-width: 0;
}

.admin-meals-booking-search {
  flex: 1 1 180px;
  min-width: 0;
  max-width: 250px;
}

.admin-meals-booking-search .input-control {
  min-height: 36px;
  padding: 0.42rem 0.65rem;
  font-size: 0.84rem;
  font-weight: 500;
  letter-spacing: 0;
  text-transform: none;
}

.admin-meals-booking-summary-label {
  flex: 0 0 auto;
  margin-left: auto;
  color: #6b7280;
  font-size: 0.76rem;
  font-weight: 800;
  letter-spacing: 0.035em;
  text-transform: uppercase;
}

.admin-meals-booking-summary > td > strong {
  color: #a80000;
  font-size: 1.18rem;
  font-weight: 900;
  line-height: 1;
}

.admin-meals-booking-empty td {
  padding: 1rem;
  color: #6b7280;
  text-align: left !important;
}

.admin-meals-breakfast-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 116px;
  min-height: 36px;
  padding: 0.45rem 0.7rem;
  border: 1px solid rgba(168,0,0,0.22);
  border-radius: 999px;
  background: #fff7f7;
  color: #a80000;
  font: inherit;
  font-weight: 800;
  cursor: pointer;
  box-sizing: border-box;
}

.admin-meals-breakfast-button.is-empty {
  border-color: rgba(0,0,0,0.1);
  background: #f6f6f6;
  color: #666;
}

.admin-meals-breakfast-popup {
  display: grid;
  grid-template-rows: auto minmax(11rem, 1fr);
  gap: 0.9rem;
  height: 100%;
  min-height: 0;
  text-align: left;
}

.admin-meals-breakfast-selected-section,
.admin-meals-breakfast-catalog-section {
  display: grid;
  min-height: 0;
}

.admin-meals-breakfast-selected-section {
  grid-template-rows: auto minmax(0, 1fr);
  max-height: min(38vh, 18rem);
  padding-bottom: 0.9rem;
  border-bottom: 2px solid rgba(168, 0, 0, 0.22);
}

.admin-meals-breakfast-catalog-section {
  grid-template-rows: auto auto minmax(0, 1fr);
}

.admin-meals-breakfast-area-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  margin-bottom: 0.45rem;
}

.admin-meals-breakfast-area-head h4 {
  margin: 0;
  color: #222;
  font-size: 0.96rem;
  font-weight: 900;
}

.admin-meals-breakfast-area-head span {
  color: #777;
  font-size: 0.78rem;
  font-weight: 800;
  white-space: nowrap;
}

.admin-meals-breakfast-search {
  width: 100%;
  max-width: none;
  margin-bottom: 0.45rem;
  text-align: left;
}

.admin-meals-breakfast-selected-list,
.admin-meals-breakfast-catalog-list {
  min-height: 0;
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
  padding-right: 0.2rem;
  scrollbar-gutter: stable;
}

.admin-meals-breakfast-selected-item,
.admin-meals-breakfast-catalog-item {
  display: grid;
  align-items: center;
  gap: 0.55rem;
  padding: 0.62rem 0;
  border-top: 1px solid rgba(0, 0, 0, 0.08);
}

.admin-meals-breakfast-selected-item {
  grid-template-columns: minmax(0, 1fr) auto auto;
}

.admin-meals-breakfast-catalog-item {
  grid-template-columns: minmax(0, 1fr) auto 2rem;
}

.admin-meals-breakfast-selected-item:first-child,
.admin-meals-breakfast-catalog-item:first-child {
  border-top: 0;
}

.admin-meals-breakfast-item-main strong {
  display: block;
  overflow-wrap: anywhere;
  color: #222;
  font-weight: 900;
  line-height: 1.2;
}

.admin-meals-breakfast-item-main {
  min-width: 0;
}

.admin-meals-breakfast-item-main span,
.admin-meals-breakfast-empty,
.admin-meals-breakfast-selected-empty {
  color: #666;
  font-size: 0.82rem;
  font-weight: 600;
}

.admin-meals-breakfast-item-main .admin-meals-breakfast-price.is-free {
  color: #197a32;
  font-weight: 800;
}

.admin-meals-breakfast-selected-meta {
  display: flex !important;
  align-items: center;
  gap: 0.35rem;
  margin-top: 0.12rem;
}

.admin-meals-breakfast-selected-meta > span + span::before {
  content: "·";
  margin-right: 0.35rem;
  color: #aaa;
}

.admin-meals-breakfast-selected-controls {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.3rem;
  white-space: nowrap;
}

.admin-meals-breakfast-step {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2rem;
  height: 2rem;
  padding: 0;
  border: 1px solid rgba(0, 0, 0, 0.12);
  border-radius: 50%;
  background: #fff;
  color: #a80000;
  font-size: 1rem;
  font-weight: 900;
  line-height: 1;
  cursor: pointer;
}

.admin-meals-breakfast-selected-qty {
  min-width: 1.45rem;
  color: #222;
  font-size: 0.96rem;
  font-weight: 900;
  text-align: center;
}

.admin-meals-breakfast-remove,
.admin-meals-breakfast-add {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2rem;
  height: 2rem;
  padding: 0;
  border-radius: 50%;
  font: inherit;
  font-size: 1.15rem;
  font-weight: 900;
  cursor: pointer;
}

.admin-meals-breakfast-remove {
  border: 0;
  background: #f3f3f3;
  color: #666;
  line-height: 1;
}

.admin-meals-breakfast-add {
  align-self: center;
  grid-column: 3;
  justify-self: end;
  border: 1px solid rgba(168, 0, 0, 0.24);
  background: #fff4f4;
  color: #a80000;
  line-height: 0;
}

.admin-meals-breakfast-add > span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  line-height: 1;
  transform: translateY(-0.04em);
}

.admin-meals-breakfast-type-field {
  display: grid;
  min-width: 0;
  justify-items: end;
  justify-self: end;
  gap: 0.18rem;
}

.admin-meals-breakfast-type-options {
  display: inline-flex;
  align-items: center;
  gap: 0.22rem;
  max-width: min(34vw, 18rem);
  overflow-x: auto;
  overflow-y: hidden;
  scrollbar-width: none;
  white-space: nowrap;
}

.admin-meals-breakfast-type-options::-webkit-scrollbar {
  display: none;
}

.admin-meals-breakfast-type-choice {
  display: inline-flex;
  align-items: baseline;
  gap: 0.3rem;
  flex: 0 0 auto;
  padding: 0.24rem 0.48rem;
  border: 1px solid rgba(168, 0, 0, 0.15);
  border-radius: 999px;
  background: #f5f5f5;
  color: #666;
  font: inherit;
  font-size: 0.72rem;
  font-weight: 800;
  line-height: 1.15;
  cursor: pointer;
}

.admin-meals-breakfast-type-choice small {
  color: inherit;
  font-size: 0.66rem;
  font-weight: 700;
  opacity: 0.78;
}

.admin-meals-breakfast-type-choice.is-active {
  border-color: rgba(168, 0, 0, 0.32);
  background: #a80000;
  color: #fff;
}

.admin-meals-breakfast-type-hint {
  display: none;
  color: #a80000;
  font-size: 0.68rem;
  font-weight: 800;
  line-height: 1;
  white-space: nowrap;
}

.admin-meals-breakfast-type-field.is-required .admin-meals-breakfast-type-options {
  animation: admin-meals-breakfast-type-shake 0.36s ease-in-out;
}

.admin-meals-breakfast-type-field.is-required .admin-meals-breakfast-type-hint {
  display: block;
}

@keyframes admin-meals-breakfast-type-shake {
  0%,
  100% {
    transform: translateX(0);
  }

  25% {
    transform: translateX(-3px);
  }

  50% {
    transform: translateX(3px);
  }

  75% {
    transform: translateX(-2px);
  }
}

@media (prefers-reduced-motion: reduce) {
  .admin-meals-breakfast-type-field.is-required .admin-meals-breakfast-type-options {
    animation: none;
  }
}

.admin-meals-breakfast-selected-empty,
.admin-meals-breakfast-empty {
  margin: 0;
  padding: 0.75rem 0;
}

body.is-admin-meals-breakfast-sheet-open {
  overflow: hidden;
}

.admin-meals-breakfast-sheet-backdrop {
  position: fixed;
  z-index: 99998;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  padding: 0;
  border: 0;
  background: rgba(0, 0, 0, 0.36);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity 0.18s ease, visibility 0s linear 0.18s;
}

.admin-meals-breakfast-sheet-backdrop.is-open {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transition: opacity 0.18s ease, visibility 0s linear 0s;
}

.admin-meals-breakfast-sheet {
  position: fixed;
  z-index: 99999;
  bottom: 0;
  left: 50%;
  display: grid;
  grid-template-rows: auto auto minmax(0, 1fr) auto;
  width: calc(100% - 2rem);
  max-width: 820px;
  width: min(calc(100% - 2rem), 820px);
  height: 88vh;
  height: min(88vh, 760px);
  padding: 0.4rem 1rem 0.8rem;
  border: 1px solid rgba(0, 0, 0, 0.1);
  border-bottom: 0;
  border-radius: 22px 22px 0 0;
  background: #fff;
  box-shadow: 0 -16px 40px rgba(0, 0, 0, 0.22);
  box-sizing: border-box;
  opacity: 0;
  visibility: hidden;
  transform: translate(-50%, 104%);
  transition:
    opacity 0.18s ease,
    visibility 0s linear 0.24s,
    transform 0.24s ease;
}

.admin-meals-breakfast-sheet-heading {
  min-width: 0;
}

.admin-meals-breakfast-sheet-heading > span {
  display: block;
  margin-bottom: 0.1rem;
  color: #a80000;
  font-size: 0.72rem;
  font-weight: 900;
  letter-spacing: 0.06em;
}

.admin-meals-breakfast-sheet-heading h3 {
  overflow: hidden;
  margin: 0;
  color: #171717;
  font-size: 1.2rem;
  font-weight: 900;
  line-height: 1.2;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.admin-meals-breakfast-sheet-close {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  justify-content: center;
  width: 2.25rem;
  height: 2.25rem;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: #f3f3f3;
  color: #222;
  font: inherit;
  font-size: 1.7rem;
  font-weight: 500;
  line-height: 1;
  cursor: pointer;
}

.admin-meals-breakfast-sheet-body {
  min-height: 0;
  overflow: hidden;
  padding-top: 0.75rem;
}

.admin-meals-breakfast-sheet-status {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 0.42rem;
  min-height: 1.5rem;
  padding-top: 0.55rem;
  border-top: 1px solid rgba(0, 0, 0, 0.08);
  color: #666;
  font-size: 0.78rem;
}

.admin-meals-breakfast-sheet-status > span {
  width: 0.5rem;
  height: 0.5rem;
  border-radius: 50%;
  background: #2f9e44;
}

.admin-meals-breakfast-sheet-status.is-pending > span,
.admin-meals-breakfast-sheet-status.is-saving > span {
  background: #d98200;
}

.admin-meals-breakfast-sheet-status.is-error {
  color: #a80000;
}

.admin-meals-breakfast-sheet-status.is-error > span {
  background: #a80000;
}

@media (max-width: 850px) {
  .admin-meals-breakfast-sheet {
    left: 0;
    width: 100%;
    max-width: none;
    height: 90vh;
    height: min(90dvh, 760px);
    padding: 0.4rem 1rem calc(0.85rem + env(safe-area-inset-bottom, 0px));
    transform: translateY(104%);
  }

  .admin-meals-breakfast-sheet.is-open {
    transform: translateY(var(--knt-bottom-sheet-drag-y, 0px));
  }

  .admin-meals-breakfast-catalog-item {
    grid-template-columns: minmax(0, 1fr) auto 2rem;
    gap: 0.4rem;
  }

  .admin-meals-breakfast-type-options {
    max-width: 42vw;
  }

  .admin-meals-breakfast-add {
    grid-column: 3;
  }
}

@media (max-width: 900px) {
  .admin-meals-grid {
    grid-template-columns: 1fr;
  }

  .admin-meals-date-form {
    align-items: stretch;
    width: 100%;
    flex-direction: column;
    gap: 0.35rem;
  }

  .admin-meals-date-form .input-control {
    width: 100%;
    max-width: none;
  }

  .admin-meals-day-toggles .admin-meals-grid,
  .admin-meals-plan-toggles {
    grid-template-columns: 1fr;
  }

}

@media (prefers-reduced-motion: reduce) {
  .admin-meals-breakfast-sheet,
  .admin-meals-breakfast-sheet-backdrop {
    transition: none;
  }
}

@media (max-width: 640px) {
  .admin-meals-editor-row {
    grid-template-columns: minmax(0, 1fr) minmax(112px, 0.45fr);
    gap: 0.65rem;
  }

  .admin-meals-editor-row[data-meal-row="breakfast"] .admin-meals-editor-title,
  .admin-meals-editor-row[data-meal-row="breakfast"] .admin-meals-editor-note--wide {
    grid-column: 1 / -1;
  }

  .admin-meals-editor-title {
    align-self: auto;
  }

  .admin-meals-editor-group-title {
    padding-top: 0.9rem;
  }

  .admin-meals-inline-switch .admin-lage-switch-label {
    display: none;
  }

  .admin-meals-variant-dialog {
    gap: 0.5rem;
  }

  .admin-meals-variant-dialog .meal-variant-button {
    min-height: 0;
    gap: 0.4rem;
    padding: 0.55rem 0.45rem;
  }

  .admin-meals-variant-dialog .meal-variant-icon {
    flex-basis: 32px;
    width: 32px;
    height: 32px;
  }

  .admin-meals-variant-dialog .meal-variant-icon img {
    width: 26px;
    height: 26px;
  }

  .admin-meals-variant-dialog .meal-variant-copy strong {
    font-size: 0.86rem;
    line-height: 1.16;
  }

  .admin-meals-variant-dialog .meal-variant-copy small {
    font-size: 0.76rem;
  }
}
/* ADMIN_MEALS ENDE */
/* Gemeinsames flaches Seitenlayout. */
.page-wrap .index-section {
  width: 100%;
  max-width: none;
  box-sizing: border-box;
}

.page-wrap > .index-section,
.lage-create-form > .index-section,
.admin-lage-section-form > .index-section,
.admin-item-edit-form > .admin-item-edit-section,
.admin-evaluation-content > .index-section {
  position: relative;
  margin: 0 auto;
  padding: 1.35rem 1rem 1rem;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

.page-wrap > .index-section::before,
.lage-create-form > .index-section::before,
.admin-lage-section-form > .index-section::before,
.admin-item-edit-form > .admin-item-edit-section::before,
.admin-evaluation-content > .index-section::before {
  content: "";
  display: block;
  width: 72px;
  height: 2px;
  margin: 0 auto var(--index-section-divider-spacing, 1.15rem);
  border-radius: 999px;
  background: rgba(168,0,0,0.28);
}

.page-wrap > .index-hero-card {
  width: auto;
  max-width: calc(100% - 2rem);
  align-self: center;
  box-sizing: border-box;
  margin: 0.35rem auto 0;
  padding: 0.65rem 1rem 0.4rem;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  text-align: center;
}

.shop-page {
  overflow: visible;
}

/* ADMIN SETTINGS – flache Seite mit eigenständigen Akkordeon-Bereichen */
.admin-settings-accordion-list {
  display: grid;
  gap: .7rem;
  width: 100%;
  background: transparent;
}

.admin-settings-page .admin-form {
  display: block;
  width: 100%;
  margin: 0;
  padding: 0;
  overflow: hidden;
  background: #fff;
  border: 1px solid rgba(0, 0, 0, .09);
  border-radius: 14px;
}

.admin-settings-page #adminSettingsTimesSlot:empty {
  display: none;
}

.admin-settings-page .admin-section {
  width: 100%;
  margin: 0;
  padding: 0;
  overflow: hidden;
  background: #fff;
  border: 0;
  border-radius: 0;
  box-sizing: border-box;
}

.admin-settings-page .admin-lage-card-head {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: nowrap;
  gap: .75rem;
  min-height: 68px;
  box-sizing: border-box;
  margin: 0;
  padding: .88rem 1rem;
  background: #fff;
  cursor: pointer;
  transition: background .15s ease, color .15s ease;
}

.admin-settings-page .admin-lage-card-head.is-disabled {
  opacity: 0.65;
  cursor: default;
}

.admin-settings-page .admin-lage-card-head:hover,
.admin-settings-page .admin-lage-card-head:focus-visible,
.admin-settings-page .admin-lage-card-head.is-open {
  background: #fff8f8;
  outline: none;
}

.admin-settings-page .admin-lage-card-head > div:first-child {
  flex: 1 1 auto;
}

.admin-settings-page .admin-lage-card-head h3 {
  margin: 0;
  color: #222;
  text-align: left;
  font-size: 1.02rem;
  font-weight: 820;
  line-height: 1.25;
}

.admin-settings-page .admin-lage-card-head small {
  display: block;
  color: #707070;
  font-size: .82rem;
  font-weight: 600;
  line-height: 1.3;
}

.admin-settings-page .admin-lage-card-head > .admin-lage-head-actions {
  margin-left: auto;
}

.admin-settings-page .admin-lage-card-head::after {
  content: "";
  flex: 0 0 auto;
  width: .48rem;
  height: .48rem;
  margin: 0 .18rem 0 .12rem;
  border-right: 2px solid #a80000;
  border-bottom: 2px solid #a80000;
  transform: translateY(-.12rem) rotate(45deg);
  transition: transform .16s ease;
}

.admin-settings-page .admin-lage-card-head.is-open::after {
  transform: translateY(.12rem) rotate(225deg);
}

.admin-settings-page .admin-lage-card-head.is-disabled::after {
  opacity: .35;
}

.admin-settings-page .admin-lage-card-body {
  margin: 0;
  padding: 1rem;
  background: #fcfcfc;
  border-top: 1px solid rgba(0, 0, 0, .08);
}

.admin-settings-page .admin-lage-card-body > :first-child {
  margin-top: 0;
}

.admin-settings-page .admin-lage-card-body > :last-child {
  margin-bottom: 0;
}

.admin-settings-page .admin-lage-card-body > .admin-settings-form:first-child {
  margin-top: 0 !important;
}

@media (max-width: 600px) {
  .admin-settings-page .admin-lage-card-head {
    gap: .55rem;
    min-height: 62px;
    padding: .78rem .8rem;
  }

  .admin-settings-page .admin-lage-card-head h3 {
    font-size: .96rem;
  }

  .admin-settings-page .admin-lage-card-head small {
    font-size: .76rem;
  }

  .admin-settings-page .admin-lage-card-head .admin-lage-switch-label {
    display: none;
  }

  .admin-settings-page .admin-lage-card-head .admin-lage-switch {
    gap: 0;
  }

  .admin-settings-page .admin-lage-card-head .admin-lage-switch-slider {
    width: 44px;
    height: 26px;
    flex-basis: 44px;
  }

  .admin-settings-page .admin-lage-card-head .admin-lage-switch-slider::before {
    width: 20px;
    height: 20px;
  }

  .admin-settings-page .admin-lage-card-head .admin-lage-switch input:checked + .admin-lage-switch-slider::before {
    transform: translateX(18px);
  }

  .admin-settings-page .admin-lage-card-body {
    padding: .85rem .8rem;
  }
}
/* ADMIN SETTINGS ENDE */

.history-other-balances {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: .55rem;
  margin: .65rem auto 0;
  color: #666;
  font-size: .82rem;
}

.history-other-balances-section {
  display: none;
}

.history-other-balances-label {
  flex: 0 0 auto;
  color: #737373;
  font-size: .7rem;
  font-weight: 850;
  letter-spacing: .045em;
  text-transform: uppercase;
}

.history-other-balances-list {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: .35rem;
  min-width: 0;
}

.history-other-balance {
  display: inline-flex;
  align-items: baseline;
  gap: .38rem;
  padding: .34rem .52rem;
  border-radius: 8px;
  background: #f7f7f8;
  line-height: 1.2;
  white-space: nowrap;
}

.history-other-balance-name {
  color: #555;
  font-weight: 700;
}

.history-other-balance-value {
  font-weight: 850;
}

.history-other-balance-value span {
  font-weight: 650;
}

.history-other-balance-value--credit {
  color: #187a2f;
}

.history-other-balance-value--debt {
  color: #a80000;
}

@media (max-width: 850px) {
  .history-other-balances--desktop {
    display: none !important;
  }

  .history-other-balances-section {
    display: block;
    padding-top: .75rem;
    padding-bottom: .75rem;
  }

  .history-other-balances-section .index-section-head {
    margin-bottom: .45rem;
  }

  .history-other-balances {
    display: grid;
    gap: .38rem;
    width: min(100%, 360px);
    margin-top: .6rem;
  }

  .history-other-balances-label {
    text-align: left;
  }

  .history-other-balances-list {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: .25rem;
    width: 100%;
  }

  .history-other-balance {
    justify-content: space-between;
    gap: .75rem;
    white-space: normal;
  }

  .history-other-balance-value {
    flex: 0 0 auto;
    white-space: nowrap;
  }
}

.history-period-picker {
  position: relative;
  flex: 0 0 auto;
}

.history-period-badge {
  gap: .42rem;
  border: 0;
  list-style: none;
  cursor: pointer;
  user-select: none;
}

.history-period-badge::-webkit-details-marker {
  display: none;
}

.history-period-badge::marker {
  content: "";
}

.history-period-badge:hover,
.history-period-badge:focus-visible {
  background: #ffdada;
  outline: none;
}

.history-period-chevron {
  width: .42rem;
  height: .42rem;
  border-right: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  transform: translateY(-.1rem) rotate(45deg);
  transition: transform 160ms ease;
}

.history-period-picker[open] .history-period-chevron {
  transform: translateY(.1rem) rotate(225deg);
}

.history-period-options {
  position: absolute;
  z-index: 40;
  top: calc(100% + .45rem);
  right: 0;
  display: grid;
  gap: .18rem;
  min-width: 165px;
  padding: .4rem;
  border: 1px solid rgba(0, 0, 0, .1);
  border-radius: 12px;
  background: #fff;
  box-shadow: 0 12px 28px rgba(0, 0, 0, .15);
}

.history-period-option {
  width: 100%;
  padding: .5rem .65rem;
  border: 0;
  border-radius: 8px;
  background: transparent;
  color: #333;
  font: inherit;
  font-size: .86rem;
  font-weight: 700;
  text-align: left;
  cursor: pointer;
}

.history-period-option:hover,
.history-period-option:focus-visible {
  background: #fff2f2;
  color: #a80000;
  outline: none;
}

.history-period-option.is-active {
  background: #ffe8e8;
  color: #a80000;
}

.history-filter-form,
.admin-item-filter-form,
.admin-user-filter-form {
  display: block;
  width: 100%;
  margin: .7rem 0 .9rem;
  box-sizing: border-box;
}

.history-filter-form .item-edit-grid,
.admin-item-filter-form .item-edit-grid,
.admin-user-filter-form .item-edit-grid {
  width: 100%;
  box-sizing: border-box;
}

.history-filter-form .user-admin-top-grid,
.admin-item-filter-form .admin-item-overview-filter-grid,
.admin-user-filter-form .admin-user-overview-filter-grid {
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  gap: .65rem;
  align-items: end;
}

.history-filter-form .form-row,
.admin-item-filter-form .form-row,
.admin-user-filter-form .form-row {
  width: 100%;
  max-width: 100%;
}

.history-filter-form .input-control,
.admin-item-filter-form .input-control,
.admin-user-filter-form .input-control {
  min-height: 2.35rem;
  padding-top: .45rem;
  padding-bottom: .45rem;
}

.history-filter-actions,
.admin-item-filter-actions,
.admin-user-filter-actions {
  justify-content: flex-end;
}

.history-filter-actions .item-admin-top-actions-label,
.admin-item-filter-actions .item-admin-top-actions-label,
.admin-user-filter-actions .item-admin-top-actions-label {
  display: none;
}

.history-filter-actions .item-admin-top-buttons,
.admin-item-filter-actions .item-admin-top-buttons,
.admin-user-filter-actions .item-admin-top-buttons {
  margin-bottom: 0;
}

.history-filter-actions .btn-admin,
.admin-item-filter-actions .btn-admin,
.admin-user-filter-actions .btn-admin {
  min-height: 2.35rem;
  padding: .45rem .75rem;
}

.history-profile-balance-row {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  flex-wrap: wrap;
  gap: .35rem;
  padding: .12rem 0;
  color: #3f4650;
  font-size: .94rem;
}

.history-profile-balance-name {
  min-width: 0;
  overflow-wrap: anywhere;
  color: #3f4650;
  font-weight: 700;
}

/* =========================
   COMPATIBILITY FALLBACKS
   Alte Browser bekommen gestapelte, nutzbare Layouts.
========================= */
@supports not (display: grid) {
  .admin-dashboard-kpi-grid,
  .admin-dashboard-insights-grid,
  .admin-dashboard-rank-list,
  .index-action-grid,
  .index-dashboard-grid,
  .index-meal-stack,
  .index-page .breakfast-list,
   .item-admin-list,
   .admin-grid,
   .admin-item-overview-filter-grid,
   .user-admin-top-grid,
  .item-admin-top-grid,
  .admin-rule-grid,
  .admin-eval-grid,
  .cookbook-layout,
  .item-edit-grid,
  .admin-meals-grid {
    display: block;
  }

  .admin-dashboard-kpi-grid > * + *,
  .admin-dashboard-insights-grid > * + *,
  .admin-dashboard-rank-list > * + *,
  .index-action-grid > * + *,
  .index-dashboard-grid > * + *,
  .index-meal-stack > * + *,
  .index-page .breakfast-list > * + *,
   .item-admin-list > * + *,
   .admin-grid > * + *,
   .admin-item-overview-filter-grid > * + *,
   .user-admin-top-grid > * + *,
  .item-admin-top-grid > * + *,
  .admin-rule-grid > * + *,
  .admin-eval-grid > * + *,
  .cookbook-layout > * + *,
  .item-edit-grid > * + *,
  .admin-meals-grid > * + * {
    margin-top: 1rem;
  }
}

.no-flex-gap .nav-links > * + *,
.no-flex-gap .admin-login-form > * + *,
.no-flex-gap .meal-option-card > * + *,
.no-flex-gap .index-action-card > * + *,
.no-flex-gap .history-filter-form > * + *,
.no-flex-gap .rule-row > * + *,
.no-flex-gap .rule-row-actions > * + *,
.no-flex-gap .time-row > * + *,
.no-flex-gap .time-fields > * + *,
.no-flex-gap .cookbook-index-head > * + *,
.no-flex-gap .cookbook-editor-head > * + * {
  margin-left: 0.6rem;
}

.no-flex-gap .admin-purchase-field-group > * + * {
  margin-left: 0;
  margin-top: 0.85rem;
}

@media (max-width: 520px) {
  .no-flex-gap .time-row > * + * {
    margin-left: 0;
    margin-top: 0.35rem;
  }
}

.no-flex-gap .cookbook-form > * + * {
  margin-top: 1rem;
}

.no-flex-gap .cookbook-ingredients-list > * + * {
  margin-top: 0.55rem;
}

.no-flex-gap .admin-bottom-nav-link > * + *,
.no-flex-gap .meal-popup-options > * + * {
  margin-left: 0;
  margin-top: 0.25rem;
}

.history-list-section {
  width: 100%;
  min-width: 0;
  overflow: hidden;
}

.history-col-guest,
.history-col-price,
.history-col-date {
  min-width: 0;
  white-space: nowrap;
}

.history-col-guest {
  color: #6b7280;
}

.history-col-actions {
  white-space: nowrap;
}

.history-col-actions .delete-order-form {
  margin: 0;
}

.history-date-day,
.history-date-time {
  display: inline;
}

.history-guest-mobile {
  display: none;
}

.history-item-visual--payment {
  background: linear-gradient(135deg, #e5f7e9, #f1fbf3);
  color: #187a2f;
}

.history-item-visual--debt {
  background: linear-gradient(135deg, #ffe1e1, #fff1f1);
  color: #b91c1c;
}

.history-item-visual--lage {
  background: linear-gradient(135deg, #fff0cf, #fff8e8);
  color: #a96800;
}

.history-row.payment-row .history-col-price,
.history-row.negative-price .history-col-price {
  color: #0a6d0a;
}

.history-row.debt-row .history-col-price {
  color: #b91c1c;
}

@media (max-width: 850px) {
  .page-wrap .standard-table-section {
    overflow: visible;
  }

  .page-wrap .standard-table-section .standard-table-wrap {
    width: 100vw;
    max-width: 100vw;
    margin-right: calc(50% - 50vw);
    margin-left: calc(50% - 50vw);
    border-right: 0;
    border-left: 0;
    border-radius: 0;
  }

  .history-row td {
    padding: .72rem .52rem;
  }

  .history-col-guest {
    display: none;
  }

  .history-guest-mobile {
    display: block;
    margin-top: .08rem;
  }

  .history-item-visual {
    display: none;
  }

  .history-row .standard-table-primary h3,
  .history-col-date {
    line-height: 1.25;
  }

  .history-row .standard-table-subtitle {
    font-size: .76rem;
  }

  .history-date-day,
  .history-date-time {
    display: block;
  }

  .history-date-year {
    display: none;
  }

  .history-col-date time {
    display: block;
  }

  .history-row.is-compact .standard-table-primary h3,
  .history-row.is-compact .history-col-price,
  .history-row.is-compact .history-col-date {
    font-size: .84rem;
  }

  .history-row.is-compact .standard-table-subtitle {
    font-size: .72rem;
  }

  .history-delete-button {
    min-width: 0;
    padding: .42rem .5rem;
    border-radius: 8px;
    font-size: .74rem;
  }

  .admin-meals-plans-table {
    min-width: 760px !important;
  }

  .admin-meals-plans-list--breakfast .admin-meals-plans-table {
    min-width: 840px !important;
  }

  .admin-meals-booking-table,
  .admin-meals-booking-list--1 .admin-meals-booking-table,
  .admin-meals-booking-list--2 .admin-meals-booking-table,
  .admin-meals-booking-list--3 .admin-meals-booking-table {
    width: 100%;
    min-width: 100% !important;
    table-layout: fixed;
  }

  .admin-meals-booking-person,
  .admin-meals-booking-cell,
  .admin-meals-breakfast-cell {
    min-width: 0;
  }

  .admin-meals-booking-list--1 .admin-meals-booking-person {
    width: 55%;
  }

  .admin-meals-booking-list--2 .admin-meals-booking-person {
    width: 46%;
  }

  .admin-meals-booking-list--3 .admin-meals-booking-person {
    width: 40%;
  }

  .admin-meals-booking-list--3 .admin-meals-breakfast-cell {
    width: 24%;
  }

  .admin-meals-booking-search {
    max-width: 190px;
  }

  .admin-meals-booking-summary-label {
    display: none;
  }

  .admin-meals-booking-summary > td > strong {
    font-size: 1.08rem;
  }

  .admin-meals-booking-table tbody .admin-meals-booking-person .standard-table-primary h3 {
    font-size: 0.9rem;
    line-height: 1.2;
  }

  .admin-meals-booking-table tbody .admin-meals-booking-person .standard-table-subtitle {
    font-size: 0.72rem;
  }

  .admin-meals-booking-table tbody .admin-meals-breakfast-button {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    min-height: 32px;
    padding: 0.35rem 0.45rem;
    font-size: 0.78rem;
    line-height: 1.2;
    white-space: normal;
  }
}

@media (max-width: 850px) {
  .history-filter-form .user-admin-top-grid {
    grid-template-columns: 1fr;
  }

  .history-filter-form .history-filter-grid {
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: end;
  }

  .history-filter-field--search {
    grid-column: 1;
    grid-row: 1;
    min-width: 0;
  }

  .history-filter-field--type {
    display: none;
  }

  .history-filter-field--guest {
    grid-column: 1 / -1;
  }

  .history-filter-form .history-filter-actions {
    display: grid;
    grid-template-rows: 1.6rem minmax(0, 1fr);
    align-items: center;
    justify-content: stretch;
    grid-column: 2;
    grid-row: 1;
    align-self: stretch;
    width: auto;
    min-width: 0;
  }

  .history-filter-form .history-filter-actions .item-admin-top-buttons,
  .history-filter-form .history-filter-actions .btn-admin {
    align-self: center;
  }

  .history-filter-form .history-filter-actions .item-admin-top-buttons {
    grid-row: 2;
  }
}
/* HISTORIE.PHP + ADMIN ITEM + ADMIN USER + ADMIN PURCHASE + ADMIN MEALS ENDE */

/* Einheitliche erste Bereichsabstände für alle Seiten. */
.page-wrap > .index-hero-card ~ .index-section:nth-of-type(2),
.page-wrap > .index-hero-card ~ * > .index-section:first-of-type {
  padding-top: 0.75rem;
}

@media (max-width: 850px) {
  .page-wrap {
    width: 100%;
    max-width: 100%;
    padding-right: 1rem;
    padding-left: 1rem;
  }

  .page-wrap .index-section,
  .page-wrap .admin-item-edit-section {
    padding-right: 0;
    padding-left: 0;
  }

  .index-hero-card .index-hero-subtitle {
    display: none;
  }

  .history-page .history-hero-card .index-hero-subtitle {
    display: block;
  }

  .lage-section-subtitle,
  .admin-lage-list-subtitle,
  .admin-item-section-subtitle,
  .admin-user-section-subtitle {
    display: none;
  }

  .admin-item-filter-field--type,
  .admin-user-filter-field--wache,
  .admin-user-filter-field--department {
    display: none;
  }

  .admin-item-filter-form .admin-item-overview-filter-grid,
  .admin-user-filter-form .admin-user-overview-filter-grid {
    grid-template-columns: minmax(0, 1fr) auto;
  }

  .admin-item-filter-field--search,
  .admin-user-filter-field--search {
    grid-column: 1;
    grid-row: 1;
    min-width: 0;
  }

  .admin-item-filter-form .admin-item-filter-actions,
  .admin-user-filter-form .admin-user-filter-actions {
    display: grid;
    grid-template-rows: 1.6rem minmax(0, 1fr);
    align-items: center;
    justify-content: stretch;
    grid-column: 2;
    grid-row: 1;
    width: auto;
    min-width: 0;
    align-self: stretch;
  }

  .admin-item-filter-form .admin-item-filter-actions .item-admin-top-buttons,
  .admin-user-filter-form .admin-user-filter-actions .item-admin-top-buttons,
  .admin-user-filter-form .admin-user-filter-actions .btn-admin,
  .admin-item-filter-form .admin-item-filter-actions .btn-admin {
    align-self: center;
  }

  .admin-item-filter-form .admin-item-filter-actions .item-admin-top-buttons,
  .admin-user-filter-form .admin-user-filter-actions .item-admin-top-buttons {
    grid-row: 2;
  }

}

/* Gemeinsame Griff- und Wischfläche für Bottom-Sheets. */
.knt-bottom-sheet-drag-handle {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 1rem;
  margin: 0 0 0.1rem;
  border-radius: 0;
  background: transparent;
  cursor: grab;
  touch-action: none;
  user-select: none;
}

.knt-bottom-sheet-drag-handle::before {
  content: "";
  display: block;
  width: 2.75rem;
  height: 0.28rem;
  border-radius: 999px;
  background: #d1d1d1;
}

[data-knt-sheet-dragging="true"] .knt-bottom-sheet-drag-handle {
  cursor: grabbing;
}

.shop-cart-panel__drag-handle,
.lage-recipient-dialog-handle {
  display: none;
}

@media (max-width: 850px) {
  /* Die Tabelle bleibt vollflächig, ihr Inhalt beginnt am Seitenraster. */
  .page-wrap .standard-table tr > :first-child {
    padding-left: 1rem;
  }

  .page-wrap .standard-table tr > :last-child {
    padding-right: 1rem;
  }
}

@media (max-width: 720px) {
  .lage-recipient-dialog-handle {
    display: flex;
  }

  .lage-recipient-dialog[open] {
    transform: translateY(var(--knt-bottom-sheet-drag-y, 0px));
    transition: transform 0.24s ease;
  }
}

@media (max-width: 640px) {
  .shop-cart-panel__drag-handle {
    display: flex;
  }
}

@media (prefers-reduced-motion: reduce) {
  .lage-recipient-dialog[open] {
    transition: none;
  }
}

/* Bottom-Sheets auf der Startseite. */
body.is-index-cart-sheet-open,
body.is-index-guest-sheet-open,
body.is-index-lage-sheet-open {
  overflow: hidden;
}

.index-cart-sheet-backdrop {
  position: fixed;
  z-index: 2300;
  inset: 0;
  width: 100%;
  height: 100%;
  padding: 0;
  border: 0;
  background: rgba(0, 0, 0, 0.42);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity 0.18s ease, visibility 0s linear 0.24s;
}

.index-cart-sheet {
  position: fixed;
  z-index: 2400;
  bottom: 0;
  left: 50%;
  display: grid;
  grid-template-rows: auto auto minmax(0, 1fr) auto;
  width: min(calc(100% - 2rem), 620px);
  max-height: min(82vh, 680px);
  max-height: min(82dvh, 680px);
  padding: 1rem 1.15rem calc(1rem + env(safe-area-inset-bottom, 0px));
  border: 1px solid rgba(0, 0, 0, 0.1);
  border-bottom: 0;
  border-radius: 22px 22px 0 0;
  background: #fff;
  box-shadow: 0 -16px 40px rgba(0, 0, 0, 0.22);
  box-sizing: border-box;
  opacity: 0;
  visibility: hidden;
  transform: translate(-50%, 104%);
  transition:
    opacity 0.18s ease,
    visibility 0s linear 0.24s,
    transform 0.24s ease;
}

.index-cart-sheet.is-open {
  opacity: 1;
  visibility: visible;
  transform: translate(-50%, 0);
  transition-delay: 0s;
}

.index-cart-sheet:focus {
  outline: none;
}

.index-cart-sheet-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding-bottom: 0.75rem;
  border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}

.index-cart-sheet-head > div {
  min-width: 0;
}

.index-cart-sheet-head .index-eyebrow {
  margin: 0 0 0.18rem;
  text-align: left;
}

.index-cart-sheet-head h2 {
  margin: 0;
  color: #222;
  font-size: 1.28rem;
  font-weight: 900;
  line-height: 1.2;
  text-align: left;
}

.index-cart-sheet-count {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  min-width: 2.25rem;
  height: 2.25rem;
  padding: 0 0.55rem;
  border-radius: 999px;
  background: #fff1f1;
  color: #a80000;
  font-size: 0.95rem;
  font-weight: 900;
}

.index-cart-sheet-description {
  margin: 0;
  padding: 0.72rem 0 0.45rem;
  color: #666;
  font-size: 0.9rem;
  line-height: 1.4;
}

.index-cart-sheet-list {
  min-height: 0;
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-color: rgba(168, 0, 0, 0.34) transparent;
  scrollbar-width: thin;
}

.index-cart-sheet-list.is-scrollable {
  max-height: min(42vh, 18rem);
  max-height: min(42dvh, 18rem);
}

.index-cart-sheet-item {
  display: flex;
  align-items: flex-start;
  gap: 0.45rem;
  padding: 0.72rem 0;
  border-bottom: 1px solid rgba(0, 0, 0, 0.08);
}

.index-cart-sheet-item:last-child {
  border-bottom: 0;
}

.index-cart-sheet-item-qty {
  flex: 0 0 auto;
  color: #a80000;
  font-weight: 900;
  line-height: 1.3;
}

.index-cart-sheet-item-copy {
  display: grid;
  gap: 0.08rem;
  min-width: 0;
}

.index-cart-sheet-item-copy strong {
  overflow-wrap: anywhere;
  color: #222;
  font-weight: 850;
  line-height: 1.3;
}

.index-cart-sheet-item-copy small {
  color: #6b7280;
  font-size: 0.78rem;
  line-height: 1.3;
}

.index-cart-sheet-status {
  margin: 0;
  padding: 0.55rem 0 0;
  color: #a80000;
  font-size: 0.84rem;
  font-weight: 750;
  line-height: 1.35;
}

.index-cart-sheet-status[hidden] {
  display: none;
}

.index-cart-sheet-actions {
  display: grid;
  grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.2fr);
  gap: 0.6rem;
  padding-top: 0.75rem;
  border-top: 1px solid rgba(0, 0, 0, 0.09);
}

.index-cart-sheet-actions form {
  display: grid;
  margin: 0;
}

.index-cart-sheet-shop-link {
  grid-column: 1 / -1;
  text-decoration: none;
}

.index-cart-sheet-actions .btn-admin {
  box-sizing: border-box;
  width: 100%;
  max-width: 100%;
  min-width: 0;
}

.index-guest-sheet {
  grid-template-rows: auto minmax(0, 1fr);
  width: min(calc(100% - 2rem), 560px);
}

.index-guest-sheet-form {
  display: grid;
  grid-template-rows: minmax(0, 1fr) auto auto;
  min-height: 0;
}

.index-guest-sheet-body {
  min-height: 0;
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
  padding: 0.8rem 0 0.35rem;
}

.index-guest-sheet-description {
  margin: 0 0 0.85rem;
  color: #666;
  font-size: 0.92rem;
  line-height: 1.4;
}

.index-guest-sheet-fields {
  display: grid;
  gap: 0.75rem;
}

.index-guest-sheet-field {
  display: grid;
  gap: 0.35rem;
  min-width: 0;
  color: #444;
  font-weight: 700;
}

.index-guest-sheet-field .input-control {
  width: 100%;
  max-width: none;
  box-sizing: border-box;
  text-align: left;
}

.index-guest-sheet-field .input-control.is-invalid {
  border-color: rgba(168, 0, 0, 0.65);
  box-shadow: 0 0 0 3px rgba(168, 0, 0, 0.09);
}

.index-guest-sheet-field small {
  color: #6b7280;
  font-size: 0.76rem;
  font-weight: 600;
  line-height: 1.35;
}

.index-guest-sheet-error {
  margin: 0;
  padding: 0.5rem 0 0;
  color: #a80000;
  font-size: 0.84rem;
  font-weight: 750;
  line-height: 1.35;
}

.index-guest-sheet-error[hidden] {
  display: none;
}

.index-guest-sheet-actions {
  grid-template-columns: minmax(0, 1fr);
}

.index-lage-notice-sheet {
  grid-template-rows: auto auto auto minmax(0, 1fr) auto;
}

.index-lage-notice-handle {
  margin: -0.25rem 0 0;
  padding: 0 0 0.55rem;
  border: 0;
  background: transparent;
}

.index-lage-notice-list {
  scrollbar-color: rgba(168, 0, 0, 0.34) transparent;
}

.index-lage-notice-list.is-scrollable {
  max-height: min(44vh, 21rem);
  max-height: min(44dvh, 21rem);
}

.index-lage-notice-item {
  display: grid;
  gap: 0.18rem;
  padding: 0.72rem 0;
  border-bottom: 1px solid rgba(0, 0, 0, 0.08);
}

.index-lage-notice-item:last-child {
  border-bottom: 0;
}

.index-lage-notice-item-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
}

.index-lage-notice-item-head strong {
  min-width: 0;
  overflow-wrap: anywhere;
  color: #222;
  font-size: 1rem;
  font-weight: 850;
  line-height: 1.25;
}

.index-lage-notice-item-head span {
  flex: 0 0 auto;
  padding: 0.22rem 0.55rem;
  border-radius: 999px;
  background: #fff1f1;
  color: #a80000;
  font-size: 0.76rem;
  font-weight: 850;
  line-height: 1.2;
}

.index-lage-notice-item p,
.index-lage-notice-item small {
  margin: 0;
  color: #666;
  line-height: 1.35;
}

.index-lage-notice-item p {
  font-size: 0.88rem;
  font-weight: 700;
}

.index-lage-notice-item small {
  font-size: 0.78rem;
  font-weight: 600;
}

.index-lage-notice-actions {
  grid-template-columns: minmax(0, 1fr);
}

.index-lage-notice-sheet.is-open {
  transform: translate(-50%, var(--knt-bottom-sheet-drag-y, 0px));
}

@media (min-width: 520px) {
  .index-guest-sheet-fields {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .index-guest-sheet-field:last-child {
    grid-column: 1 / -1;
  }
}

@media (max-width: 640px) {
  .index-cart-sheet {
    left: 0;
    width: 100%;
    max-width: none;
    max-height: min(88vh, 680px);
    max-height: min(88dvh, 680px);
    padding: 1rem 1rem calc(0.85rem + env(safe-area-inset-bottom, 0px));
    border-width: 1px 0 0;
    transform: translateY(104%);
  }

  .index-cart-sheet.is-open {
    transform: translateY(0);
  }

  .index-lage-notice-sheet.is-open {
    transform: translateY(var(--knt-bottom-sheet-drag-y, 0px));
  }
}

@media (prefers-reduced-motion: reduce) {
  .index-cart-sheet,
  .index-cart-sheet-backdrop {
    transition: none;
  }
}