:root {
  --bg: #0f1419;
  --surface: #1a222c;
  --card: #222b36;
  --border: #2f3b4a;
  --text: #e8eef5;
  --muted: #9aa7b5;
  --accent: #3d8bfd;
  --mala-sidebar-active-accent: #c63838;
  --danger: #e35d6a;
  --ok: #3ecf8e;
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, Ubuntu, "Helvetica Neue", sans-serif;
}

* {
  box-sizing: border-box;
}

body {
  margin: 0;
  background: var(--bg);
  color: var(--text);
  min-height: 100vh;
  --app-sidebar-width: 15.5rem;
}

/* Nur Dashboard: fixe Sidebar, Scroll nur im Hauptbereich */
html.app-layout-root {
  height: 100%;
}

html.app-layout-root body.app-dashboard {
  height: 100%;
  overflow: hidden;
}

html[data-theme="light"] {
  --bg: #f0f2f5;
  --surface: #ffffff;
  --card: #fafbfc;
  --border: #cfd6df;
  --text: #141a22;
  --muted: #5a6572;
  --accent: #1a6ee6;
  --mala-sidebar-active-accent: #c42d3a;
  --danger: #c42d3a;
  --ok: #0d8f54;
}

html[data-theme="light"] .app-topbar {
  background: #ffffff;
  border-bottom-color: var(--border);
}

html[data-theme="light"] .app-sidebar {
  background: #e8eef3;
  border-right-color: #d0d8e3;
}

html[data-theme="light"] .btn.secondary {
  background: #e8ecf1;
  color: var(--text);
  border-color: var(--border);
}

html[data-theme="light"] .btn.danger {
  background: #fdecef;
  border-color: #e8a8b3;
  color: #8b1d2e;
}

html[data-theme="light"] .tkp-status-strip--header .tkp-pill--fill-crit {
  animation: tkp-pill-fill-crit-blink-light var(--tkp-header-pill-blink-period, 4s) linear infinite;
}

@keyframes tkp-pill-fill-crit-blink-light {
  0%,
  100% {
    background: rgba(200, 60, 60, 0.15);
    border-color: rgba(200, 80, 80, 0.45);
    color: #7a1515;
  }

  50% {
    background: rgba(220, 40, 40, 0.55);
    border-color: rgba(180, 40, 40, 0.75);
    color: #0a0a0a;
    box-shadow: 0 0 10px rgba(200, 40, 40, 0.35);
  }
}

html[data-theme="light"] .tkp-status-strip--header .tkp-pill--offline {
  animation: tkp-pill-offline-blink-light var(--tkp-header-pill-blink-period, 4s) linear infinite;
}

@keyframes tkp-pill-offline-blink-light {
  0%,
  100% {
    background: rgba(180, 100, 160, 0.12);
    border-color: rgba(160, 100, 140, 0.45);
    color: #5a2048;
  }

  50% {
    background: rgba(200, 80, 160, 0.45);
    border-color: rgba(140, 60, 120, 0.65);
    color: #0a0a0a;
    box-shadow: 0 0 10px rgba(180, 80, 150, 0.35);
  }
}

/* Hellmodus: Comboboxen, Header, Tabs, Tankbestände-Karten, Popover, Notizen */
html[data-theme="light"] select,
html[data-theme="light"] .tankstock-toolbar-select,
html[data-theme="light"] .tkp-toolbar-select,
html[data-theme="light"] .filter-toolbar select,
html[data-theme="light"] .filter-sort-select,
html[data-theme="light"] .trigger-toolbar-filters select,
html[data-theme="light"] .mengenkontrolle-select {
  background: #ffffff;
  color: var(--text);
  border-color: var(--border);
}

html[data-theme="light"] select option {
  background: #ffffff;
  color: #141a22;
}

html[data-theme="light"] .app-topbar .btn,
html[data-theme="light"] .app-topbar a.btn {
  color: var(--text);
}

html[data-theme="light"] .app-topbar a.btn:hover {
  color: var(--text);
}

html[data-theme="light"] .sidebar-nav-item.tab {
  color: var(--text);
}

html[data-theme="light"] .sidebar-nav-item.tab[aria-selected="true"] {
  background: #ffffff;
  color: #0d1f3a;
  box-shadow: inset 3px 0 0 var(--accent);
}

html[data-theme="light"] .date-toolbar .tab[aria-selected="true"] {
  background: #d4e4fc;
  color: #0d1f3a;
  border-color: var(--accent);
}

html[data-theme="light"] .filter-toolbar label,
html[data-theme="light"] .filter-inline-check {
  color: var(--text);
}

html[data-theme="light"] .tkp-header-popover {
  background: #fafbfc;
  box-shadow: 0 10px 28px rgba(0, 0, 0, 0.18);
}

html[data-theme="light"] .tkp-pop-tank-li {
  background: #eef1f5;
  border-color: #c5cdd8;
}

html[data-theme="light"] .tkp-pop-tank-li--warn {
  background: rgba(245, 200, 80, 0.35);
  border-color: rgba(200, 150, 40, 0.55);
}

html[data-theme="light"] .tkp-pop-tank-li--crit {
  background: rgba(240, 160, 150, 0.4);
  border-color: rgba(200, 90, 80, 0.55);
}

html[data-theme="light"] .tkp-pop-p--alert {
  color: #9a1e3c;
}

html[data-theme="light"] .tkp-pop-p--warnmsg {
  color: #7a5200;
}

html[data-theme="light"] .tkp-pop-p--prf-eich {
  color: #9a4500;
}

html[data-theme="light"] .tkp-pop-p--prf-tuv {
  color: #006b6f;
}

html[data-theme="light"] .product-popover-title {
  color: var(--text);
}

html[data-theme="light"] .product-popover-table tbody th {
  color: var(--text);
}

html[data-theme="light"] .product-popover-table td.ph-rank-cheapest {
  background: rgba(62, 207, 142, 0.2);
  color: #0d5c36;
}

html[data-theme="light"] .product-popover-table td.ph-rank-worst {
  background: rgba(227, 93, 106, 0.18);
  color: #8b1a24;
}

html[data-theme="light"] .tankstock-card {
  background: #f4f6f9;
  border-color: #c5cdd8;
}

html[data-theme="light"] .tankstock-tank {
  background: #e8ecf0;
  border-color: #b8c2cf;
}

html[data-theme="light"] .tankstock-tank-title {
  color: var(--text);
}

html[data-theme="light"] .tankstock-bar {
  background: #d4dae3;
  border-color: #aeb8c6;
}

html[data-theme="light"] .tankstock-error {
  color: #b4232f;
}

html[data-theme="light"] .tankstock-summary-table tbody tr:nth-child(even) {
  background: rgba(0, 0, 0, 0.03);
}

html[data-theme="light"] .tankstock-fs-card-hd {
  border-bottom-color: rgba(0, 0, 0, 0.08);
}

/* Hellmodus: Header-TK-Pills (schwarze Schrift), Tagespreise-Karten, Trigger-Bemerkung */
html[data-theme="light"] .tkp-status-strip--header .tkp-pill,
html[data-theme="light"] .tkp-status-strip--header .tkp-pill-label {
  color: #0a0a0a;
}

html[data-theme="light"] .mini-table thead th,
html[data-theme="light"] .mini-table tbody th {
  color: var(--text);
}

html[data-theme="light"] .mini-table tbody th .product-history-btn {
  background: #e4eefb;
  border-color: rgba(26, 110, 230, 0.42);
  color: #0a3d82;
}

html[data-theme="light"] .mini-table tbody th .product-history-btn:hover {
  background: #d0e3f8;
  border-color: rgba(26, 110, 230, 0.65);
  color: #062a5c;
}

html[data-theme="light"] .slot label {
  color: var(--text);
}

html[data-theme="light"] .slot input.cell-input-time {
  background: #eef1f5;
  color: #2a3545;
  border-color: #aeb8c6;
}

html[data-theme="light"] .slot input.cell-input--price:read-only {
  background: #eef1f5;
  color: #3a4555;
  border-color: #aeb8c6;
}

html[data-theme="light"] .trigger-inp,
html[data-theme="light"] .trigger-ta,
html[data-theme="light"] .trigger-sel {
  background: #ffffff;
  color: var(--text);
  border-color: var(--border);
}

html[data-theme="light"] .trigger-inp-red {
  color: #9a1e28;
}

html[data-theme="light"] .trigger-inp[readonly] {
  background: #eef1f5;
  color: #4a5568;
  border-color: #c5cdd8;
}

html[data-theme="light"] .trigger-sum-row td {
  background: #e8ecf0;
  color: var(--text);
}

html[data-theme="light"] .product-popover-table td.ph-rank-second {
  color: #5c4a00;
}

.auth-body {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1rem;
}

.auth-card {
  width: min(420px, 100%);
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 1.5rem;
}

.auth-brand {
  text-align: center;
  margin-bottom: 0.25rem;
}

.auth-brand-logo {
  display: block;
  margin: 0 auto 0.65rem;
  height: 3rem;
  width: auto;
  max-width: 11rem;
  object-fit: contain;
}

.auth-brand-title {
  margin: 0;
  font-size: 1.25rem;
  font-weight: 600;
  color: var(--text);
}

.auth-card--wide {
  width: min(480px, 100%);
  max-width: 100%;
}

.auth-h2 {
  margin: 0 0 0.5rem;
  font-size: 1rem;
  font-weight: 600;
}

.muted.small {
  font-size: 0.82rem;
  line-height: 1.4;
}

.checkbox-row {
  display: flex;
  gap: 0.5rem;
  align-items: flex-start;
  font-size: 0.85rem;
  color: var(--muted);
}

.checkbox-row input[type='checkbox'] {
  width: auto;
  margin-top: 0.2rem;
  flex-shrink: 0;
}

.totp-qr-wrap {
  margin: 0.5rem 0;
  text-align: center;
  min-height: 4rem;
}

.totp-qr-wrap img {
  max-width: 100%;
  height: auto;
  border-radius: 8px;
  border: 1px solid var(--border);
}

code.totp-secret {
  display: block;
  margin-top: 0.25rem;
  padding: 0.35rem 0.5rem;
  background: var(--surface);
  border-radius: 6px;
  font-size: 0.72rem;
  word-break: break-all;
  color: var(--text);
}

.stack {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

.stack label span {
  display: block;
  font-size: 0.85rem;
  color: var(--muted);
  margin-bottom: 0.25rem;
}

input[type="text"],
input[type="password"],
input[type="date"],
input[type="time"],
input:not([type]) {
  width: 100%;
  padding: 0.5rem 0.6rem;
  border-radius: 8px;
  border: 1px solid var(--border);
  background: var(--surface);
  color: var(--text);
}

.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.35rem;
  padding: 0.45rem 0.85rem;
  border-radius: 8px;
  border: 1px solid var(--border);
  background: var(--surface);
  color: var(--text);
  cursor: pointer;
  text-decoration: none;
  font-size: 0.95rem;
}

.btn.primary {
  background: var(--accent);
  border-color: transparent;
  color: #fff;
}

.btn.secondary {
  background: #2a3441;
}

.btn.ghost {
  background: transparent;
}

.btn-sm {
  padding: 0.28rem 0.5rem;
  font-size: 0.8rem;
}

.btn.danger {
  background: #3a2228;
  border-color: #6b2f3a;
  color: #ffb4bc;
}

.muted {
  color: var(--muted);
}

/* App-Shell: Seitenleiste + Hauptbereich (--app-sidebar-width auf body, nicht .app-shell) */
body.app-sidebar-collapsed {
  --app-sidebar-width: 4.25rem;
}

/* Compact icon navigation retains room for menu and footer controls. */
body.app-mala-oil.app-sidebar-collapsed {
  --app-sidebar-width: 4.5rem;
}

.app-shell {
  display: flex;
  align-items: stretch;
  height: 100%;
  max-height: 100%;
  min-height: 0;
  overflow: hidden;
}

.app-sidebar {
  flex: 0 0 var(--app-sidebar-width);
  width: var(--app-sidebar-width);
  min-width: var(--app-sidebar-width);
  max-width: var(--app-sidebar-width);
  height: 100%;
  min-height: 0;
  display: flex;
  flex-direction: column;
  background: #121820;
  border-right: 1px solid var(--border);
  position: relative;
  transform-origin: left center;
  overflow: hidden;
  transition:
    flex-basis 0.32s cubic-bezier(0.25, 0.82, 0.25, 1),
    width 0.32s cubic-bezier(0.25, 0.82, 0.25, 1),
    min-width 0.32s cubic-bezier(0.25, 0.82, 0.25, 1),
    max-width 0.32s cubic-bezier(0.25, 0.82, 0.25, 1),
    box-shadow 0.28s ease;
  z-index: 6;
}

/* Eingeklappt: schmale Leiste am linken Rand, Hauptbereich wächst nach rechts */
body.app-sidebar-collapsed .app-sidebar {
  box-shadow: 4px 0 14px rgba(0, 0, 0, 0.22);
}

body:not(.app-sidebar-collapsed) .app-sidebar {
  box-shadow: none;
}

.sidebar-topbar {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  gap: 0.45rem;
  padding: 0.5rem 0.55rem 0.45rem;
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

html[data-theme='light'] .sidebar-topbar {
  border-bottom-color: rgba(0, 0, 0, 0.08);
}

.sidebar-topbar .sidebar-brand {
  flex: 1;
  min-width: 0;
  padding: 0;
  border: none;
}

.sidebar-brand .header-logo {
  display: block;
  max-width: 100%;
  height: auto;
  max-height: 2.75rem;
  transition: max-width 0.22s ease, max-height 0.22s ease;
}

/* Eingeklappt: die lange Wortmarke macht Platz für die kompakte Icon-Leiste. */
body.app-mala-oil.app-sidebar-collapsed .sidebar-brand {
  display: none;
}

.sidebar-nav {
  flex: 1;
  min-height: 0;
  overflow-y: auto;
  overflow-x: hidden;
  padding: 0.55rem 0.4rem;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.sidebar-nav-item {
  display: flex;
  align-items: center;
  gap: 0.55rem;
  width: 100%;
  margin: 0;
  padding: 0.5rem 0.55rem;
  border: 1px solid transparent;
  border-radius: 8px;
  background: transparent;
  color: var(--text);
  font-size: 0.86rem;
  font-weight: 600;
  text-align: left;
  cursor: pointer;
  text-decoration: none;
  box-sizing: border-box;
  transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}

a.sidebar-nav-item,
a.sidebar-footer-link,
button.sidebar-footer-link {
  color: inherit;
}

button.sidebar-footer-link {
  width: 100%;
  margin: 0;
  font: inherit;
  text-align: left;
  cursor: pointer;
  border: none;
  background: transparent;
  appearance: none;
}

.sidebar-nav-item:hover {
  background: rgba(255, 255, 255, 0.06);
}

.sidebar-nav-item.tab[aria-selected="true"] {
  background: rgba(255, 255, 255, 0.1);
  border-color: rgba(61, 139, 253, 0.45);
  box-shadow: inset 3px 0 0 var(--accent);
}

.app-mala-oil .sidebar-nav-item[aria-current='page'] {
  background: rgba(255, 255, 255, 0.1);
  border-color: color-mix(in srgb, var(--mala-sidebar-active-accent) 55%, transparent);
  box-shadow: inset 3px 0 0 var(--mala-sidebar-active-accent);
}

html[data-theme='light'] .app-mala-oil .sidebar-nav-item[aria-current='page'] {
  background: rgba(0, 0, 0, 0.05);
  border-color: color-mix(in srgb, var(--mala-sidebar-active-accent) 45%, transparent);
}

/* mala Oil: Obermenü-Blöcke leicht hinterlegt; aktiver Unterpunkt farblich hervorgehoben */
.app-mala-oil .sidebar-nav-section {
  background: rgba(255, 255, 255, 0.045);
  border: 1px solid rgba(255, 255, 255, 0.09);
}

html[data-theme='light'] .app-mala-oil .sidebar-nav-section {
  background: rgba(0, 0, 0, 0.04);
  border-color: rgba(0, 0, 0, 0.08);
}

.app-mala-oil .sidebar-nav-section--current {
  border-color: color-mix(in srgb, var(--mala-sidebar-active-accent) 65%, transparent);
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--mala-sidebar-active-accent) 25%, transparent);
}

html[data-theme='light'] .app-mala-oil .sidebar-nav-section--current {
  border-color: color-mix(in srgb, var(--mala-sidebar-active-accent) 52%, transparent);
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--mala-sidebar-active-accent) 16%, transparent);
}

.app-mala-oil .sidebar-nav-item.sidebar-nav-item--sub[aria-current='page'] {
  background: color-mix(in srgb, var(--mala-sidebar-active-accent) 24%, transparent) !important;
  border-color: color-mix(in srgb, var(--mala-sidebar-active-accent) 75%, transparent) !important;
  color: #f0f6ff;
  box-shadow: inset 3px 0 0 color-mix(in srgb, var(--mala-sidebar-active-accent) 96%, transparent);
}

html[data-theme='light'] .app-mala-oil .sidebar-nav-item.sidebar-nav-item--sub[aria-current='page'] {
  background: color-mix(in srgb, var(--mala-sidebar-active-accent) 18%, transparent) !important;
  border-color: color-mix(in srgb, var(--mala-sidebar-active-accent) 55%, transparent) !important;
  color: inherit;
  box-shadow: inset 3px 0 0 color-mix(in srgb, var(--mala-sidebar-active-accent) 88%, transparent);
}

.sidebar-nav-icon--flip-rtl {
  transform: scaleX(-1);
}

.sidebar-nav-group-title {
  margin: 0.85rem 0.45rem 0.2rem;
  padding: 0 0.1rem;
  font-size: 0.65rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--muted);
  line-height: 1.2;
}

html[data-theme='light'] .sidebar-nav-group-title {
  color: rgba(55, 65, 81, 0.85);
}

.sidebar-nav-item--sub {
  padding-left: 1.15rem;
  font-size: 0.84rem;
  font-weight: 550;
}

body.app-sidebar-collapsed .sidebar-nav-group-title {
  display: none;
}

/* mala Oil: einklappbare Menübereiche (<details>) */
.sidebar-nav-section {
  margin: 0;
  border-radius: 8px;
}

.sidebar-nav-section-summary {
  display: flex;
  align-items: center;
  gap: 0.45rem;
  width: 100%;
  padding: 0.45rem 0.4rem;
  margin: 0;
  list-style: none;
  cursor: pointer;
  border-radius: 8px;
  color: var(--text);
  font-size: 0.86rem;
  font-weight: 600;
  box-sizing: border-box;
  background: rgba(255, 255, 255, 0.05);
  border: 1px solid rgba(255, 255, 255, 0.09);
}

.sidebar-nav-section-summary::-webkit-details-marker {
  display: none;
}

.sidebar-nav-section > summary {
  list-style: none;
}

.sidebar-nav-section > summary::marker {
  content: '';
}

.sidebar-nav-section-chevron {
  display: inline-flex;
  width: 1rem;
  flex-shrink: 0;
  transition: transform 0.15s ease;
  color: var(--muted);
}

.sidebar-nav-section:not([open]) .sidebar-nav-section-chevron {
  transform: rotate(180deg);
}

.sidebar-nav-section[open] .sidebar-nav-section-chevron {
  transform: rotate(90deg);
}

.sidebar-nav-section-summary:hover {
  background: rgba(255, 255, 255, 0.1);
}

html[data-theme='light'] .sidebar-nav-section-summary:hover {
  background: rgba(0, 0, 0, 0.08);
}

html[data-theme='light'] .sidebar-nav-section-summary {
  background: #dbe1e8;
  border: 1px solid rgba(0, 0, 0, 0.1);
}

.sidebar-nav-section-inner {
  padding: 0.15rem 0 0.45rem 0.35rem;
  display: flex;
  flex-direction: column;
  gap: 0.2rem;
}

body.app-sidebar-collapsed .sidebar-nav-section-summary .sidebar-nav-text,
body.app-sidebar-collapsed .sidebar-nav-section-chevron {
  display: none;
}

/* Eingeklappt: keine Interaktion auf Summary-Zeilen (vermeidet „leere“ Klicks) */
body.app-mala-oil.app-sidebar-collapsed .sidebar-nav-section > .sidebar-nav-section-summary {
  pointer-events: none;
}

body.app-sidebar-collapsed .sidebar-nav-section-inner {
  display: none !important;
}

.main-panel--mala-oil {
  padding: 1rem 1.25rem 1.5rem;
  flex: 1;
  min-height: 0;
  overflow: auto;
}

/* mala Oil Startseite: Begrüßung + Logo, mittig, responsiv */
.main-panel--mala-start {
  display: flex;
  flex-direction: column;
}

.main-panel--mala-start .mala-start-hero {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: clamp(1rem, 5vw, 2.75rem) clamp(0.75rem, 4vw, 1.5rem);
  box-sizing: border-box;
  min-height: min(72vh, 36rem);
}

.mala-start-welcome {
  margin: 0 0 clamp(0.85rem, 3.5vw, 1.5rem);
  font-size: clamp(1.45rem, 2.5vw + 0.85rem, 2.15rem);
  font-weight: 600;
  line-height: 1.2;
  letter-spacing: 0.02em;
  color: var(--text);
}

.mala-start-logo {
  max-width: min(92vw, 28rem);
  width: auto;
  height: auto;
  display: block;
  object-fit: contain;
}

@media (max-width: 480px) {
  .main-panel--mala-start .mala-start-hero {
    min-height: min(65vh, 28rem);
    padding-top: clamp(0.5rem, 4vw, 1.25rem);
  }

  .mala-start-welcome {
    font-size: clamp(1.25rem, 5.5vw + 0.5rem, 1.75rem);
  }
}

.app-mala-oil .app-main-column > .main-panel--tankstock,
.app-mala-oil .app-main-column > .main-panel--mengenkontrolle {
  flex: 1;
  min-height: 0;
  overflow: auto;
  display: flex;
  flex-direction: column;
}

.app-mala-oil.mala-stc-dashboard #main-panel-tagespreise {
  flex: 1;
  min-height: 0;
  overflow: auto;
  display: block;
}

.sidebar-nav-item--ghost {
  font-weight: 500;
  opacity: 0.95;
  margin-top: 0.45rem;
  padding-top: 0.65rem;
  border-top: 1px solid rgba(255, 255, 255, 0.08);
}

.sidebar-nav-icon {
  flex-shrink: 0;
  width: 1.35rem;
  height: 1.35rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--muted);
}

.sidebar-nav-icon svg {
  display: block;
}

.sidebar-nav-item[aria-selected="true"] .sidebar-nav-icon,
.sidebar-footer-btn:hover .sidebar-nav-icon,
.sidebar-footer-link:hover .sidebar-nav-icon {
  color: var(--accent);
}

.sidebar-nav-text {
  flex: 1;
  min-width: 0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  transition: opacity 0.18s ease, max-width 0.22s ease;
}

body.app-sidebar-collapsed .sidebar-nav-text {
  opacity: 0;
  max-width: 0;
  pointer-events: none;
}

body.app-sidebar-collapsed .sidebar-nav-icon {
  display: inline-flex;
}

/* Keep SVG navigation visible in the compact rail. */
body.app-mala-oil.app-sidebar-collapsed .sidebar-nav svg,
body.app-mala-oil.app-sidebar-collapsed .sidebar-footer svg {
  display: block;
}

body.app-mala-oil.app-sidebar-collapsed .sidebar-nav .sidebar-nav-icon {
  display: inline-flex;
}

/* User controls remain reachable in the compact rail. */
body.app-mala-oil.app-sidebar-collapsed .sidebar-footer {
  display: flex;
}

body.app-mala-oil.app-sidebar-collapsed .sidebar-topbar {
  justify-content: center;
  gap: 0;
  padding: 0.45rem 0.25rem;
}

body.app-mala-oil.app-sidebar-collapsed .sidebar-nav {
  padding-left: 0.25rem;
  padding-right: 0.25rem;
}

.sidebar-nav-item--sub .sidebar-nav-icon {
  display: none;
}

.sidebar-fav-toggle {
  margin-left: auto;
  width: 1.2rem;
  min-width: 1.2rem;
  height: 1.2rem;
  border: none;
  background: transparent;
  color: var(--muted);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  padding: 0;
  line-height: 1;
  font-size: 0.95rem;
}

.sidebar-fav-toggle:hover,
.sidebar-fav-toggle.is-active {
  color: var(--mala-sidebar-active-accent);
}

body.app-sidebar-collapsed .sidebar-fav-toggle {
  display: none;
}

.sidebar-nav-favorites .sidebar-nav-section-summary {
  font-weight: 700;
}

.sidebar-nav-empty-favorites {
  color: var(--muted);
  font-size: 0.8rem;
  padding: 0.4rem 0.55rem;
}

.sidebar-footer {
  flex-shrink: 0;
  padding: 0.55rem 0.4rem 0.65rem;
  border-top: 1px solid rgba(255, 255, 255, 0.08);
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
}

.sidebar-footer-btn {
  display: flex;
  align-items: center;
  gap: 0.55rem;
  width: 100%;
  margin: 0;
  padding: 0.42rem 0.55rem;
  border: 1px solid transparent;
  border-radius: 8px;
  background: transparent;
  color: var(--text);
  font-size: 0.82rem;
  font-weight: 600;
  text-align: left;
  cursor: pointer;
  transition: background 0.15s ease;
}

.sidebar-footer-btn:hover {
  background: rgba(255, 255, 255, 0.06);
}

.sidebar-footer-link {
  display: flex;
  align-items: center;
  gap: 0.55rem;
  padding: 0.42rem 0.55rem;
  border-radius: 8px;
  font-size: 0.82rem;
  font-weight: 600;
  transition: background 0.15s ease;
}

.sidebar-footer-link:hover {
  background: rgba(255, 255, 255, 0.06);
}

body.app-sidebar-collapsed .sidebar-footer-btn,
body.app-sidebar-collapsed .sidebar-footer-link {
  justify-content: center;
  padding-left: 0.4rem;
  padding-right: 0.4rem;
}

.sidebar-collapse {
  position: static;
  flex-shrink: 0;
  width: 2rem;
  height: 2rem;
  border-radius: 8px;
  border: 1px solid rgba(255, 255, 255, 0.12);
  background: rgba(0, 0, 0, 0.2);
  color: var(--muted);
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  transition: background 0.15s ease, color 0.15s ease, transform 0.22s ease;
}

.sidebar-collapse:hover {
  background: rgba(255, 255, 255, 0.08);
  color: var(--text);
}

body.app-sidebar-collapsed .sidebar-collapse-icon {
  transform: rotate(180deg);
}

.app-sidebar-overlay {
  display: none;
  position: fixed;
  inset: 0;
  z-index: 95;
  margin: 0;
  padding: 0;
  border: none;
  background: rgba(0, 0, 0, 0.48);
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.25s ease;
}

body.app-mobile-drawer-open .app-sidebar-overlay {
  display: block;
  opacity: 1;
  pointer-events: auto;
}

.btn-nav-mobile {
  display: none;
  align-items: center;
  justify-content: center;
  width: 2.55rem;
  height: 2.55rem;
  margin: 0;
  padding: 0;
  border: 1px solid rgba(255, 255, 255, 0.14);
  border-radius: 10px;
  background: rgba(0, 0, 0, 0.12);
  color: var(--text);
  cursor: pointer;
  flex-shrink: 0;
}

.btn-nav-mobile-icon {
  display: flex;
  align-items: center;
  justify-content: center;
}

.btn-nav-mobile-icon svg {
  display: block;
}

html[data-theme='light'] .btn-nav-mobile {
  border-color: var(--border);
  background: var(--surface);
}

@media (max-width: 768px) {
  .app-shell {
    display: block;
  }

  .app-sidebar {
    position: fixed;
    left: 0;
    top: 0;
    bottom: 0;
    height: 100vh;
    height: 100dvh;
    flex: none !important;
    width: var(--app-sidebar-width);
    min-width: var(--app-sidebar-width);
    max-width: none;
    transform: translateX(-100%);
    z-index: 100;
    transition: transform 0.28s ease, box-shadow 0.28s ease;
  }

  body.app-mobile-drawer-open .app-sidebar {
    transform: translateX(0);
    box-shadow: 8px 0 28px rgba(0, 0, 0, 0.42);
  }

  .app-main-column {
    width: 100%;
  }

  .btn-nav-mobile {
    display: inline-flex;
  }

  .app-topbar {
    z-index: 110;
    align-items: center;
  }

  /* Tankstellen-Pillen (TKST) im Header — auf schmalen Viewports ausblenden (außer dauerhaft sichtbar) */
  #tkp-header-status-wrap:not(.tkp-header-always-visible) {
    display: none !important;
  }
}

body.app-mala-oil #tkp-header-status-wrap.tkp-header-always-visible,
#tkp-header-status-wrap.tkp-header-always-visible {
  display: block;
  width: 100%;
  min-width: 0;
}

.tkp-header-loading {
  font-size: 0.72rem;
  padding: 0.35rem 0.5rem;
}

@media (min-width: 769px) {
  .app-sidebar-overlay {
    display: none !important;
    pointer-events: none !important;
  }
}

.app-main-column {
  flex: 1;
  min-width: 0;
  min-height: 0;
  height: 100%;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  background: var(--bg);
}

/* mala Oil SPA: nur Inhaltsbereich scrollt (Topbar + Sidebar fix) */
.app-mala-oil .mala-spa-content {
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}

.app-mala-oil .mala-spa-content > main.main-panel,
.app-mala-oil .mala-spa-content > .main-panel {
  flex: 1;
  min-height: 0;
  overflow-x: hidden;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}

.app-mala-oil .mala-spa-content > .main-panel--mala-oil,
.app-mala-oil .mala-spa-content > .main-panel--mala-start {
  overflow-x: hidden;
  overflow-y: auto;
}

.app-mala-oil .mala-spa-content > #main-panel-tagespreise,
.app-mala-oil .mala-spa-content > .main-panel--kontrakte,
.app-mala-oil .mala-spa-content > .main-panel--tankstock,
.app-mala-oil .mala-spa-content > .main-panel--mengenkontrolle {
  flex: 1;
  min-height: 0;
  overflow-x: hidden;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}

.app-topbar {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.75rem;
  padding: 0.65rem 1rem;
  border-bottom: 1px solid var(--border);
  background: #141b24;
  position: sticky;
  top: 0;
  z-index: 5;
}

.app-topbar-main {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem 1rem;
  min-width: 0;
  flex: 1;
}

.topbar-title-block {
  min-width: 0;
}

.topbar-kicker {
  margin: 0;
  font-size: 0.72rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--muted);
}

.topbar-page-title {
  margin: 0.1rem 0 0;
  font-size: 1.15rem;
  font-weight: 700;
  line-height: 1.25;
  color: var(--text);
}

.topbar-tkp-strip {
  flex: 1;
  min-width: 12rem;
  margin-top: 0;
}

.app-topbar-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem;
  flex-shrink: 0;
  align-self: center;
}

.app-topbar-theme {
  flex-shrink: 0;
}

.app-topbar-print {
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0.4rem 0.55rem;
  min-width: 2.35rem;
  min-height: 2.35rem;
}

.app-topbar-print-icon {
  display: inline-flex;
  color: var(--muted);
}

.app-topbar-print:hover .app-topbar-print-icon {
  color: var(--text);
}

.app-topbar-print-icon svg {
  display: block;
}

.app-panels-wrap {
  flex: 1;
  min-height: 0;
  overflow: auto;
  position: relative;
}

.header-brand {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  flex: 1;
  min-width: min(100%, 16rem);
}

.header-logo {
  flex-shrink: 0;
  height: 2.75rem;
  width: auto;
  max-width: 9.5rem;
  object-fit: contain;
  display: block;
}

.header-brand-text {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 0.15rem;
}

.header-brand-heading {
  margin: 0;
  font-size: 1.05rem;
  font-weight: 600;
  line-height: 1.25;
  color: var(--text);
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 0.35rem;
}

.header-brand-dashboard {
  font-weight: 600;
  color: var(--muted);
}

.header-brand-name {
  font-weight: 700;
  color: var(--text);
}

.header-brand-date {
  margin: 0;
  font-size: 0.82rem;
  color: var(--muted);
  line-height: 1.3;
}

.header-tkp-status {
  width: 100%;
  min-width: 0;
  margin-top: 0.4rem;
}

.header-mala-omr-wrap {
  width: 100%;
  min-width: 0;
  margin-top: 0.35rem;
}

.topbar-status-panel {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  gap: 0.35rem 0.5rem;
  width: 100%;
  min-width: 0;
  margin-top: 0.35rem;
}

.topbar-status-panel .topbar-status-toggle {
  flex-shrink: 0;
  font-size: 0.72rem;
  padding: 0.2rem 0.45rem;
  line-height: 1.3;
}

.topbar-status-panel-body {
  flex: 1;
  min-width: 12rem;
}

.topbar-status-panel--collapsed .topbar-status-panel-body {
  display: none;
}

.topbar-status-panel--collapsed .topbar-status-toggle::after {
  content: ' ▸';
  opacity: 0.75;
}

.topbar-status-panel:not(.topbar-status-panel--collapsed) .topbar-status-toggle::after {
  content: ' ▾';
  opacity: 0.75;
}

.mala-omr-status-strip {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  gap: 0.35rem 0.45rem;
  padding: 0.38rem 0.5rem;
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: 8px;
  font-size: 0.72rem;
  line-height: 1.35;
  max-width: 100%;
  box-sizing: border-box;
}

.mala-omr-slot {
  display: inline-flex;
  flex-direction: column;
  gap: 0.12rem;
  min-width: 0;
}

.mala-omr-slot-hd {
  font-weight: 600;
  font-size: 0.68rem;
  opacity: 0.92;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 15rem;
}

.mala-omr-slot-pills {
  display: flex;
  flex-wrap: wrap;
  gap: 0.22rem;
}

.mala-omr-pill {
  display: inline-flex;
  align-items: baseline;
  gap: 0.12rem;
  padding: 0.1rem 0.26rem;
  border-radius: 6px;
  border: 1px solid rgba(100, 150, 220, 0.42);
  background: rgba(50, 100, 180, 0.14);
  white-space: nowrap;
}

.mala-omr-pill-ab {
  font-size: 0.62rem;
  opacity: 0.88;
  text-transform: uppercase;
  letter-spacing: 0.02em;
}

.mala-omr-pill-val {
  font-weight: 700;
  font-size: 0.73rem;
}

.mala-omr-slot-sep {
  width: 1px;
  align-self: stretch;
  background: var(--border);
  margin: 0 0.1rem;
  min-height: 1.6rem;
}

.mala-omr-ref {
  align-self: center;
  font-size: 0.66rem;
  margin-right: 0.2rem;
}

.mala-omr-strip-empty {
  font-size: 0.74rem;
}

.mala-omr-prefs-table-wrap {
  overflow-x: auto;
  max-width: 100%;
  margin-top: 0.35rem;
}

.mala-omr-prefs-table select {
  min-width: 7.5rem;
  max-width: 16rem;
}

.mala-omr-prefs-cb {
  text-align: center;
  vertical-align: middle;
}

.mala-omr-prefs-inline-cb {
  display: flex;
  align-items: center;
  gap: 0.45rem;
}

.modal-panel--mala-omr-prefs {
  max-width: min(52rem, 96vw);
}

.modal-panel--mala-omr-f9 {
  max-width: min(38rem, 94vw);
  max-height: 86vh;
  overflow-y: auto;
}

.mala-omr-modal-slot {
  margin-top: 0.55rem;
  padding-top: 0.45rem;
  border-top: 1px solid var(--border);
}

.mala-omr-modal-slot-hd {
  margin: 0 0 0.35rem;
  font-size: 0.88rem;
}

.mala-omr-modal-lines {
  margin: 0;
  padding-left: 1.1rem;
  font-size: 0.82rem;
  line-height: 1.5;
}

.mala-omr-modal-lab {
  display: inline-block;
  min-width: 2.1rem;
  font-weight: 600;
  opacity: 0.85;
}

.mala-omr-modal-det {
  font-size: 0.78rem;
}

.mala-omr-pill--mtd {
  cursor: help;
}

.mala-omr-pill--tp {
  cursor: help;
}

.mala-omr-pill--tp-old {
  border-color: rgba(220, 180, 60, 0.75) !important;
  background: rgba(220, 180, 60, 0.2) !important;
}

.mala-omr-pill--alert {
  border-color: rgba(205, 75, 75, 0.85) !important;
  background: rgba(205, 75, 75, 0.24) !important;
}

.mala-omr-modal-lab.mala-omr-pill--mtd {
  cursor: help;
  text-decoration: underline dotted;
  text-underline-offset: 2px;
}

.mala-omr-modal-lab.mala-omr-pill--tp {
  cursor: help;
}

.mala-omr-modal-line--alert {
  background: rgba(205, 75, 75, 0.14);
  border-radius: 4px;
  padding: 0.08rem 0.24rem;
}

.mala-omr-modal-alert-note {
  color: #ffb7b7;
  font-size: 0.76rem;
}

.mala-omr-ref-alert-note {
  margin: 0.35rem 0 0.55rem;
  padding: 0.35rem 0.5rem;
  border-radius: 6px;
  border: 1px solid rgba(205, 75, 75, 0.58);
  background: rgba(205, 75, 75, 0.18);
  color: #ffd3d3;
  font-size: 0.8rem;
}

.mala-omr-ref-alert-cell {
  background: rgba(205, 75, 75, 0.16);
}

.mala-omr-ref-alert-mark {
  background: rgba(205, 75, 75, 0.2);
  border-radius: 4px;
  padding: 0.08rem 0.26rem;
}

html[data-theme="light"] .mala-omr-pill--alert {
  border-color: rgba(196, 45, 58, 0.72) !important;
  background: rgba(196, 45, 58, 0.16) !important;
}

html[data-theme="light"] .mala-omr-modal-line--alert {
  background: rgba(196, 45, 58, 0.11);
}

html[data-theme="light"] .mala-omr-modal-alert-note {
  color: #9a2431;
}

html[data-theme="light"] .mala-omr-ref-alert-note {
  border-color: rgba(196, 45, 58, 0.45);
  background: rgba(196, 45, 58, 0.12);
  color: #8f1d2c;
}

html[data-theme="light"] .mala-omr-ref-alert-cell {
  background: rgba(196, 45, 58, 0.11);
}

html[data-theme="light"] .mala-omr-ref-alert-mark {
  background: rgba(196, 45, 58, 0.14);
}

#mala-omr-mtd-popover.mala-omr-mtd-popover {
  position: fixed;
  z-index: 10050;
  box-sizing: border-box;
  max-width: min(36rem, 96vw);
  max-height: min(72vh, 34rem);
  overflow: auto;
  padding: 0.55rem 0.65rem;
  font-size: 0.78rem;
  line-height: 1.38;
  color: var(--text);
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: 6px;
  box-shadow: 0 10px 32px rgba(0, 0, 0, 0.38);
  pointer-events: auto;
}

.mala-omr-mtd-pop-hd {
  font-weight: 600;
  font-size: 0.82rem;
  margin-bottom: 0.15rem;
}

.mala-omr-mtd-pop-region {
  font-weight: 500;
}

.mala-omr-mtd-pop-src {
  font-size: 0.74rem;
  margin-bottom: 0.35rem;
}

.mala-omr-mtd-pop-basis {
  font-size: 0.76rem;
  margin: 0.25rem 0 0.35rem;
}

.mala-omr-mtd-pop-prodname {
  font-size: 0.74rem;
  margin-bottom: 0.35rem;
}

.mala-omr-mtd-pop-table {
  width: 100%;
  border-collapse: collapse;
  margin: 0.2rem 0 0.45rem;
  font-size: 0.74rem;
}

.mala-omr-mtd-pop-table th,
.mala-omr-mtd-pop-table td {
  border: 1px solid var(--border);
  padding: 0.18rem 0.32rem;
  text-align: right;
  vertical-align: top;
}

.mala-omr-mtd-pop-table th:first-child,
.mala-omr-mtd-pop-table td:first-child {
  text-align: left;
}

.mala-omr-mtd-th-basis,
.mala-omr-mtd-basiscell {
  background: rgba(120, 160, 220, 0.12);
}

.mala-omr-mtd-prodcell {
  text-align: left;
  max-width: 9rem;
  word-break: break-word;
}

.mala-omr-mtd-pop-foot {
  margin-top: 0.35rem;
  padding-top: 0.35rem;
  border-top: 1px solid var(--border);
  font-size: 0.76rem;
}

.mala-omr-mtd-formula {
  margin-top: 0.35rem;
  font-family: ui-monospace, monospace;
  font-size: 0.72rem;
  word-break: break-word;
}

html[data-theme="light"] .mala-omr-pill {
  color: #0a0a0a;
  border-color: rgba(40, 90, 160, 0.38);
  background: rgba(180, 210, 250, 0.35);
}

.tkp-status-strip--header {
  margin-bottom: 0;
  padding: 0.45rem 0.55rem;
  /* Langsame, lineare Wechsel: auf Terminalserver/RDP besser erkennbar als schnelles ease-in-out */
  --tkp-header-pill-blink-period: 4s;
  --tkp-header-pill-blink-period-3: 6s;
}

@keyframes tkp-pill-offline-blink {
  0%,
  100% {
    background: rgba(200, 90, 160, 0.22);
    border-color: rgba(240, 130, 200, 0.55);
    color: #ffd0f0;
    box-shadow: none;
  }

  50% {
    background: rgba(255, 60, 160, 0.78);
    border-color: rgba(255, 180, 230, 0.95);
    color: #fff;
    box-shadow: 0 0 14px rgba(255, 100, 200, 0.55);
  }
}

@keyframes tkp-pill-fill-crit-blink {
  0%,
  100% {
    background: rgba(200, 60, 60, 0.25);
    border-color: rgba(230, 100, 100, 0.6);
    color: #ffc8c8;
    box-shadow: none;
  }

  50% {
    background: rgba(220, 30, 30, 0.88);
    border-color: rgba(255, 140, 140, 0.95);
    color: #fff;
    box-shadow: 0 0 12px rgba(255, 60, 60, 0.5);
  }
}

.tkp-status-strip--header .tkp-pill--offline {
  background: rgba(200, 90, 160, 0.22);
  border-color: rgba(240, 130, 200, 0.55);
  color: #ffd0f0;
  animation: tkp-pill-offline-blink var(--tkp-header-pill-blink-period, 4s) linear infinite;
}

.tkp-pill--fill-warn {
  background: rgba(220, 170, 40, 0.28);
  border-color: rgba(240, 200, 90, 0.65);
  color: #ffe8a8;
}

.tkp-pill--fill-crit {
  background: rgba(200, 60, 60, 0.25);
  border-color: rgba(230, 100, 100, 0.6);
  color: #ffc8c8;
}

.tkp-status-strip--header .tkp-pill--fill-crit {
  animation: tkp-pill-fill-crit-blink var(--tkp-header-pill-blink-period, 4s) linear infinite;
}

@keyframes tkp-combo-warn-eich {
  0%,
  100% {
    background: rgba(220, 170, 40, 0.35);
    border-color: rgba(255, 160, 60, 0.85);
    color: #fff3d0;
  }
  50% {
    background: rgba(255, 140, 40, 0.82);
    border-color: rgba(255, 200, 120, 0.95);
    color: #1a1208;
  }
}

@keyframes tkp-combo-crit-eich {
  0%,
  100% {
    background: rgba(200, 60, 60, 0.35);
    border-color: rgba(255, 140, 60, 0.75);
    color: #ffe0d0;
  }
  50% {
    background: rgba(255, 120, 40, 0.88);
    border-color: rgba(255, 200, 140, 0.95);
    color: #1a0e06;
  }
}

@keyframes tkp-combo-offline-tuv {
  0%,
  100% {
    background: rgba(200, 90, 160, 0.28);
    border-color: rgba(240, 130, 200, 0.6);
    color: #ffd0f0;
  }
  50% {
    background: rgba(30, 180, 190, 0.55);
    border-color: rgba(120, 240, 245, 0.9);
    color: #062428;
  }
}

@keyframes tkp-combo-offline-eich {
  0%,
  100% {
    background: rgba(200, 90, 160, 0.28);
    border-color: rgba(240, 130, 200, 0.6);
    color: #ffd0f0;
  }
  50% {
    background: rgba(255, 140, 40, 0.75);
    border-color: rgba(255, 200, 120, 0.95);
    color: #1a1004;
  }
}

@keyframes tkp-combo-offline-eich-tuv {
  0%,
  100% {
    background: rgba(200, 90, 160, 0.26);
    border-color: rgba(230, 150, 210, 0.55);
    color: #ffe8f8;
  }
  33% {
    background: rgba(40, 170, 185, 0.5);
    border-color: rgba(140, 235, 240, 0.85);
    color: #042428;
  }
  66% {
    background: rgba(255, 130, 45, 0.72);
    border-color: rgba(255, 210, 130, 0.92);
    color: #1a0c02;
  }
}

@keyframes tkp-combo-online-eich {
  0%,
  100% {
    background: rgba(55, 130, 75, 0.35);
    border-color: rgba(255, 150, 50, 0.55);
    color: #e8ffe8;
  }
  50% {
    background: rgba(255, 130, 40, 0.78);
    border-color: rgba(255, 210, 120, 0.95);
    color: #1a0e04;
  }
}

@keyframes tkp-combo-online-tuv {
  0%,
  100% {
    background: rgba(55, 130, 75, 0.38);
    border-color: rgba(80, 200, 210, 0.55);
    color: #e0fffa;
  }
  50% {
    background: rgba(25, 165, 175, 0.72);
    border-color: rgba(150, 245, 250, 0.92);
    color: #031a1c;
  }
}

@keyframes tkp-combo-online-eich-tuv {
  0%,
  100% {
    background: rgba(55, 130, 75, 0.36);
    border-color: rgba(120, 200, 120, 0.5);
    color: #e8fff0;
  }
  50% {
    background: rgba(230, 120, 40, 0.45);
    border-color: rgba(40, 185, 195, 0.75);
    color: #0a1a12;
  }
}

@keyframes tkp-combo-warn-tuv {
  0%,
  100% {
    background: rgba(220, 170, 40, 0.32);
    border-color: rgba(80, 200, 210, 0.55);
    color: #fff8e0;
  }
  50% {
    background: rgba(35, 175, 185, 0.62);
    border-color: rgba(160, 245, 250, 0.9);
    color: #031a1c;
  }
}

@keyframes tkp-combo-crit-tuv {
  0%,
  100% {
    background: rgba(200, 60, 60, 0.32);
    border-color: rgba(70, 195, 205, 0.55);
    color: #ffe8e8;
  }
  50% {
    background: rgba(30, 170, 180, 0.65);
    border-color: rgba(150, 240, 245, 0.92);
    color: #031c1e;
  }
}

.tkp-status-strip--header .tkp-pill--combo-warn-eich {
  animation: tkp-combo-warn-eich var(--tkp-header-pill-blink-period, 4s) linear infinite;
}

.tkp-status-strip--header .tkp-pill--combo-warn-tuv {
  animation: tkp-combo-warn-tuv var(--tkp-header-pill-blink-period, 4s) linear infinite;
}

.tkp-status-strip--header .tkp-pill--combo-crit-tuv {
  animation: tkp-combo-crit-tuv var(--tkp-header-pill-blink-period, 4s) linear infinite;
}

.tkp-status-strip--header .tkp-pill--combo-crit-eich {
  animation: tkp-combo-crit-eich var(--tkp-header-pill-blink-period, 4s) linear infinite;
}

.tkp-status-strip--header .tkp-pill--combo-offline-tuv {
  animation: tkp-combo-offline-tuv var(--tkp-header-pill-blink-period, 4s) linear infinite;
}

.tkp-status-strip--header .tkp-pill--combo-offline-eich {
  animation: tkp-combo-offline-eich var(--tkp-header-pill-blink-period, 4s) linear infinite;
}

.tkp-status-strip--header .tkp-pill--combo-offline-eich-tuv {
  animation: tkp-combo-offline-eich-tuv var(--tkp-header-pill-blink-period-3, 6s) linear infinite;
}

.tkp-status-strip--header .tkp-pill--combo-online-eich {
  animation: tkp-combo-online-eich var(--tkp-header-pill-blink-period, 4s) linear infinite;
}

.tkp-status-strip--header .tkp-pill--combo-online-tuv {
  animation: tkp-combo-online-tuv var(--tkp-header-pill-blink-period, 4s) linear infinite;
}

.tkp-status-strip--header .tkp-pill--combo-online-eich-tuv {
  animation: tkp-combo-online-eich-tuv var(--tkp-header-pill-blink-period-3, 6s) linear infinite;
}

.tkp-pop-tank-li--nopeil {
  border-left: 3px solid rgba(160, 170, 190, 0.55);
}

.tkp-header-popover {
  position: fixed;
  z-index: 90;
  max-width: 22.5rem;
  max-height: min(70vh, 28rem);
  overflow-y: auto;
  padding: 0.65rem 0.8rem;
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: 10px;
  box-shadow: 0 10px 32px rgba(0, 0, 0, 0.55);
  font-size: 0.8rem;
  line-height: 1.45;
  color: var(--text);
  pointer-events: auto;
}

.tkp-header-popover[hidden] {
  display: none !important;
}

.tkp-pop-hd {
  font-weight: 700;
  margin: 0 0 0.5rem;
  font-size: 0.92rem;
}

.tkp-pop-section {
  margin: 0.45rem 0 0;
  padding-top: 0.45rem;
  border-top: 1px solid var(--border);
}

.tkp-pop-section:first-of-type {
  border-top: none;
  padding-top: 0;
  margin-top: 0;
}

.tkp-pop-sub {
  font-weight: 600;
  font-size: 0.78rem;
  color: var(--muted);
  margin: 0 0 0.35rem;
}

.tkp-pop-p {
  margin: 0 0 0.35rem;
}

.tkp-pop-p--alert {
  color: #ffb8d8;
}

.tkp-pop-p--warnmsg {
  color: #ffe8a8;
}

.tkp-pop-p--prf-eich {
  font-weight: 600;
  color: #ffc978;
}

.tkp-pop-p--prf-tuv {
  font-weight: 600;
  color: #7ee8ea;
}

.tkp-pop-code {
  font-size: 0.72rem;
  word-break: break-all;
}

.tkp-pop-tanks {
  list-style: none;
  margin: 0;
  padding: 0;
}

.tkp-pop-tank-li {
  margin: 0 0 0.5rem;
  padding: 0.45rem 0.5rem;
  border-radius: 8px;
  background: rgba(0, 0, 0, 0.14);
  border: 1px solid rgba(255, 255, 255, 0.07);
}

.tkp-pop-tank-li:last-child {
  margin-bottom: 0;
}

.tkp-pop-tank-li--warn {
  background: rgba(220, 170, 40, 0.14);
  border-color: rgba(240, 200, 90, 0.38);
}

.tkp-pop-tank-li--crit {
  background: rgba(200, 60, 60, 0.2);
  border-color: rgba(230, 100, 100, 0.45);
}

.tkp-pop-tank-h {
  font-weight: 600;
  margin-bottom: 0.35rem;
}

.tkp-pop-tank-body {
  display: flex;
  gap: 0.65rem;
  align-items: stretch;
}

.tkp-pop-bar-col.tankstock-bar-col {
  flex-shrink: 0;
}

.tkp-pop-bar-col .tkp-pop-tank-bar.tankstock-bar {
  height: 72px;
  width: 26px;
}

.tkp-pop-fill-caption {
  text-align: center;
  line-height: 1.25;
  max-width: 4.2rem;
}

.tkp-pop-tank-grid {
  flex: 1;
  min-width: 0;
  display: grid;
  grid-template-columns: minmax(5.5rem, 7.5rem) 1fr;
  gap: 0.15rem 0.5rem;
  font-size: 0.76rem;
  color: var(--muted);
}

.tkp-pop-tank-grid span:nth-child(even) {
  color: var(--text);
  font-variant-numeric: tabular-nums;
}

/* Kein prefers-reduced-motion für Header-TKST-Pillen: Terminalserver/RDP meldet oft
   „reduzierte Bewegung“, wodurch operative Status-Blinker unsichtbar wären. */

.title {
  margin: 0;
  font-size: 1.15rem;
}

.header-actions {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  flex-wrap: wrap;
}

.user-pill {
  font-size: 0.85rem;
  color: var(--muted);
  border: 1px solid var(--border);
  padding: 0.2rem 0.55rem;
  border-radius: 999px;
}

.main-view-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
  margin-top: 0.85rem;
}

.main-view-tab {
  font-weight: 600;
}

.main-view-tab-extra {
  align-self: center;
  margin-left: 0.15rem;
  font-weight: 600;
}

.main-panel--kontrakte {
  padding: 0.75rem 1rem 1.25rem;
  max-width: 1600px;
  width: 100%;
  margin: 0 auto;
  box-sizing: border-box;
}

.lieferanten-kontrakte-root {
  width: 100%;
}

.lk-toolbar {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem 0.75rem;
  align-items: flex-end;
  margin-bottom: 0.75rem;
}

.lk-stack-inline {
  min-width: 10rem;
  margin: 0;
}

.lk-main {
  display: grid;
  grid-template-columns: minmax(0, 1fr) min(22rem, 100%);
  gap: 1rem;
  align-items: start;
}

@media (max-width: 960px) {
  .lk-main {
    grid-template-columns: 1fr;
  }
}

.lk-table-wrap {
  overflow: auto;
  border: 1px solid var(--border);
  border-radius: 8px;
}

.lk-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.82rem;
}

.lk-table th,
.lk-table td {
  border-bottom: 1px solid var(--border);
  padding: 0.35rem 0.45rem;
  text-align: left;
  vertical-align: middle;
}

.lk-table th {
  font-weight: 600;
  background: rgba(255, 255, 255, 0.04);
}

.lk-neg {
  color: #ff8a8a;
  font-weight: 600;
}

.lk-pos {
  color: #6ecf6e;
  font-weight: 600;
}

.lk-inp {
  width: 100%;
  max-width: 7rem;
  padding: 0.25rem 0.35rem;
  font-size: 0.82rem;
}

.lk-cards {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

.lk-card {
  border: 1px solid var(--border);
  border-radius: 8px;
  padding: 0.65rem 0.75rem;
  background: var(--surface);
}

.lk-card-title {
  margin: 0 0 0.45rem;
  font-size: 0.92rem;
}

.lk-card-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.8rem;
}

.lk-card-table th {
  text-align: left;
  font-weight: 600;
  padding: 0.2rem 0.35rem 0.2rem 0;
  vertical-align: top;
}

.lk-card-table td {
  padding: 0.2rem 0.35rem;
}

.admin-acl-matrix-wrap {
  overflow-x: auto;
  max-width: 100%;
  -webkit-overflow-scrolling: touch;
}

.admin-acl-matrix {
  width: 100%;
  min-width: 36rem;
  border-collapse: collapse;
  font-size: 0.86rem;
}

.admin-acl-matrix th,
.admin-acl-matrix td {
  border: 1px solid var(--border);
  padding: 0.3rem 0.45rem;
  vertical-align: middle;
}

.admin-acl-matrix thead th {
  background: rgba(255, 255, 255, 0.05);
}

.admin-acl-th-export,
.admin-acl-td-export {
  min-width: 6.5rem;
  background: rgba(120, 160, 220, 0.08);
}

.admin-acl-matrix-all th {
  font-weight: 600;
}

.lk-month-vol-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.78rem;
  margin-top: 0.15rem;
}

.lk-month-vol-table th,
.lk-month-vol-table td {
  border: 1px solid var(--border);
  padding: 0.3rem 0.4rem;
  text-align: left;
  vertical-align: middle;
}

.lk-month-vol-table thead th {
  font-weight: 600;
  background: rgba(255, 255, 255, 0.04);
}

.lk-mv-num {
  text-align: right;
  white-space: nowrap;
}

.lk-mv-min {
  color: #f43f5e;
  font-weight: 600;
}

.lk-mv-plus {
  color: #2dd4bf;
  font-weight: 600;
}

.lk-dtp-pos {
  color: #22c55e;
  font-weight: 600;
}

.lk-dtp-neg {
  color: #ef4444;
  font-weight: 600;
}

.lk-row-actions {
  white-space: nowrap;
}

.lk-row-actions .btn-sm {
  margin-right: 0.25rem;
}

.modal-panel--lk-compact {
  width: min(22rem, calc(100% - 1.25rem));
  max-width: calc(100vw - 1.25rem);
}

.modal-panel--lk-new-day {
  width: min(380px, calc(100% - 2rem));
  max-width: min(380px, calc(100% - 2rem));
}

.lk-card-sub {
  padding-left: 0.75rem !important;
}

.lk-form .stack {
  margin-bottom: 0.5rem;
}

.lk-row2 {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.5rem;
}

.lk-pick-ul {
  list-style: none;
  margin: 0;
  padding: 0;
  max-height: 40vh;
  overflow: auto;
}

.lk-pick-li {
  display: flex;
  align-items: center;
  gap: 0.35rem;
  margin-bottom: 0.35rem;
}

.modal-panel--audit {
  width: min(1100px, calc(100% - 1.25rem));
  max-width: calc(100vw - 1.25rem);
  max-height: min(92vh, 900px);
}

/* Wie Tankbestände / Mengenkontrolle: zentriert, Rand über max-width + Padding */
.main-panel--tkst {
  padding: 0.75rem 1rem 1.25rem;
  max-width: 1400px;
  width: 100%;
  margin: 0 auto;
  box-sizing: border-box;
}

.tankstellenpreise-root {
  min-height: 4rem;
}

.tankstellenpreise-inner {
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
}

.tankstellenpreise-error {
  color: #ffb4bc;
  margin: 0;
}

.tkp-toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.65rem 1rem;
  margin: 0 0 0.65rem;
}

.tkp-toolbar-label {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  font-size: 0.85rem;
  color: var(--muted, #a8b0bc);
}

.tkp-toolbar-select {
  min-width: 14rem;
  max-width: 100%;
}

.tkp-hint {
  font-size: 0.78rem;
  margin: 0 0 0.75rem;
  line-height: 1.35;
}

.tkp-view-wrap {
  width: 100%;
  min-width: 0;
}

.tkp-table-scroll {
  width: 100%;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  margin-top: 0.35rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: var(--surface);
}

.tkp-data-table {
  table-layout: fixed;
  width: 100%;
  min-width: 58rem;
  border-collapse: collapse;
  font-size: 0.82rem;
}

.tkp-data-table th,
.tkp-data-table td {
  box-sizing: border-box;
  padding: 0.45rem 0.55rem;
  border-bottom: 1px solid var(--border);
  vertical-align: middle;
}

.tkp-data-table thead th {
  font-weight: 600;
  color: #e8eef5;
  background: rgba(0, 0, 0, 0.2);
}

.tkp-th-prod {
  text-align: right;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.tkp-th-st {
  text-align: right;
  font-variant-numeric: tabular-nums;
}

.tkp-th-name {
  text-align: left;
  overflow: hidden;
  text-overflow: ellipsis;
}

.tkp-td-num {
  text-align: right;
  font-variant-numeric: tabular-nums;
  color: var(--muted, #a8b0bc);
}

.tkp-td-name {
  overflow-wrap: anywhere;
  word-wrap: break-word;
  hyphens: auto;
}

.tkp-td-price {
  text-align: right;
  font-variant-numeric: tabular-nums;
  font-weight: 600;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.tkp-price--min {
  color: #ff8a8a;
}

.tkp-price--max {
  color: #7ee787;
}

.tkp-table-empty {
  margin: 0.5rem 0 0;
}

.tkp-meta {
  font-size: 0.78rem;
  margin: 0 0 0.65rem;
}

.tkp-status-strip {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem;
  align-items: center;
  margin-bottom: 1rem;
  padding: 0.55rem 0.65rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: var(--surface);
}

.tkp-pill {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 2.6rem;
  padding: 0.35rem 0.55rem;
  border-radius: 8px;
  font-size: 0.78rem;
  font-weight: 700;
  border: 1px solid transparent;
}

.tkp-pill-tk {
  font-variant-numeric: tabular-nums;
}

.tkp-pill-label {
  font-variant-numeric: tabular-nums;
  max-width: 6.5rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* Kein animation:inherit auf dem Label: sonst zeigen manche Browser/RDP-Sessions den Wechsel nicht; Farbe kommt vom Parent. */
.tkp-status-strip--header .tkp-pill .tkp-pill-label {
  animation: none;
}

.tkp-pill--placeholder {
  background: rgba(140, 150, 170, 0.15);
  border-color: rgba(170, 180, 200, 0.35);
  color: var(--muted);
  cursor: default;
}

.tkp-pill--nopeil {
  background: rgba(140, 150, 170, 0.22);
  border-color: rgba(170, 180, 200, 0.45);
  color: #d8dce6;
}

.tkp-pill--online {
  background: rgba(100, 180, 90, 0.22);
  border-color: rgba(120, 200, 110, 0.55);
  color: #c8f0c0;
}

.tkp-pill--offline {
  background: rgba(200, 80, 80, 0.2);
  border-color: rgba(230, 120, 120, 0.55);
  color: #ffc8c8;
}

/* Bis zu 3 Karten pro Zeile; kleinere Preis-Schrift passt in schmalere Spalten */
.tkp-cards {
  display: grid;
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1rem;
  align-items: stretch;
}

@media (max-width: 1180px) {
  .tkp-cards {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 720px) {
  .tkp-cards {
    grid-template-columns: 1fr;
  }
}

.tkp-card {
  min-width: 0;
  width: 100%;
  max-width: 100%;
  border: 1px solid var(--border);
  border-radius: 14px;
  background: var(--surface);
  padding: 0.75rem 0.85rem;
  display: flex;
  flex-direction: column;
  box-sizing: border-box;
}

.tkp-card-head {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: space-between;
  gap: 0.35rem 0.75rem;
  margin-bottom: 0.65rem;
  padding-bottom: 0.5rem;
  border-bottom: 1px solid var(--border);
}

.tkp-card-title {
  margin: 0;
  font-size: 1rem;
  font-weight: 600;
  line-height: 1.25;
  min-width: 0;
}

.tkp-card-tk {
  font-size: 0.8rem;
}

.tkp-card-body {
  display: flex;
  flex-direction: column;
  flex: 1;
  min-width: 0;
}

.tkp-card-empty {
  margin: 0;
  font-size: 0.85rem;
}

/* Produkte gleich breit über Kartenbreite — keine 14rem-Kappung der Preise */
.tkp-matrix {
  --tkp-cols: 1;
  display: grid;
  grid-template-columns: repeat(var(--tkp-cols), minmax(0, 1fr));
  gap: 0.5rem 1rem;
  align-items: end;
  justify-items: center;
  width: 100%;
  min-width: 0;
  box-sizing: border-box;
}

.tkp-matrix-col {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-end;
  gap: 0.4rem;
  min-width: 0;
  width: 100%;
  max-width: none;
  text-align: center;
}

.tkp-name {
  display: block;
  color: #f5f5f5;
  font-size: 1.02rem;
  font-weight: 600;
  line-height: 1.25;
  word-wrap: break-word;
  overflow-wrap: break-word;
  hyphens: auto;
  max-width: 100%;
}

.tkp-price-wrap {
  display: flex;
  justify-content: center;
  width: 100%;
  min-width: 0;
}

.tkp-flip-row {
  display: inline-flex;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: center;
  gap: 2px;
  line-height: 1;
  max-width: 100%;
}

.tkp-flip-row--price .tkp-flip-seg {
  font-size: 1.18rem;
  padding: 0.18rem 0.22rem;
  min-width: 0.85em;
}

.tkp-flip-seg {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-family: ui-monospace, "Cascadia Mono", "Consolas", "Courier New", monospace;
  font-weight: 700;
  border-radius: 4px;
  border: 1px solid #3a3a3a;
  background: linear-gradient(180deg, #2d2d2d 0%, #141414 55%, #0c0c0c 100%);
  color: #ffffff;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.85);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.08),
    inset 0 -2px 5px rgba(0, 0, 0, 0.5);
}

.tkp-flip-sp {
  display: inline-block;
  width: 0.35rem;
  flex-shrink: 0;
}

@media (max-width: 520px) {
  .tkp-flip-row--price .tkp-flip-seg {
    font-size: 1rem;
    padding: 0.14rem 0.18rem;
  }

  .tkp-name {
    font-size: 0.92rem;
  }
}

.date-toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: 0.75rem;
  margin-top: 0.75rem;
}

.date-controls--inline {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.45rem;
}

.date-picker-inline {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
}

.date-picker-weekday {
  font-size: 0.82rem;
  font-weight: 600;
  color: var(--muted);
  min-width: 2rem;
  text-transform: capitalize;
}

.date-controls--inline .btn-date-step {
  min-width: 2.1rem;
  padding-left: 0.35rem;
  padding-right: 0.35rem;
  font-size: 1.1rem;
  line-height: 1;
}

.tagespreise-toolbar-merge {
  align-items: center;
}

.tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem;
}

.tab {
  border: 1px solid var(--border);
  background: var(--surface);
  color: var(--text);
  padding: 0.35rem 0.6rem;
  border-radius: 999px;
  font-size: 0.85rem;
  cursor: pointer;
}

.tab[aria-selected="true"] {
  border-color: var(--accent);
  background: #1e2a3d;
}

.date-controls {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  align-items: flex-end;
}

.date-label span {
  display: block;
  font-size: 0.8rem;
  color: var(--muted);
  margin-bottom: 0.2rem;
}

#tagespreise-header-tools {
  --tp-toolbar-left-pad: clamp(0.65rem, 2.2vw, 1.5rem);
}

.live-bar {
  margin: 0.5rem 0 0;
  font-size: 0.8rem;
  color: var(--muted);
}

/* Statuszeile bündig unter „Heute“ (gleicher Einzug wie Datumszeile) */
#tagespreise-header-tools > .live-bar {
  margin-inline-start: var(--tp-toolbar-left-pad);
}

.live-bar.ok {
  color: var(--ok);
}

.filter-toolbar {
  margin-top: 0.65rem;
}

.filter-toolbar-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem 1rem;
}

.filter-quick-group {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.35rem;
}

.filter-quick-btn {
  padding: 0.32rem 0.55rem;
  font-size: 0.82rem;
  min-height: 0;
}

.filter-quick-btn.is-active {
  background: var(--accent);
  border-color: transparent;
  color: #fff;
}

/* Hellmodus: .btn.secondary überschreibt sonst die aktive Schnellwahl */
html[data-theme='light'] .filter-toolbar .btn.secondary.filter-quick-btn.is-active {
  background: var(--accent);
  border-color: var(--accent);
  color: #fff;
}

html[data-theme='light'] .filter-toolbar .btn.secondary.filter-quick-btn.is-active:hover {
  filter: brightness(0.95);
}

.tagespreise-toolbar-merge .date-controls--tagespreise-toolbar {
  margin-inline-start: var(--tp-toolbar-left-pad, clamp(0.65rem, 2.2vw, 1.5rem));
}

.filter-quick-group--fuel .filter-quick-btn {
  min-width: 2.35rem;
  padding-left: 0.38rem;
  padding-right: 0.38rem;
}

.filter-toolbar label {
  font-size: 0.88rem;
  color: #fff;
  font-weight: 500;
}

.filter-inline-check {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  font-size: 0.88rem;
  color: #fff;
  font-weight: 500;
  cursor: pointer;
  user-select: none;
}

.filter-inline-check input {
  width: auto;
  margin: 0;
  flex-shrink: 0;
}

.filter-toolbar select {
  min-width: 14rem;
  max-width: 100%;
  padding: 0.45rem 0.65rem;
  border-radius: 8px;
  border: 1px solid var(--border);
  background: var(--surface);
  color: var(--text);
  font-size: 0.92rem;
}

.filter-toolbar .filter-sort-select {
  min-width: 12.5rem;
}

.filter-empty {
  text-align: center;
  padding: 2rem 1rem;
  color: var(--muted);
  font-size: 0.95rem;
}

.app-main {
  padding: 0.75rem;
  max-width: 100%;
  margin: 0 auto;
  box-sizing: border-box;
}

@media (max-width: 600px) {
  .app-main {
    padding: 0.5rem;
  }
}

/* Tagespreise: Karten max. 390px, nebeneinander bis zur Viewport-Breite */
.grid-blocks {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(min(100%, 390px), 390px));
  gap: 0.75rem;
  justify-content: center;
  align-items: start;
}

/* Horizontale Ansicht: Kartenbreite ~ Anzahl Produktblöcke; mehrere Karten nebeneinander (wrap) */
.app-main[data-tp-layout='horizontal'] .grid-blocks {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 0.75rem;
  width: 100%;
  max-width: 100%;
}

.app-main[data-tp-layout='horizontal'] .block-card {
  width: max-content;
  max-width: 100%;
  flex: 0 1 auto;
  min-width: 0;
  margin: 0;
}

.app-main[data-tp-layout='horizontal'] .block-head-row--horizontal {
  width: fit-content;
  max-width: 100%;
  /* stretch: Notiz-Spalte wird so hoch wie der Lieferantenblock → kein Leerraum unter der Notiz */
  align-items: stretch;
  justify-content: flex-start;
  gap: 0.65rem 1rem;
}

.app-main[data-tp-layout='horizontal'] .block-head-titles--horiz {
  flex: 0 0 auto;
  min-width: 0;
  max-width: 11rem;
  align-self: flex-start;
}

.app-main[data-tp-layout='horizontal'] .block-note-wrap {
  flex: 0 1 11rem;
  min-width: min(7rem, 100%);
  max-width: min(13rem, 38vw);
  align-self: stretch;
  display: flex;
  flex-direction: column;
  min-height: 0;
  max-height: 50px;
}

.app-main[data-tp-layout='horizontal'] .block-note-wrap textarea.block-note-input {
  flex: 1 1 auto;
  min-height: 2.4rem;
}

.app-main[data-tp-layout='horizontal'] .block-note-wrap .block-note-meta {
  flex-shrink: 0;
}

/* Weniger Freiraum zwischen Notiz und Bereich „Eingaben · Uhrzeit / Preis …“ */
.app-main[data-tp-layout='horizontal'] .block-card > .block-head {
  width: fit-content;
  max-width: 100%;
  box-sizing: border-box;
  padding-bottom: 0.1rem;
  padding-top: 0.45rem;
  gap: 0;
  border-bottom: none;
	max-height: 60px;
}

.app-main[data-tp-layout='horizontal'] .mini-table--horiz {
  width: fit-content;
  max-width: 100%;
  margin-top: 0;
  box-sizing: border-box;
}

.tp-layout-toggle {
  font-size: 0.82rem;
  padding: 0.28rem 0.5rem;
}

.block-lieferant-text {
  flex: 1 1 9rem;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 0.15rem;
}

.block-head-history-btn {
  font-size: 0.72rem;
  padding: 0.15rem 0.4rem;
  min-height: 1.55rem;
  line-height: 1.2;
  white-space: nowrap;
}

.mini-table--horiz .mini-table-th-horiz {
  text-align: left;
  font-weight: 600;
  font-size: 0.82rem;
  padding-top: 0.15rem;
  padding-bottom: 0.3rem;
  line-height: 1.25;
}

.mini-table--horiz td.slot-cell--horiz-products-wrap {
  padding: 0.4rem 0.4rem 0.5rem;
  vertical-align: top;
}

.block-horiz-products-row {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: flex-start;
  gap: 0.65rem 0.85rem;
  width: fit-content;
  max-width: 100%;
  box-sizing: border-box;
}

.block-horiz-product-bundle {
  flex: 0 1 auto;
  min-width: 0;
  padding: 0.4rem 0.5rem;
  border-radius: 10px;
  /* Dunkelmodus: etwas heller als die Karte, Blöcke besser erkennbar */
  background: rgba(255, 255, 255, 0.09);
  border: 1px solid rgba(255, 255, 255, 0.14);
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
}

html[data-theme='light'] .block-horiz-product-bundle {
  background: rgba(0, 0, 0, 0.03);
  border-color: var(--border);
}

.block-horiz-product-bundle-head {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.35rem 0.45rem;
  width: 100%;
  padding-bottom: 0.35rem;
  margin-bottom: 0.1rem;
  border-bottom: 1px solid rgba(255, 255, 255, 0.14);
}

html[data-theme='light'] .block-horiz-product-bundle-head {
  border-bottom-color: rgba(0, 0, 0, 0.1);
}

.block-horiz-product-bundle-title {
  font-size: 0.85rem;
  font-weight: 600;
  line-height: 1.25;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 12rem;
}

/* Pro Produkt: Zeit/Preis-Spalten nebeneinander (nicht untereinander) */
.mini-table--horiz .slot-grid--horiz-inline {
  display: flex !important;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: flex-start;
  gap: 0.45rem;
  width: auto;
  min-width: 0;
}

.mini-table--horiz .slot-grid--horiz-inline .slot {
  flex: 0 0 auto;
}

@media (max-width: 520px) {
  .mini-table--horiz .slot-grid--horiz-inline {
    flex-wrap: wrap;
  }
}

@media (max-width: 720px) {
  .app-main[data-tp-layout='horizontal'] .block-head-row--horizontal {
    flex-direction: column;
    align-items: stretch;
  }

  .app-main[data-tp-layout='horizontal'] .block-head-titles--horiz,
  .app-main[data-tp-layout='horizontal'] .block-note-wrap {
    flex: 1 1 auto;
    max-width: none;
    justify-content: flex-start;
  }
}

.block-card {
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: 12px;
  overflow: hidden;
  width: 100%;
  max-width: 330px;
  margin: 0 auto;
  justify-self: center;
}

.block-head {
  padding: 0.55rem 0.75rem;
  border-bottom: 1px solid var(--border);
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
}

.block-head-row {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.5rem 0.75rem;
}

.block-head-titles {
  flex: 1 1 auto;
  min-width: 7rem;
  display: flex;
  flex-direction: column;
  gap: 0.15rem;
}

.block-note-wrap {
  flex: 1 1 12rem;
  max-width: 22rem;
  min-width: 8rem;
  display: flex;
  flex-direction: column;
  gap: 0.2rem;
}

textarea.block-note-input {
  box-sizing: border-box;
  width: 100%;
  
  min-height: 3.2rem;
  font-size: 0.85rem;
  line-height: 1.35;
  padding: 0.4rem 0.45rem;
  border-radius: 8px;
  border: 1px solid var(--border);
  background: var(--surface);
  color: #d97a5c;
  resize: vertical;
  touch-action: manipulation;
}

textarea.block-note-input::placeholder {
  color: rgba(217, 122, 92, 0.5);
}

textarea.block-note-input:focus {
  outline: 2px solid var(--accent);
  outline-offset: 1px;
}

textarea.block-note-input:read-only {
  cursor: not-allowed;
  background: #1e2630;
  color: rgba(217, 122, 92, 0.65);
  border-color: #3a4656;
}

html[data-theme="light"] textarea.block-note-input {
  color: #9a3412;
  background: #fffdfb;
  border-color: #e0c8bc;
}

html[data-theme="light"] textarea.block-note-input::placeholder {
  color: rgba(154, 52, 18, 0.45);
}

html[data-theme="light"] textarea.block-note-input:read-only {
  background: #f2ebe8;
  color: #7c2d12;
  border-color: #d4c4bd;
}

.block-note-meta {
  font-size: 0.65rem;
  color: var(--muted);
}

.block-title {
  font-weight: 600;
  font-size: 0.95rem;
}

.block-sub {
  font-size: 0.8rem;
  color: var(--muted);
}

.c-green {
  border-left: 4px solid #3ecf8e;
}
.c-pink {
  border-left: 4px solid #ff7eb3;
}
.c-yellow {
  border-left: 4px solid #ffd56a;
}
.c-blue {
  border-left: 4px solid #6ab0ff;
}
.c-orange {
  border-left: 4px solid #ffb86b;
}
.c-teal {
  border-left: 4px solid #5ee0d0;
}
.c-purple {
  border-left: 4px solid #c79bff;
}
.c-gray {
  border-left: 4px solid #9aa7b5;
}

.mini-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.78rem;
}

.mini-table th,
.mini-table td {
  border-top: 1px solid var(--border);
  padding: 0.35rem 0.4rem;
  vertical-align: top;
}

.mini-table td.slot-cell {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

.mini-table thead th {
  color: #fff;
  font-weight: 600;
  font-size: 0.82rem;
}

.mini-table tbody th {
  text-align: left;
  color: #fff;
  font-weight: 600;
  font-size: 1.05rem;
  line-height: 1.35;
  width: auto;
  min-width: 4.5rem;
}

.mini-table tbody th.product-cell {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0.35rem;
  vertical-align: top;
}

.mini-table tbody th .product-name {
  line-height: 1.3;
}

.mini-table tbody th .product-history-btn {
  flex-shrink: 0;
  margin: 0;
  padding: 0.12rem 0.4rem;
  font-size: 0.65rem;
  font-weight: 600;
  letter-spacing: 0.02em;
  line-height: 1.2;
  color: var(--accent);
  background: rgba(30, 42, 61, 0.85);
  border: 1px solid rgba(106, 176, 255, 0.45);
  border-radius: 6px;
  cursor: help;
  font-family: inherit;
}

.mini-table tbody th .product-history-btn:hover {
  background: rgba(40, 56, 82, 0.95);
  border-color: rgba(106, 176, 255, 0.75);
  color: #8ec8ff;
}

/* Produkt-Hover: Preisvergleich letzte Werktage */
.product-popover {
  z-index: 200;
  max-width: min(96vw, 52rem);
  padding: 0.55rem 0.65rem;
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: 10px;
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.45);
  font-size: 0.78rem;
  color: var(--text);
  pointer-events: auto;
}

.product-popover[hidden] {
  display: none !important;
}

.product-popover-title {
  font-weight: 600;
  font-size: 0.82rem;
  margin-bottom: 0.45rem;
  color: #fff;
}

.product-popover-scroll {
  overflow-x: auto;
  max-width: 100%;
}

.product-popover-table {
  border-collapse: collapse;
  width: 100%;
  min-width: 280px;
}

.product-popover-table th,
.product-popover-table td {
  border: 1px solid var(--border);
  padding: 0.3rem 0.45rem;
  text-align: right;
  white-space: nowrap;
}

.product-popover-table thead th {
  color: var(--muted);
  font-weight: 600;
  font-size: 0.72rem;
  text-align: center;
}

.product-popover-table tbody th {
  text-align: left;
  color: #fff;
  font-weight: 500;
  max-width: 9rem;
  overflow: hidden;
  text-overflow: ellipsis;
}

.product-popover-loading,
.product-popover-empty,
.product-popover-error {
  margin: 0;
  padding: 0.35rem 0.15rem;
  font-size: 0.82rem;
}

.product-popover-error {
  color: #e35d6a;
}

.product-popover-table td.ph-rank-cheapest {
  background: rgba(62, 207, 142, 0.22);
  color: #b8f0d0;
  font-weight: 600;
}

.product-popover-table td.ph-rank-second {
  background: rgba(255, 213, 106, 0.18);
  box-shadow: inset 0 0 0 1px rgba(255, 213, 106, 0.35);
}

.product-popover-table td.ph-rank-worst {
  background: rgba(227, 93, 106, 0.2);
  color: #ffb3bc;
  font-weight: 600;
}

@media (min-width: 700px) {
  .mini-table tbody th {
    width: 22%;
  }
}

.slot-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0.65rem;
  width: 100%;
}

@media (min-width: 480px) {
  .slot-grid {
    grid-template-columns: repeat(2, minmax(6.25rem, auto));
    width: 100%;
    min-width: min(100%, 14rem);
  }
}

@media (min-width: 900px) {
  .slot-grid {
    grid-template-columns: repeat(4, minmax(5.75rem, auto));
    width: max-content;
    max-width: 100%;
    min-width: min(100%, 26rem);
  }
}

@media (min-width: 1200px) {
  .slot-grid {
    grid-template-columns: repeat(4, minmax(3.75rem, auto));
    min-width: min(100%, 26rem);
  }
}

.slot {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
  min-width: 4.5rem;
  max-width: 4.5rem;
}

.slot label {
  font-size: 0.72rem;
  color: #fff;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  font-weight: 500;
}

.slot input.cell-input-time,
.slot input.cell-input--price {
  box-sizing: border-box;
  width: 5.5rem;
  min-width: 4rem;
  max-width: 4rem;
  min-height: 2.5rem;
  font-size: 0.95rem;
  line-height: 1.3;
  padding: 0.4rem 0.45rem;
  border-radius: 8px;
  border: 1px solid var(--border);
  background: var(--surface);
  color: var(--text);
  touch-action: manipulation;
}

.slot input.cell-input-time {
  cursor: default;
  background: #1e2630;
  color: var(--muted);
  border-color: #3a4656;
  pointer-events: none;
  user-select: none;
}

.slot input.cell-input--price:focus {
  outline: 2px solid var(--accent);
  outline-offset: 1px;
}

.slot input.cell-input--price:read-only {
  cursor: not-allowed;
  background: #1e2630;
  color: var(--muted);
  border-color: #3a4656;
}

.modal-msg-pre {
  white-space: pre-wrap;
  font-family: inherit;
  font-size: 0.9rem;
  margin: 0 0 0.75rem;
  max-height: 14rem;
  overflow: auto;
}

.meta {
  font-size: 0.65rem;
  color: var(--muted);
  margin-top: 0.15rem;
}

.meta-user {
  font-size: 0.72rem;
  color: var(--accent);
  font-weight: 500;
}

.slot.slot--rank-cheapest {
  padding: 3px;
  margin: -3px;
  border-radius: 10px;
  animation: slot-rank-green-pulse 1.4s ease-in-out infinite;
}

.slot.slot--rank-second {
  padding: 3px;
  margin: -3px;
  border-radius: 10px;
  box-shadow: 0 0 0 2px rgba(255, 213, 106, 0.65);
}

.slot.slot--rank-worst {
  padding: 3px;
  margin: -3px;
  border-radius: 10px;
  box-shadow: 0 0 0 2px rgba(227, 93, 106, 0.75);
}

@keyframes slot-rank-green-pulse {
  0%,
  100% {
    box-shadow: 0 0 0 1px rgba(140, 220, 170, 0.45);
  }
  50% {
    box-shadow: 0 0 0 3px rgba(62, 207, 142, 0.75), 0 0 14px rgba(62, 207, 142, 0.25);
  }
}

@media (prefers-reduced-motion: reduce) {
  .slot.slot--rank-cheapest {
    animation: none;
    box-shadow: 0 0 0 2px rgba(62, 207, 142, 0.55);
  }
}

/* Modal */
.modal-root[hidden] {
  display: none !important;
}

.modal-root {
  position: fixed;
  inset: 0;
  z-index: 200;
}

.modal-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.55);
}

.modal-panel {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  width: min(880px, calc(100% - 2rem));
  max-height: min(80vh, 640px);
  overflow: auto;
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 1rem;
  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.45);
}

.modal-panel--wide {
  width: min(560px, calc(100% - 2rem));
}

.mala-evatr-modal.modal-panel--wide {
  width: min(640px, calc(100% - 2rem));
  max-height: min(90vh, 720px);
  overflow: auto;
}

.mala-evatr-modal__pre {
  margin: 0 0 0.75rem;
  padding: 0.65rem 0.75rem;
  font-size: 0.78rem;
  line-height: 1.35;
  white-space: pre-wrap;
  word-break: break-word;
  background: var(--bg-muted, rgba(0, 0, 0, 0.06));
  border: 1px solid var(--border);
  border-radius: 8px;
  max-height: 240px;
  overflow: auto;
}

.mala-evatr-modal--ok .mala-evatr-modal__ok {
  margin: 0 0 0.75rem;
  padding: 0.5rem 0.65rem;
  border-radius: 8px;
  background: rgba(34, 160, 80, 0.18);
  border: 1px solid rgba(34, 160, 80, 0.45);
  color: var(--text, inherit);
  font-weight: 600;
}

.mala-evatr-modal.mala-evatr-modal--form {
  width: min(720px, calc(100% - 2rem));
  max-height: min(92vh, 860px);
}

.mala-evatr-modal__field {
  margin-bottom: 0.65rem;
}

.mala-evatr-modal__field label {
  display: block;
  font-size: 0.78rem;
  color: var(--muted, #888);
  margin-bottom: 0.2rem;
}

.mala-evatr-modal__field input,
.mala-evatr-modal__field select {
  width: 100%;
  box-sizing: border-box;
}

.mala-evatr-modal__field input[readonly] {
  opacity: 0.85;
}

.mala-evatr-modal__inline-msg {
  margin: 0.5rem 0;
  font-size: 0.85rem;
  color: var(--danger, #c44);
}

.mala-evatr-modal__statusline {
  margin: 0.25rem 0 0.5rem;
}

.mala-evatr-modal__badge {
  display: inline-flex;
  align-items: center;
  padding: 0.2rem 0.45rem;
  border-radius: 999px;
  font-size: 0.74rem;
  font-weight: 700;
  border: 1px solid var(--border);
}

.mala-evatr-modal__badge--ok {
  background: rgba(34, 160, 80, 0.24);
  border-color: rgba(34, 160, 80, 0.5);
}

.mala-evatr-modal__badge--fail {
  background: rgba(200, 60, 60, 0.24);
  border-color: rgba(200, 60, 60, 0.5);
}

.mala-evatr-modal__debug {
  margin: 0.45rem 0;
}

.mala-evatr-modal__debug summary {
  cursor: pointer;
  font-size: 0.82rem;
  color: var(--muted, #888);
}

.mala-kunden-field.mala-ust-field--ok input,
.mala-kunden-field.mala-ust-field--ok select {
  border-color: rgba(34, 160, 80, 0.7);
  background: rgba(34, 160, 80, 0.1);
}

.mala-kunden-field.mala-kunden-field--err input,
.mala-kunden-field.mala-kunden-field--err select,
.mala-kunden-field.mala-kunden-field--err textarea {
  border-color: rgba(200, 60, 60, 0.74);
  background: rgba(200, 60, 60, 0.12);
}

.mala-kunden-field.mala-ust-field--err input,
.mala-kunden-field.mala-ust-field--err select {
  border-color: rgba(200, 60, 60, 0.74);
  background: rgba(200, 60, 60, 0.12);
}

.stack.mala-iban-field--ok input,
.mala-kunden-field.mala-iban-field--ok input {
  border-color: rgba(34, 160, 80, 0.7);
  background: rgba(34, 160, 80, 0.1);
}

.stack.mala-iban-field--err input,
.mala-kunden-field.mala-iban-field--err input {
  border-color: rgba(200, 60, 60, 0.74);
  background: rgba(200, 60, 60, 0.12);
}

.mala-iban-hint {
  display: block;
  margin-top: 0.2rem;
  font-size: 0.78rem;
  line-height: 1.3;
}

.mala-iban-hint--ok {
  color: rgba(34, 160, 80, 0.95);
}

.mala-iban-hint--err {
  color: rgba(200, 60, 60, 0.95);
}

.mala-evatr-erg-wrap {
  margin: 0.75rem 0;
}

.mala-evatr-erg {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.82rem;
}

.mala-evatr-erg td {
  padding: 0.4rem 0.5rem;
  border-bottom: 1px solid var(--border, rgba(0, 0, 0, 0.12));
}

.mala-evatr-erg__code {
  font-weight: 700;
  text-align: right;
  width: 3rem;
}

.mala-evatr-erg--a td {
  background: rgba(34, 160, 80, 0.2);
}

.mala-evatr-erg--b td {
  background: rgba(200, 60, 60, 0.22);
}

.mala-evatr-erg--c td {
  background: rgba(200, 160, 40, 0.18);
}

.mala-evatr-erg--d td {
  background: rgba(120, 120, 130, 0.2);
}

.mala-evatr-erg__legend {
  margin: 0.4rem 0 0;
  font-size: 0.75rem;
  line-height: 1.35;
}

.modal-panel--admin-wide {
  width: min(1040px, calc(100% - 1.25rem));
  max-height: min(92vh, 900px);
}

.modal-panel--settings {
  width: min(440px, calc(100% - 2rem));
}

.modal-panel--admin-user-password {
  width: min(380px, calc(100% - 2rem));
  max-height: min(70vh, 520px);
}

.login-hours-block {
  margin-top: 0.55rem;
  padding-top: 0.45rem;
  border-top: 1px solid var(--border);
}

.login-hours-grid {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
}

.login-hours-row {
  display: grid;
  grid-template-columns: 5.5rem 1fr 1fr;
  gap: 0.45rem;
  align-items: center;
}

.login-hours-day {
  margin: 0;
  white-space: nowrap;
}

.input-time {
  width: 100%;
  padding: 0.35rem 0.45rem;
  border-radius: 8px;
  border: 1px solid var(--border);
  background: var(--surface);
  color: var(--text);
  font: inherit;
}

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.modal-msg {
  margin: 0 0 1rem;
  line-height: 1.45;
}

.modal-msg-html {
  margin: 0 0 1rem;
  line-height: 1.45;
}

.modal-panel--price-warn {
  width: min(520px, calc(100% - 2rem));
  max-width: min(520px, calc(100% - 2rem));
  scrollbar-gutter: stable;
}

.price-ref-samples {
  padding-right: 0.35rem;
  box-sizing: border-box;
}

.price-ref-samples-tbl {
  width: 100%;
  max-width: 100%;
  table-layout: fixed;
  border-collapse: collapse;
  font-size: 0.86rem;
  box-sizing: border-box;
}

.price-ref-samples-tbl td {
  padding: 0.28rem 0;
  vertical-align: baseline;
  border-bottom: 1px solid var(--border);
  box-sizing: border-box;
}

.price-ref-samples-lab {
  width: 62%;
  max-width: 62%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  padding-right: 0.65rem;
}

.price-ref-samples-price {
  width: 38%;
  min-width: 6.75rem;
  text-align: right;
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
  padding-left: 0.65rem;
  padding-right: 0.15rem;
}

.price-ref-samples-slot {
  opacity: 0.82;
  font-size: 0.9em;
}

.price-ref-samples-dot {
  margin-right: 0.15rem;
  opacity: 0.65;
}

.modal-actions {
  display: flex;
  justify-content: flex-end;
  gap: 0.5rem;
}

.modal-actions--dialog {
  flex-wrap: wrap;
  justify-content: stretch;
}

.modal-actions--dialog .btn {
  flex: 1 1 auto;
  min-width: 9rem;
}

.modal-panel--omr-import {
  width: min(480px, calc(100% - 2rem));
  max-width: min(480px, calc(100% - 2rem));
}

.admin-user-row {
  padding: 0.5rem 0;
  border-bottom: 1px solid var(--border);
  font-size: 0.9rem;
}

.admin-user-main {
  display: flex;
  flex-direction: column;
  gap: 0.45rem;
  width: 100%;
}

.admin-user-actions {
  display: flex;
  gap: 0.35rem;
  flex-wrap: wrap;
}

.admin-form {
  display: grid;
  gap: 0.5rem;
  margin-top: 0.75rem;
}

/* Triggerliste Monat */
.main-panel--trigger {
  padding: 0.75rem 1rem 1.5rem;
  max-width: 100%;
}

.trigger-list-root {
  max-width: 100%;
}

.trigger-toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem 0.75rem;
  margin-bottom: 0.65rem;
}

.trigger-toolbar-filters {
  margin-top: -0.35rem;
  margin-bottom: 0.5rem;
}

.trigger-toolbar-filters label {
  font-size: 0.85rem;
  color: var(--text);
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
}

.trigger-toolbar-filters select {
  padding: 0.3rem 0.45rem;
  border-radius: 8px;
  border: 1px solid var(--border);
  background: var(--surface);
  color: var(--text);
  font-size: 0.85rem;
  max-width: 18rem;
}

.trigger-month-label {
  font-size: 0.88rem;
  color: var(--text);
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
}

.trigger-month-input {
  padding: 0.35rem 0.5rem;
  border-radius: 8px;
  border: 1px solid var(--border);
  background: var(--surface);
  color: var(--text);
  font-size: 0.9rem;
}

.trigger-list-title {
  margin: 0 0 0.65rem;
  font-size: 1.1rem;
  font-weight: 600;
  color: var(--text);
}

.trigger-table-scroll {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  border: 1px solid var(--border);
  border-radius: 10px;
  background: var(--surface);
}

.trigger-table {
  border-collapse: collapse;
  font-size: 0.78rem;
  min-width: 1500px;
  width: 100%;
}

.trigger-table th,
.trigger-table td {
  border: 1px solid var(--border);
  padding: 0.25rem 0.35rem;
  vertical-align: top;
}

.trigger-table thead th {
  background: var(--card);
  color: var(--text);
  font-weight: 600;
  white-space: nowrap;
  position: sticky;
  top: 0;
  z-index: 1;
}

.trigger-th-red,
.trigger-col-red {
  color: #ff8a8a;
}

.trigger-th-num {
  text-align: right;
}

.trigger-td-num {
  text-align: right;
}

.trigger-sum-row .trigger-td-num {
  font-variant-numeric: tabular-nums;
}

.trigger-inp {
  box-sizing: border-box;
  width: 100%;
  min-width: 4rem;
  max-width: 9rem;
  padding: 0.25rem 0.35rem;
  border-radius: 6px;
  border: 1px solid var(--border);
  background: #141a22;
  color: var(--text);
  font-size: 0.78rem;
}

.trigger-inp-num {
  text-align: right;
  font-variant-numeric: tabular-nums;
}

.trigger-inp-red {
  color: #ffb3b3;
}

.trigger-ta {
  box-sizing: border-box;
  width: 100%;
  min-width: 10rem;
  max-width: 20rem;
  padding: 0.3rem 0.35rem;
  border-radius: 6px;
  border: 1px solid var(--border);
  background: #141a22;
  color: var(--text);
  font-size: 0.78rem;
  resize: vertical;
}

.trigger-sel {
  max-width: 18rem;
  min-width: 12rem;
  padding: 0.3rem 0.35rem;
  border-radius: 6px;
  border: 1px solid var(--border);
  background: #141a22;
  color: var(--text);
  font-size: 0.75rem;
}

.trigger-td-liefer {
  min-width: 34rem;
}

.trigger-liefer-wrap {
  display: flex;
  flex-direction: column;
  gap: 0.3rem;
}

.trigger-rowline {
  display: flex;
  align-items: center;
  gap: 0.35rem;
  flex-wrap: wrap;
}

.trigger-rowline-second {
  margin-top: 0.1rem;
}

.trigger-mini-label {
  font-size: 0.65rem;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: 0.03em;
}

.trigger-liefer-hint {
  font-size: 0.68rem;
  color: var(--muted);
  margin-top: 0.1rem;
  white-space: nowrap;
}

.trigger-meta-combo {
  font-size: 0.72rem;
  color: var(--muted);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 18rem;
}

.trigger-kundenname-col {
  min-width: 16rem;
}

.trigger-kundenname-wrap {
  display: flex;
  align-items: center;
  gap: 0.35rem;
}

.trigger-kundenname-inp {
  max-width: 22rem;
  min-width: 12rem;
}

.trigger-kunden-search-btn {
  min-width: 2.1rem;
  padding-left: 0.35rem;
  padding-right: 0.35rem;
}

.trigger-customer-modal {
  max-width: min(95vw, 76rem);
  max-height: 82vh;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}

.trigger-customer-search-row {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

.trigger-customer-search-row input {
  flex: 1;
}

.trigger-customer-results-wrap {
  flex: 1;
  min-height: 0;
  overflow: auto;
  border: 1px solid var(--line);
  border-radius: 0.45rem;
}

.trigger-customer-results-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.83rem;
}

.trigger-customer-results-table th,
.trigger-customer-results-table td {
  border-bottom: 1px solid var(--line);
  padding: 0.35rem 0.45rem;
  vertical-align: top;
}

.trigger-customer-results-table thead th {
  position: sticky;
  top: 0;
  z-index: 1;
  background: #202a38;
}

.trigger-customer-sub {
  margin-top: 0.15rem;
  color: var(--muted);
  font-size: 0.76rem;
}

.trigger-customer-act {
  white-space: nowrap;
}

.trigger-ta-inline {
  min-width: 14rem;
  max-width: 24rem;
}

.trigger-ta.trigger-bemerkung--filled {
  border-color: #d4a82a;
  box-shadow: 0 0 0 1px rgba(212, 168, 42, 0.65);
}

.trigger-date {
  min-width: 8.5rem;
  max-width: 9.5rem;
}

.trigger-td-actions {
  white-space: nowrap;
}

.trigger-btn-save.trigger-btn-save--pending {
  background: #6b5a1f;
  border-color: #d4a82a;
  color: #fff8e0;
}

.trigger-inp.trigger-field--error,
.trigger-ta.trigger-field--error,
.trigger-sel.trigger-field--error {
  border-color: #e35d6a !important;
  box-shadow: 0 0 0 1px rgba(227, 93, 106, 0.55);
}

.trigger-inp[readonly] {
  background: #1e2630;
  color: var(--muted);
}

.trigger-inp-neg {
  border-color: #e35d6a !important;
  box-shadow: 0 0 0 1px rgba(227, 93, 106, 0.4);
}

.trigger-sum-row td {
  background: #1a2230;
  font-size: 0.8rem;
  color: #dfe7f2;
}

.trigger-row--dirty .trigger-inp,
.trigger-row--dirty .trigger-ta,
.trigger-row--dirty .trigger-sel {
  outline: 1px dashed rgba(61, 139, 253, 0.45);
}

/* Tankkarten */
.main-panel--tankkarten {
  padding: 0.75rem 1rem 1.25rem;
}

.tankkarten-root {
  min-height: 12rem;
  max-width: 1280px;
  margin: 0 auto;
}

.tankkarten-toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: end;
  gap: 0.35rem 0.45rem;
  margin-bottom: 0.55rem;
  padding-left: 0.35rem;
}

.tankkarten-toolbar label {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
  font-size: 0.79rem;
}

.tankkarten-search {
  min-width: 0;
  flex: 0 0 auto;
  margin-left: 0.25rem;
}

.tankkarten-customer-wrap {
  display: flex;
  align-items: center;
  gap: 0.35rem;
}

.tankkarten-customer-wrap input {
  flex: 1;
  max-width: 200px;
}

.tankkarten-search input,
.tankkarten-toolbar select {
  min-height: 2rem;
}

.tankkarten-quick {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem;
  margin-bottom: 0.45rem;
}

.tankkarten-summary {
  font-size: 0.79rem;
  margin: 0.15rem 0 0.45rem;
}

.tankkarten-selected-customer {
  margin: 0.2rem 0 0.35rem;
  font-size: 0.79rem;
}

.tankkarten-local-filter {
  padding-left: 0.35rem;
  margin: 0.1rem 0 0.35rem;
}

.tankkarten-local-filter label {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
  font-size: 0.79rem;
}

.tankkarten-local-filter-wrap {
  display: flex;
  align-items: center;
  gap: 0.45rem;
}

.tankkarten-local-filter-wrap input {
  max-width: 260px;
  min-height: 2rem;
}

.tankkarten-loading {
  height: 4px;
  border-radius: 99px;
  background: rgba(255, 255, 255, 0.08);
  overflow: hidden;
  margin: 0.2rem 0 0.55rem;
}

.tankkarten-loading-bar {
  width: 36%;
  height: 100%;
  background: linear-gradient(90deg, #2f74ff, #73a4ff);
  animation: tankkarten-loading 900ms linear infinite;
}

@keyframes tankkarten-loading {
  0% { transform: translateX(-120%); }
  100% { transform: translateX(320%); }
}

.tankkarten-table-wrap {
  border: 1px solid var(--line);
  border-radius: 0.5rem;
  overflow: auto;
}

.tankkarten-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.82rem;
  table-layout: fixed;
}

.tankkarten-table th,
.tankkarten-table td {
  border-bottom: 1px solid var(--line);
  padding: 0.35rem 0.45rem;
  vertical-align: top;
}

.tankkarten-table thead th {
  position: sticky;
  top: 0;
  z-index: 1;
  background: #202a38;
  text-align: left;
}

.tankkarten-table th:nth-child(1),
.tankkarten-table td:nth-child(1) {
  width: 6.5rem;
}

.tankkarten-table th:nth-child(3),
.tankkarten-table td:nth-child(3) {
  width: 9rem;
}

.tankkarten-table th:nth-child(4),
.tankkarten-table td:nth-child(4) {
  width: 8rem;
}

.tankkarten-table th:nth-child(6),
.tankkarten-table td:nth-child(6) {
  width: 6.5rem;
}

.tankkarten-table td:nth-child(2),
.tankkarten-table td:nth-child(5) {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.tankkarten-row--free {
  background: #183123;
}

.tankkarten-row--blocked {
  background: #3a1f24;
}

/* Tankbestände */
.main-panel--tankstock {
  padding: 0.75rem 1rem 1.25rem;
  max-width: 1400px;
  margin: 0 auto;
}

.tankstock-root {
  min-height: 12rem;
}

.tankstock-inner {
  padding: 0.25rem 0;
}

.tankstock-toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem 0.75rem;
  margin-bottom: 0.65rem;
}

.tankstock-toolbar .date-controls--tankstock-toolbar {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
}

.tankstock-toolbar .filter-quick-group {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.35rem;
}

.tankstock-toolbar .filter-quick-btn {
  padding: 0.32rem 0.55rem;
  font-size: 0.82rem;
  min-height: 0;
}

.tankstock-toolbar .filter-quick-group--fuel .filter-quick-btn {
  min-width: 2.35rem;
  padding-left: 0.38rem;
  padding-right: 0.38rem;
}

.tankstock-toolbar .filter-quick-btn.is-active {
  background: var(--accent);
  border-color: transparent;
  color: #fff;
}

html[data-theme='light'] .tankstock-toolbar .btn.secondary.filter-quick-btn.is-active {
  background: var(--accent);
  border-color: var(--accent);
  color: #fff;
}

html[data-theme='light'] .tankstock-toolbar .btn.secondary.filter-quick-btn.is-active:hover {
  filter: brightness(0.95);
}

.tankstock-toolbar .tankstock-fill-quick-btn.is-active {
  background: var(--accent);
  border-color: transparent;
  color: #fff;
}

html[data-theme='light'] .tankstock-toolbar .btn.secondary.tankstock-fill-quick-btn.is-active {
  background: var(--accent);
  border-color: var(--accent);
  color: #fff;
}

html[data-theme='light'] .tankstock-toolbar .btn.secondary.tankstock-fill-quick-btn.is-active:hover {
  filter: brightness(0.95);
}

.tankstock-toolbar-label {
  font-size: 0.85rem;
  color: var(--text);
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
}

.tankstock-toolbar-select {
  padding: 0.3rem 0.45rem;
  border-radius: 8px;
  border: 1px solid var(--border);
  background: var(--surface);
  color: var(--text);
  font-size: 0.85rem;
  max-width: 18rem;
}

.modal-panel--adblue-lieferplan {
  width: min(1180px, calc(100% - 1.5rem));
  max-height: min(92vh, 920px);
  display: flex;
  flex-direction: column;
}

/* AdBlue: Schließen-Warnung (Overlay im #modal-root, kein stcModal) */
.ts-adb-unsaved-overlay {
  position: absolute;
  inset: 0;
  z-index: 25;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1rem;
  box-sizing: border-box;
  background: rgba(0, 0, 0, 0.48);
}

.ts-adb-unsaved-panel {
  max-width: 28rem;
  width: 100%;
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 1rem 1.1rem;
  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.45);
}

.ts-adb-head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem 1rem;
  margin: 0.35rem 0 0.5rem;
}

.ts-adb-toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: 0.45rem 0.65rem;
  margin: 0 0 0.5rem;
  padding: 0.45rem 0.55rem;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: var(--card);
  font-size: 0.82rem;
}

.ts-adb-tb-field {
  display: inline-flex;
  flex-direction: column;
  gap: 0.22rem;
  min-width: 6.5rem;
}

.ts-adb-tb-field > span {
  font-size: 0.78rem;
  color: var(--muted);
}

.ts-adb-tb-inp {
  min-width: 8rem;
  max-width: 14rem;
  padding: 0.28rem 0.45rem;
  border-radius: 6px;
  border: 1px solid var(--border);
  background: var(--surface);
  color: var(--text);
  font: inherit;
  font-size: 0.82rem;
}

.ts-adb-toolbar select {
  min-width: 7.5rem;
  padding: 0.28rem 0.4rem;
  border-radius: 6px;
  border: 1px solid var(--border);
  background: var(--surface);
  color: var(--text);
  font: inherit;
  font-size: 0.82rem;
}

.ts-adb-print-pop {
  position: fixed;
  inset: 0;
  z-index: 130;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1rem;
}

.ts-adb-print-pop[hidden] {
  display: none !important;
}

.ts-adb-print-pop__backdrop {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.45);
}

.ts-adb-print-pop__box {
  position: relative;
  z-index: 1;
  width: min(420px, 100%);
  max-height: min(90vh, 520px);
  overflow: auto;
  padding: 1rem 1.1rem;
  border-radius: 10px;
  border: 1px solid var(--border);
  background: var(--surface);
  color: var(--text);
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.25);
}

.ts-adb-print-fields select,
.ts-adb-print-fields input[type='text'] {
  width: 100%;
  box-sizing: border-box;
}

.ts-adb-show-inactive {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  font-size: 0.86rem;
  cursor: pointer;
  user-select: none;
}

.ts-adb-scroll {
  flex: 1;
  min-height: 0;
  overflow: auto;
  margin: 0.25rem 0 0.65rem;
  border: 1px solid var(--border);
  border-radius: 8px;
  -webkit-overflow-scrolling: touch;
}

.ts-adb-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.8rem;
}

.ts-adb-table th,
.ts-adb-table td {
  border-bottom: 1px solid var(--border);
  padding: 0.3rem 0.45rem;
  vertical-align: middle;
  text-align: left;
}

.ts-adb-table th {
  position: sticky;
  top: 0;
  z-index: 1;
  background: var(--surface);
  font-weight: 600;
  white-space: nowrap;
}

.ts-adb-inp,
.ts-adb-interval-select {
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
  padding: 0.28rem 0.4rem;
  border-radius: 6px;
  border: 1px solid var(--border);
  background: var(--card);
  color: var(--text);
  font: inherit;
  font-size: 0.8rem;
}

.ts-adb-menge {
  background: rgba(255, 210, 80, 0.18);
  min-width: 4.2rem;
}

html[data-theme="light"] .ts-adb-menge {
  background: rgba(255, 230, 120, 0.55);
}

.ts-adb-name--hl .ts-adb-inp {
  background: rgba(255, 210, 80, 0.2);
}

html[data-theme="light"] .ts-adb-name--hl .ts-adb-inp {
  background: rgba(255, 235, 140, 0.55);
}

.ts-adb-interval--blue .ts-adb-interval-select {
  color: #7ec4ff;
}

.ts-adb-interval--red .ts-adb-interval-select {
  color: #ff9a9a;
}

html[data-theme="light"] .ts-adb-interval--blue .ts-adb-interval-select {
  color: #1565c0;
}

html[data-theme="light"] .ts-adb-interval--red .ts-adb-interval-select {
  color: #c62828;
}

.ts-adb-row--inactive {
  opacity: 0.55;
}

.ts-adb-row--inactive .ts-adb-inp,
.ts-adb-row--inactive .ts-adb-interval-select {
  color: var(--muted);
}

.ts-adb-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.3rem;
  white-space: nowrap;
}

.ts-adb-actions .btn-sm {
  padding: 0.2rem 0.45rem;
  font-size: 0.75rem;
}

.tankstock-hint {
  font-size: 0.82rem;
  margin: 0 0 0.85rem;
  line-height: 1.45;
}

@media (max-width: 768px) {
  .tankstock-toolbar-mobile-hide {
    display: none !important;
  }
}

.tankstock-error {
  color: #ffb4bc;
  margin: 0;
}

.tankstock-empty {
  color: var(--muted);
  margin: 0;
}

.tankstock-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
  gap: 1rem;
}

.tankstock-card--summary {
  margin-bottom: 1rem;
  max-width: 100%;
}

.tankstock-summary-head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem 1rem;
  margin: 0 0 0.65rem;
  padding-bottom: 0.45rem;
  border-bottom: 1px solid var(--border);
}

.tankstock-summary-title {
  flex: 1 1 auto;
  min-width: min(100%, 12rem);
}

.tankstock-summary-adblue-btn {
  flex: 0 0 auto;
  margin-left: auto;
}

.tankstock-summary-empty {
  text-align: center;
  padding: 0.5rem 0.35rem;
}

.tankstock-summary-table-wrap {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

.tankstock-summary-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.82rem;
}

.tankstock-summary-table th,
.tankstock-summary-table td {
  border: 1px solid var(--border);
  padding: 0.4rem 0.5rem;
  vertical-align: top;
}

.tankstock-summary-table thead th {
  background: var(--card);
  font-weight: 600;
  text-align: left;
  white-space: nowrap;
}

.tankstock-summary-table thead th.tankstock-num {
  text-align: right;
}

.tankstock-summary-table tbody tr:nth-child(even) {
  background: rgba(255, 255, 255, 0.02);
}

.tankstock-num {
  text-align: right;
  font-variant-numeric: tabular-nums;
}

.tankstock-card {
  border: 1px solid var(--border);
  border-radius: 12px;
  background: var(--surface);
  padding: 0.75rem 0.85rem;
}

.tankstock-card-title {
  margin: 0 0 0.65rem;
  font-size: 1rem;
  font-weight: 600;
  color: var(--text);
  border-bottom: 1px solid var(--border);
  padding-bottom: 0.45rem;
}

.tankstock-card--summary .tankstock-summary-head .tankstock-summary-title {
  margin: 0;
  border-bottom: none;
  padding-bottom: 0;
}

.tankstock-tanks {
  display: flex;
  flex-direction: column;
  gap: 0.85rem;
}

.tankstock-tank {
  border: 1px solid rgba(255, 255, 255, 0.06);
  border-radius: 10px;
  padding: 0.55rem 0.6rem;
  background: #141b24;
}

.tankstock-tank-head {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 0.35rem 0.75rem;
  margin-bottom: 0.45rem;
}

.tankstock-tank-title {
  font-weight: 600;
  font-size: 0.88rem;
}

.tankstock-tank-product {
  font-size: 0.78rem;
  color: var(--muted);
}

.tankstock-tank-body {
  display: flex;
  gap: 0.75rem;
  align-items: stretch;
}

.tankstock-bars {
  display: flex;
  gap: 0.45rem;
  align-items: flex-end;
  flex-shrink: 0;
}

.tankstock-bar-col {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 0.2rem;
  flex-shrink: 0;
}

.tankstock-bar-col-label {
  writing-mode: vertical-rl;
  transform: rotate(180deg);
  text-transform: uppercase;
  letter-spacing: 0.03em;
  font-size: 0.58rem;
  line-height: 1.1;
  color: var(--muted);
  user-select: none;
}

.tankstock-bar {
  position: relative;
  height: 120px;
  width: 30px;
  background: #1e2630;
  border-radius: 6px;
  overflow: hidden;
  border: 1px solid var(--border);
}

.tankstock-bar__fill {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  min-height: 2px;
  transition: height 0.35s ease;
  border-radius: 0 0 4px 4px;
}

.tankstock-bar__fill--high {
  background: linear-gradient(180deg, #6ecf8a 0%, #4a9d62 100%);
}

.tankstock-bar__fill--mid {
  background: linear-gradient(180deg, #e8d060 0%, #c9a227 100%);
}

.tankstock-bar__fill--low {
  background: linear-gradient(180deg, #f0a848 0%, #c45c3a 100%);
}

.tankstock-pct {
  font-size: 0.72rem;
  color: var(--muted);
  font-variant-numeric: tabular-nums;
}

.tankstock-dl {
  margin: 0;
  flex: 1;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.35rem 0.65rem;
  font-size: 0.78rem;
}

.tankstock-dl div {
  min-width: 0;
}

.tankstock-dl dt {
  margin: 0;
  color: var(--muted);
  font-weight: 500;
  font-size: 0.68rem;
  text-transform: uppercase;
  letter-spacing: 0.02em;
}

.tankstock-dl dd {
  margin: 0.1rem 0 0;
  font-variant-numeric: tabular-nums;
}

@media (max-width: 520px) {
  .tankstock-dl {
    grid-template-columns: 1fr;
  }
}

/* Hellmodus: offline / niedrig — langsam, dezent */
@keyframes tankstock-fs-offline-blink {
  0%,
  100% {
    background: rgba(185, 65, 125, 0.22);
    border-color: rgba(200, 90, 160, 0.55);
    box-shadow: inset 0 0 22px rgba(255, 110, 175, 0.14);
  }
  50% {
    background: rgba(255, 130, 200, 0.42);
    border-color: rgba(255, 170, 220, 0.82);
    box-shadow: inset 0 0 32px rgba(255, 160, 210, 0.32);
  }
}

/* Dunkel: offline (ohne Lowfill) — stärker leuchtend */
@keyframes tankstock-fs-offline-blink-dark {
  0%,
  100% {
    background: rgba(95, 28, 72, 0.55);
    border-color: rgba(255, 110, 185, 0.55);
    box-shadow:
      inset 0 0 26px rgba(255, 70, 150, 0.28),
      0 0 0 1px rgba(255, 100, 180, 0.35),
      0 0 20px rgba(255, 80, 160, 0.38);
  }
  50% {
    background: rgba(150, 45, 105, 0.72);
    border-color: rgba(255, 200, 240, 0.95);
    box-shadow:
      inset 0 0 42px rgba(255, 110, 200, 0.45),
      0 0 0 1px rgba(255, 180, 230, 0.85),
      0 0 32px rgba(255, 120, 200, 0.72),
      0 0 48px rgba(255, 70, 160, 0.45);
  }
}

@keyframes tankstock-fs-offline-lowfill-blink {
  0%,
  100% {
    background: rgba(145, 28, 40, 0.52);
    border-color: rgba(210, 75, 90, 0.75);
    box-shadow: inset 0 0 20px rgba(255, 100, 130, 0.18);
  }
  50% {
    background: rgba(200, 48, 72, 0.58);
    border-color: rgba(255, 150, 175, 0.88);
    box-shadow: inset 0 0 30px rgba(255, 130, 155, 0.32);
  }
}

@keyframes tankstock-fs-offline-lowfill-blink-dark {
  0%,
  100% {
    background: rgba(95, 18, 32, 0.78);
    border-color: rgba(255, 95, 115, 0.62);
    box-shadow:
      inset 0 0 28px rgba(255, 50, 75, 0.38),
      0 0 0 1px rgba(255, 90, 110, 0.5),
      0 0 22px rgba(255, 60, 85, 0.48);
  }
  50% {
    background: rgba(175, 32, 52, 0.92);
    border-color: rgba(255, 200, 210, 0.98);
    box-shadow:
      inset 0 0 40px rgba(255, 100, 125, 0.55),
      0 0 0 1px rgba(255, 170, 185, 0.95),
      0 0 38px rgba(255, 100, 120, 0.78),
      0 0 56px rgba(255, 60, 90, 0.48);
  }
}

@keyframes tankstock-fs-lowfill-only-pulse-light {
  0%,
  100% {
    background: rgba(175, 38, 48, 0.4);
    border-color: rgba(215, 85, 95, 0.72);
    box-shadow: inset 0 0 16px rgba(255, 100, 115, 0.14);
  }
  50% {
    background: rgba(200, 48, 55, 0.52);
    border-color: rgba(230, 100, 110, 0.88);
    box-shadow: inset 0 0 24px rgba(255, 120, 130, 0.26);
  }
}

@keyframes tankstock-fs-lowfill-only-pulse-dark {
  0%,
  100% {
    background: rgba(115, 22, 32, 0.72);
    border-color: rgba(255, 95, 108, 0.58);
    box-shadow:
      inset 0 0 24px rgba(255, 55, 75, 0.35),
      0 0 0 1px rgba(255, 85, 100, 0.45),
      0 0 20px rgba(255, 55, 80, 0.42);
  }
  50% {
    background: rgba(165, 32, 45, 0.9);
    border-color: rgba(255, 190, 198, 0.95);
    box-shadow:
      inset 0 0 36px rgba(255, 95, 115, 0.48),
      0 0 0 1px rgba(255, 160, 175, 0.9),
      0 0 34px rgba(255, 95, 115, 0.72),
      0 0 50px rgba(255, 50, 75, 0.42);
  }
}

body.tankstock-fs-open {
  overflow: hidden;
}

.tankstock-fs-overlay {
  position: fixed;
  inset: 0;
  z-index: 500;
  display: flex;
  flex-direction: column;
  background: var(--bg, #0c1016);
  color: var(--text);
  box-sizing: border-box;
}

.tankstock-fs-topbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.45rem 0.65rem;
  padding: 0.45rem 0.65rem;
  border-bottom: 1px solid var(--border);
  flex-shrink: 0;
  background: var(--surface);
}

.tankstock-fs-title {
  margin: 0;
  font-size: 0.95rem;
  font-weight: 600;
  flex: 1 1 12rem;
  min-width: 0;
}

.tankstock-fs-topactions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
  gap: 0.35rem;
}

.tankstock-fs-overlay .btn--fs-active {
  box-shadow: 0 0 0 2px rgba(120, 180, 255, 0.45);
}

.tankstock-fs-main {
  flex: 1;
  display: flex;
  flex-direction: column;
  min-height: 0;
  overflow: hidden;
}

.tankstock-fs-scroll {
  flex: 1;
  min-height: 0;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
}

.tankstock-fs-footer {
  flex-shrink: 0;
  width: 100%;
  box-sizing: border-box;
  padding: 0.35rem 0.55rem 0.5rem;
  padding-bottom: max(0.5rem, env(safe-area-inset-bottom, 0px));
  border-top: 1px solid var(--border);
  background: var(--surface);
  overflow: hidden;
  display: flex;
  flex-direction: column;
  min-height: 0;
}

.tankstock-fs-preise-inner {
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  min-height: 0;
  flex: 1;
}

.tankstock-fs-preise-h {
  margin: 0 0 0.35rem;
  font-size: 0.82rem;
  font-weight: 600;
  flex-shrink: 0;
}

.tankstock-fs-preise-scroll {
  flex: 1;
  min-height: 0;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
  border-radius: 8px;
  border: 1px solid var(--border);
}

/* Ansicht „Tank 37–…“: mehr Höhe für Tankstellenpreise, letzte Tabellenzeile per Scroll erreichbar */
.tankstock-fs-overlay--with-preise .tankstock-fs-scroll {
  flex: 0 1 auto;
  max-height: min(38vh, 46dvh);
  min-height: 0;
  overflow: auto;
}

.tankstock-fs-overlay--with-preise .tankstock-fs-footer {
  flex: 1 1 auto;
  min-height: min(52vh, 58dvh);
  max-height: none;
  overflow: hidden;
}

.tankstock-fs-overlay--with-preise .tankstock-fs-preise-scroll {
  max-height: none;
  min-height: 12rem;
}

.tankstock-fs-preise-table {
  font-size: 0.78rem;
}

.tankstock-fs-preise-loading {
  margin: 0.25rem 0;
}

.tankstock-fs-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(142px, 1fr));
  gap: 0.4rem 0.45rem;
  padding: 0.45rem 0.55rem 0.65rem;
  align-content: start;
  box-sizing: border-box;
}

.tankstock-fs-card {
  border: 1px solid var(--border);
  border-radius: 10px;
  background: var(--surface);
  padding: 0.32rem 0.4rem;
  display: flex;
  flex-direction: column;
  min-width: 0;
  min-height: 0;
  --tankstock-fs-warn-blink-period: 4s;
}

.tankstock-fs-card--offline:not(.tankstock-fs-card--lowfill) {
  animation: tankstock-fs-offline-blink var(--tankstock-fs-warn-blink-period, 4s) linear infinite;
}

html:not([data-theme="light"]) .tankstock-fs-card--offline:not(.tankstock-fs-card--lowfill) {
  animation-name: tankstock-fs-offline-blink-dark;
}

.tankstock-fs-card--offline.tankstock-fs-card--lowfill {
  animation: tankstock-fs-offline-lowfill-blink var(--tankstock-fs-warn-blink-period, 4s) linear infinite;
}

html:not([data-theme="light"]) .tankstock-fs-card--offline.tankstock-fs-card--lowfill {
  animation-name: tankstock-fs-offline-lowfill-blink-dark;
}

.tankstock-fs-card--lowfill:not(.tankstock-fs-card--offline) {
  animation: tankstock-fs-lowfill-only-pulse-light var(--tankstock-fs-warn-blink-period, 4s) linear infinite;
}

html:not([data-theme="light"]) .tankstock-fs-card--lowfill:not(.tankstock-fs-card--offline) {
  animation-name: tankstock-fs-lowfill-only-pulse-dark;
}

.tankstock-fs-card-hd {
  display: flex;
  flex-direction: column;
  gap: 0.2rem;
  margin-bottom: 0.28rem;
  padding-bottom: 0.25rem;
  border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}

.tankstock-fs-card-st {
  font-size: 0.76rem;
  font-weight: 600;
  line-height: 1.25;
  word-break: break-word;
}

.tankstock-fs-card-stand {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: space-between;
  gap: 0.25rem 0.5rem;
  width: 100%;
  box-sizing: border-box;
  font-size: 0.64rem;
  line-height: 1.25;
}

.tankstock-fs-card-stand-lbl {
  flex: 0 0 auto;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.02em;
  font-size: 0.58rem;
}

.tankstock-fs-card-stand-val {
  flex: 1 1 auto;
  min-width: 0;
  text-align: right;
  font-variant-numeric: tabular-nums;
  color: var(--text);
}

.tankstock-fs-card-body {
  flex: 1;
  min-height: 0;
}

.tankstock-tank--fs {
  padding: 0.3rem 0.28rem;
  border-radius: 8px;
}

.tankstock-tank--fs .tankstock-tank-head {
  flex-direction: column;
  align-items: flex-start;
  gap: 0.12rem;
  margin-bottom: 0.28rem;
}

.tankstock-tank--fs .tankstock-tank-title {
  font-size: 0.72rem;
}

.tankstock-tank--fs .tankstock-tank-product {
  font-size: 0.64rem;
  text-align: left;
}

.tankstock-tank--fs .tankstock-tank-body {
  flex-direction: column;
  align-items: stretch;
  gap: 0.35rem;
}

.tankstock-tank--fs .tankstock-bars {
  align-self: center;
  gap: 0.35rem;
}

.tankstock-tank--fs .tankstock-bar-col {
  flex-direction: row;
  flex-shrink: 0;
  gap: 0.14rem;
}

.tankstock-tank--fs .tankstock-bar-col-label {
  font-size: 0.5rem;
}

.tankstock-tank--fs .tankstock-bar {
  height: 92px;
  width: 24px;
}

.tankstock-tank--fs .tankstock-pct {
  font-size: 0.62rem;
}

.tankstock-tank--fs .tankstock-dl {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0.18rem 0;
  width: 100%;
  font-size: 0.62rem;
}

.tankstock-tank--fs .tankstock-dl > div {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: baseline;
  gap: 0.2rem 0.35rem;
  column-gap: 0.35rem;
  min-width: 0;
}

.tankstock-tank--fs .tankstock-dl dt {
  font-size: 0.54rem;
  margin: 0;
  flex: 1 1 auto;
  min-width: 0;
}

.tankstock-tank--fs .tankstock-dl dd {
  margin: 0;
  flex: 0 0 auto;
  text-align: right;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}

.tankstock-fs-empty {
  grid-column: 1 / -1;
  text-align: center;
  padding: 1.25rem 0.5rem;
  margin: 0;
}

/* Mengenkontrolle (gleicher Seitenrand wie Tankbestände) */
.main-panel--mengenkontrolle {
  padding: 0.75rem 1rem 1.25rem;
  max-width: 1400px;
  width: 100%;
  margin: 0 auto;
  box-sizing: border-box;
}

.mengenkontrolle-root {
  min-height: 8rem;
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
}

.mengenkontrolle-inner {
  padding: 0.25rem 0;
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
}

.mengenkontrolle-toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem 0.75rem;
  margin-bottom: 0.65rem;
}

.mengenkontrolle-toolbar--date {
  align-items: center;
  padding-left: 0.75rem;
}

.mengenkontrolle-toolbar--diff .mk-diff,
.mengenkontrolle-toolbar--diff .mk-minabs-preset {
  margin-right: 0.15rem;
}

.mengenkontrolle-toolbar-sub {
  font-size: 0.8rem;
  color: var(--muted);
  margin-right: 0.15rem;
}

.mengenkontrolle-select {
  padding: 0.3rem 0.45rem;
  border-radius: 8px;
  border: 1px solid var(--border);
  background: var(--surface);
  color: var(--text);
  font-size: 0.85rem;
  max-width: 20rem;
}

.mengenkontrolle-numinput {
  width: 6.5rem;
  padding: 0.25rem 0.4rem;
  border-radius: 8px;
  border: 1px solid var(--border);
  background: var(--surface);
  color: var(--text);
  font-size: 0.85rem;
}

.mengenkontrolle-numinput--active {
  background: rgba(234, 179, 8, 0.28);
  border-color: #ca8a04;
}

html[data-theme='light'] .mengenkontrolle-numinput--active {
  background: rgba(253, 224, 71, 0.5);
  border-color: #a16207;
}

.mengenkontrolle-tag-weekday {
  font-size: 0.88rem;
  font-weight: 600;
  color: var(--text);
  min-width: 1.75rem;
}

.mengenkontrolle-toolbar-label--selectonly {
  margin: 0;
}

.mengenkontrolle-inner .filter-quick-group {
  display: inline-flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.35rem;
}

.mengenkontrolle-inner .filter-quick-btn {
  padding: 0.32rem 0.5rem;
  font-size: 0.8rem;
  min-height: 0;
}

.mengenkontrolle-inner .filter-quick-group--fuel .filter-quick-btn {
  min-width: 2.2rem;
  padding-left: 0.35rem;
  padding-right: 0.35rem;
}

.mengenkontrolle-inner .filter-quick-btn.is-active {
  background: var(--accent);
  border-color: transparent;
  color: #fff;
}

html[data-theme='light'] .mengenkontrolle-inner .btn.secondary.filter-quick-btn.is-active {
  background: var(--accent);
  border-color: var(--accent);
  color: #fff;
}

.mengenkontrolle-tagline {
  margin: 0 0 0.85rem;
  font-size: 0.82rem;
}

.mengenkontrolle-card-grid {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 1rem;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  box-sizing: border-box;
}

.mengenkontrolle-card {
  width: 100%;
  max-width: 100%;
  min-width: 0;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: var(--surface);
  padding: 0.65rem 0.75rem;
  display: flex;
  flex-direction: column;
  box-sizing: border-box;
}

.mengenkontrolle-card-title {
  margin: 0 0 0.5rem;
  font-size: 0.95rem;
  font-weight: 600;
  color: var(--text);
  border-bottom: 1px solid var(--border);
  padding-bottom: 0.4rem;
  flex-shrink: 0;
}

.mengenkontrolle-card .mengenkontrolle-table-wrap {
  flex: 1 1 auto;
  min-width: 0;
}

/* Spaltenbreiten: Überschriften und Zellen bündig */
.mengenkontrolle-table--card {
  font-size: 0.78rem;
  table-layout: fixed;
  width: 100%;
  min-width: 0;
}

.mengenkontrolle-table--card col.mk-col-prod {
  width: 16%;
}

.mengenkontrolle-table--card col.mk-col-num {
  width: 9.5%;
}

.mengenkontrolle-table--card col.mk-col-act {
  width: 11%;
}

.mengenkontrolle-th-prod,
.mengenkontrolle-td-prod {
  text-align: left;
  word-wrap: break-word;
  overflow-wrap: break-word;
  hyphens: auto;
}

.mengenkontrolle-korr-input {
  box-sizing: border-box;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  padding: 0.25rem 0.4rem;
  border-radius: 6px;
  border: 1px solid var(--border);
  background: var(--surface);
  color: var(--text);
  font-size: inherit;
  font-variant-numeric: tabular-nums;
  text-align: right;
}

.mengenkontrolle-korr--abgang .mengenkontrolle-korr-input--filled {
  color: #f07078;
  border-color: rgba(240, 112, 120, 0.55);
  font-weight: 600;
}

.mengenkontrolle-korr--zugang .mengenkontrolle-korr-input--filled {
  color: #9ed88b;
  border-color: rgba(158, 216, 139, 0.45);
  font-weight: 600;
}

.mengenkontrolle-table td.mengenkontrolle-korr {
  text-align: right;
  vertical-align: middle;
}

.mengenkontrolle-korr-th {
  min-width: 0;
}

.mengenkontrolle-korr-act {
  vertical-align: middle;
  white-space: nowrap;
  text-align: right;
}

.mk-korr-meta {
  font-size: 0.65rem;
  margin-top: 0.35rem;
  line-height: 1.25;
  max-width: none;
  text-align: right;
}

.mengenkontrolle-num--calc {
  background: rgba(255, 255, 255, 0.02);
}

.mengenkontrolle-toolbar-label {
  font-size: 0.85rem;
  color: var(--text);
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
}

.mengenkontrolle-date {
  padding: 0.3rem 0.45rem;
  border-radius: 8px;
  border: 1px solid var(--border);
  background: var(--surface);
  color: var(--text);
  font-size: 0.85rem;
}

.mengenkontrolle-hint {
  font-size: 0.78rem;
  flex: 1 1 12rem;
  line-height: 1.35;
}

.mengenkontrolle-error {
  color: #ffb4bc;
  margin: 0;
}

.mengenkontrolle-days {
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
}

.mengenkontrolle-day-title {
  margin: 0 0 0.5rem;
  font-size: 1rem;
  font-weight: 600;
  color: var(--text);
}

.mengenkontrolle-table-wrap {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  border: 1px solid var(--border);
  border-radius: 10px;
  background: var(--surface);
}

.mengenkontrolle-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.78rem;
}

.mengenkontrolle-table th,
.mengenkontrolle-table td {
  border-bottom: 1px solid var(--border);
  padding: 0.4rem 0.5rem;
  vertical-align: top;
}

.mengenkontrolle-table thead th {
  background: var(--card);
  font-weight: 600;
  text-align: left;
  vertical-align: bottom;
}

.mengenkontrolle-table .mengenkontrolle-num {
  text-align: right;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}

.mengenkontrolle-table .mengenkontrolle-num br {
  line-height: 1.35;
}

.mengenkontrolle-diff--pos {
  color: #7dffb2;
}

.mengenkontrolle-diff--neg {
  color: #ffb4bc;
}

.mk-prod-line {
  display: inline-flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.35rem;
}

.mk-prod-cell--lager {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.6rem;
  width: 100%;
}

.mk-prod-cell--lager .mk-prod-name {
  line-height: 1.25;
  flex: 1 1 auto;
  min-width: 0;
}

.mk-stock-btns {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.35rem;
  flex-shrink: 0;
}

.mk-lager-btn {
  margin-right: 0.35rem;
  background: #21b5bc;
  border-color: #1aa0a8;
  color: #fff;
}

.mk-lager-btn:hover,
.mk-lager-btn:focus-visible {
  background: #1dbec6;
  border-color: #1899a1;
  color: #fff;
}

.mk-t24-btn {
  background: #c45c12;
  border-color: #a64d0f;
  color: #fff;
}

.mk-t24-btn:hover,
.mk-t24-btn:focus-visible {
  background: #d66818;
  border-color: #8f420c;
  color: #fff;
}

.mk-lager-modal-panel.modal-panel {
  width: min(640px, calc(100% - 2rem));
  max-height: min(90vh, 800px);
  height: 90vh;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  box-sizing: border-box;
}

/* T24-Mengen-Dialog: gleiche Breite wie Lager-Modal, halbe Panelhöhe */
.mk-lager-modal-panel.modal-panel.mk-t24-modal-panel {
  max-height: min(45vh, 400px);
  height: 45vh;
}

.mk-t24-station-head {
  margin: 0 0 0.45rem;
  font-size: 1rem;
  font-weight: 800;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  color: var(--text);
}

.mk-menge-save-confirm-panel.modal-panel {
  width: min(320px, calc(100% - 2rem));
  max-height: 180px;
  min-height: 150px;
  padding: 0.75rem 0.85rem;
}

.mk-menge-save-confirm-title {
  margin: 0 0 0.35rem;
  font-size: 0.95rem;
}

.mk-menge-save-confirm-msg {
  margin: 0 0 0.5rem;
  font-size: 0.84rem;
}

.mk-lager-modal-scroll {
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}

.mk-lager-modal-table,
.mk-lager-adm-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.84rem;
}

.mk-lager-modal-table th,
.mk-lager-modal-table td {
  border: 1px solid var(--border);
  padding: 0.35rem 0.45rem;
  text-align: left;
  color: #1e1e1e;
}

.mk-lager-adm-table th,
.mk-lager-adm-table td {
  border: 1px solid var(--border);
  padding: 0.35rem 0.45rem;
  text-align: left;
  color: var(--text);
}

/* Admin: Lager/T24-Modals im #modal-root – Lesetext und Eingaben folgen dem Theme */
#modal-root .mk-lager-admin-modal,
#modal-root .mk-lager-admin-modal h2 {
  color: var(--text);
}

#modal-root .mk-lager-admin-modal .muted {
  color: var(--muted);
}

#modal-root .mk-lager-admin-modal .inp,
#modal-root .mk-lager-admin-modal select.inp,
#modal-root .mk-lager-admin-modal input.inp {
  background: var(--surface);
  color: var(--text);
  border: 1px solid var(--border);
  border-radius: 8px;
  padding: 0.35rem 0.45rem;
  font: inherit;
}

#modal-root .mk-lager-admin-modal .mk-t24-station-block {
  margin-top: 1rem;
  padding-top: 0.85rem;
  border-top: 1px solid var(--border);
}

#modal-root .mk-lager-admin-modal .mk-t24-station-block h3 {
  margin: 0 0 0.5rem;
  font-size: 0.98rem;
  color: var(--text);
}

.mk-lager-modal-table .mk-lager-section td {
  background: rgba(127, 127, 127, 0.08);
  font-size: 0.8rem;
}

.mk-lager-modal-table tbody.mk-lager-block--zugang {
  background: #dff6df;
  color: #1e1e1e;
}

.mk-lager-modal-table tbody.mk-lager-block--abgang {
  background: #fde8e8;
  color: #1e1e1e;
}

.mk-lager-modal-table tbody.mk-lager-block--zugang .mk-lager-section td {
  background: rgba(255, 255, 255, 0.35);
}

.mk-lager-modal-table tbody.mk-lager-block--abgang .mk-lager-section td {
  background: rgba(255, 255, 255, 0.35);
}

.mk-lager-sum-row td {
  font-weight: 700;
  border-top: 2px solid rgba(0, 0, 0, 0.18);
  background: rgba(255, 255, 255, 0.55) !important;
}

.mk-lager-sum-cell {
  text-align: right;
  font-variant-numeric: tabular-nums;
  color: #1e1e1e;
}

.mk-lager-inp--zug {
  color: #0d4f1c;
  font-weight: 600;
  background: #c8edc8 !important;
  border-color: rgba(13, 79, 28, 0.45) !important;
}

.mk-lager-inp--abg {
  color: #7a0f14;
  font-weight: 600;
  background: #f5c4c6 !important;
  border-color: rgba(122, 15, 20, 0.45) !important;
}

.mk-lager-td-kind {
  white-space: nowrap;
  width: 5.5rem;
}

.mengenkontrolle-empty-day {
  margin: 0;
  font-size: 0.85rem;
}

/* Prüftermine TKST (Karten je Tankstelle) */
.main-panel--prueftermine {
  padding: 0.75rem 1rem 1.25rem;
  max-width: 1400px;
  width: 100%;
  margin: 0 auto;
  box-sizing: border-box;
}

.prueftermine-root {
  min-height: 8rem;
}

.prueftermine-inner {
  max-width: 100%;
}

.prueftermine-intro {
  margin: 0 0 0.65rem;
  font-size: 0.85rem;
}

.prueftermine-ro-hint {
  margin: 0 0 0.5rem;
}

.prueftermine-toolbar {
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  align-items: stretch;
  gap: 0.55rem;
  margin-bottom: 0.85rem;
  padding: 0.55rem 0.65rem;
  border: 1px solid var(--border);
  border-radius: 10px;
  background: var(--surface);
}

.prueftermine-toolbar-row {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: 0.45rem 0.65rem;
}

.prueftermine-toolbar-row--filters {
  width: 100%;
}

.prueftermine-toolbar-sel--sort-field {
  max-width: 220px;
  width: 100%;
  min-width: 0;
  box-sizing: border-box;
}

.prueftermine-toolbar-sel--sort-dir {
  max-width: 90px;
  width: 100%;
  min-width: 0;
  box-sizing: border-box;
}

.prueftermine-toolbar-sel--station {
  max-width: min(22rem, 100%);
  min-width: 10rem;
  flex: 1 1 12rem;
  box-sizing: border-box;
}

.prueftermine-toolbar-sel--year-print {
  max-width: 12rem;
  width: 100%;
  min-width: 0;
  box-sizing: border-box;
}

.prueftermine-year-quick {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.35rem 0.45rem;
}

.prueftermine-toolbar-field {
  display: flex;
  flex-direction: column;
  gap: 0.2rem;
  min-width: min(100%, 12rem);
  flex: 1 1 10rem;
}

.prueftermine-toolbar-label {
  font-size: 0.72rem;
  color: var(--muted);
  font-weight: 600;
}

.prueftermine-toolbar-inp {
  max-width: none;
  min-width: 0;
}

.prueftermine-toolbar-sel {
  max-width: none;
  min-width: 0;
}

.prueftermine-cards {
  display: flex;
  flex-direction: column;
  gap: 0.65rem;
}

.prueftermine-card {
  border: 1px solid var(--border);
  border-radius: 10px;
  background: var(--card);
  padding: 0.55rem 0.65rem 0.7rem;
  box-sizing: border-box;
  width: 100%;
}

/* Kartenton wie Header-Pille: Eichung orange, TÜV / Feuerlöscher / MM-JJ türkis */
.prueftermine-card--due-eich {
  background: rgba(255, 130, 40, 0.14);
  border-color: rgba(255, 170, 80, 0.48);
}

.prueftermine-card--due-tuv {
  background: rgba(25, 165, 175, 0.12);
  border-color: rgba(70, 195, 205, 0.45);
}

.prueftermine-card--due-eich-tuv {
  background: linear-gradient(
    125deg,
    rgba(255, 130, 40, 0.16) 0%,
    rgba(25, 165, 175, 0.12) 72%
  );
  border-color: rgba(120, 190, 200, 0.5);
}

.prueftermine-card-head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.4rem 0.6rem;
  margin-bottom: 0.45rem;
  padding-bottom: 0.35rem;
  border-bottom: 1px solid var(--border);
}

.prueftermine-card-title {
  margin: 0;
  font-size: 1rem;
  font-weight: 700;
  line-height: 1.25;
  word-break: break-word;
}

.prueftermine-card-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(11.5rem, 1fr));
  gap: 0.45rem 0.65rem;
  align-items: start;
}

@media (max-width: 520px) {
  .prueftermine-card-grid {
    grid-template-columns: 1fr;
  }
}

.prueftermine-field {
  display: flex;
  flex-direction: column;
  gap: 0.2rem;
  margin: 0;
  min-width: 0;
}

.prueftermine-field--full {
  grid-column: 1 / -1;
}

.prueftermine-field--stoerung-sel select.prueftermine-inp {
  max-width: 300px;
  width: 100%;
}

/* Prüftermine: Dialog „Anzeige bis“ für Störungsmeldung (über der Karte) */
.prf-stoerung-bis-overlay {
  position: fixed;
  inset: 0;
  z-index: 60;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1rem;
  box-sizing: border-box;
  background: rgba(0, 0, 0, 0.45);
}

.prf-stoerung-bis-panel {
  max-width: 26rem;
  width: 100%;
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: 12px;
  padding: 1rem 1.1rem;
  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.45);
}

.prueftermine-field--dtpair .prueftermine-dt-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.35rem;
  width: 100%;
}

@media (max-width: 520px) {
  .prueftermine-field--dtpair .prueftermine-dt-row {
    grid-template-columns: 1fr;
  }
}

.admin-stoerung-list .admin-stoerung-row {
  padding: 0.45rem 0;
  border-bottom: 1px solid var(--border);
}

.admin-stoerung-list .admin-stoerung-ta {
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
}

.prf-term-line {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.45rem 0.65rem;
}

.prf-term-actions {
  display: inline-flex;
  flex-wrap: wrap;
  gap: 0.25rem;
}

.prf-term-modal-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.65rem 1rem;
}

@media (max-width: 520px) {
  .prf-term-modal-grid {
    grid-template-columns: 1fr;
  }
}

.prf-term-fs {
  margin: 0;
  padding: 0.45rem 0.55rem;
  border: 1px solid var(--border);
  border-radius: 8px;
}

.prf-term-fs legend {
  padding: 0 0.25rem;
  font-size: 0.82rem;
  font-weight: 600;
}

.prf-term-hm {
  display: flex;
  gap: 0.5rem;
  margin-top: 0.35rem;
}

.prf-term-hm .prf-term-lab {
  flex: 1;
  min-width: 0;
}

.prf-term-hm input[type='number'] {
  width: 100%;
}

.prf-term-err {
  margin: 0.5rem 0 0;
  font-size: 0.86rem;
  color: #f87171;
}

.modal-panel--prf-term {
  width: min(480px, calc(100% - 2rem));
  max-width: min(480px, calc(100% - 2rem));
}

.prueftermine-field--check .prueftermine-check-wrap {
  min-height: 2rem;
  display: flex;
  align-items: center;
}

.prueftermine-field--hervorhebung-dis {
  display: none !important;
}

.prueftermine-field-label {
  font-size: 0.72rem;
  color: var(--muted);
  font-weight: 600;
}

.prueftermine-inp {
  width: 100%;
  min-width: 0;
  max-width: 180px;
  box-sizing: border-box;
  padding: 0.28rem 0.4rem;
  border-radius: 6px;
  border: 1px solid var(--border);
  background: var(--surface);
  color: var(--text);
  font: inherit;
  font-size: 0.8rem;
}

.prueftermine-inp-date {
  max-width: 100%;
}

.prueftermine-ta {
  width: 100%;
  min-width: 0;
  min-height: 2.75rem;
  box-sizing: border-box;
  padding: 0.35rem 0.4rem;
  border-radius: 6px;
  border: 1px solid var(--border);
  background: var(--surface);
  color: var(--text);
  font: inherit;
  font-size: 0.8rem;
  resize: vertical;
}

.prueftermine-check-label {
  margin: 0;
  font-size: 0.78rem;
}

.prueftermine-empty {
  margin: 0.5rem 0 0;
}

.prueftermine-field--due-yellow .prueftermine-inp,
.prueftermine-field--due-yellow .prueftermine-ta {
  border-color: rgba(220, 180, 50, 0.95);
  box-shadow: 0 0 0 1px rgba(220, 180, 50, 0.45);
}

/* Jahresfilter: Treffer wie „Fällig“-Gelb (ohne Puls) */
.prueftermine-field--year-filter-hit .prueftermine-inp,
.prueftermine-field--year-filter-hit .prueftermine-ta {
  border-color: rgba(220, 180, 50, 0.95);
  box-shadow: 0 0 0 1px rgba(220, 180, 50, 0.45);
}

.prueftermine-field.prf-term-wrap.prueftermine-field--year-filter-hit {
  border: 1px solid rgba(220, 180, 50, 0.82);
  border-radius: 8px;
  padding: 0.35rem 0.45rem 0.45rem;
  background: rgba(220, 180, 50, 0.1);
  box-sizing: border-box;
}

html[data-theme='light'] .prueftermine-field--year-filter-hit .prueftermine-inp,
html[data-theme='light'] .prueftermine-field--year-filter-hit .prueftermine-ta {
  border-color: #ca8a04;
  box-shadow: 0 0 0 1px rgba(202, 138, 4, 0.35);
}

html[data-theme='light'] .prueftermine-field.prf-term-wrap.prueftermine-field--year-filter-hit {
  border-color: rgba(202, 138, 4, 0.65);
  background: rgba(253, 224, 71, 0.22);
}

.prueftermine-field--due-red .prueftermine-inp,
.prueftermine-field--due-red .prueftermine-ta {
  animation: prueftermine-due-red-pulse 1.05s ease-in-out infinite;
}

@keyframes prueftermine-due-red-pulse {
  0%,
  100% {
    border-color: rgba(230, 70, 70, 0.85);
    box-shadow: 0 0 0 1px rgba(230, 70, 70, 0.35);
  }
  50% {
    border-color: rgba(255, 120, 120, 1);
    box-shadow: 0 0 10px rgba(255, 80, 80, 0.55);
  }
}

@media (prefers-reduced-motion: reduce) {
  .prueftermine-field--due-red .prueftermine-inp,
  .prueftermine-field--due-red .prueftermine-ta {
    animation: none;
    border-color: rgba(230, 90, 90, 0.9);
  }
}

html[data-theme="light"] .prueftermine-card--due-eich {
  background: rgba(255, 150, 60, 0.2);
  border-color: rgba(200, 100, 30, 0.45);
}

html[data-theme="light"] .prueftermine-card--due-tuv {
  background: rgba(40, 175, 185, 0.16);
  border-color: rgba(30, 130, 140, 0.42);
}

html[data-theme="light"] .prueftermine-card--due-eich-tuv {
  background: linear-gradient(
    125deg,
    rgba(255, 150, 60, 0.22) 0%,
    rgba(40, 175, 185, 0.14) 72%
  );
  border-color: rgba(90, 150, 160, 0.48);
}

/* Eigenes Fenster/Tab: tankstock-monitor.php */
.stc-tankstock-monitor-body {
  margin: 0;
  min-height: 100vh;
  background: var(--bg, #0c1016);
  color: var(--text);
}

.stc-tankstock-monitor-head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.45rem 0.65rem;
  padding: 0.45rem 0.65rem;
  border-bottom: 1px solid var(--border);
  background: var(--surface);
}

.stc-tankstock-monitor-head-spacer {
  flex: 1 1 4rem;
  min-width: 0;
}

/* Eigenes Tab: tankstock-board.php (kein Overlay) */
.tankstock-board-page-body {
  margin: 0;
  min-height: 100vh;
  background: var(--bg, #0c1016);
  color: var(--text);
}

/* Funktionswünsche (feature-wunschliste.js) */
.fw-votes {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 0.35rem;
  flex-shrink: 0;
}

.fw-vote-scoreline {
  display: flex;
  align-items: center;
  gap: 0.45rem;
  font-size: 0.86rem;
  white-space: nowrap;
}

.fw-vote-scoresep {
  opacity: 0.55;
  user-select: none;
}

.fw-vote-btns {
  display: flex;
  gap: 0.35rem;
}

.fw-vote-btn {
  min-width: 2.4rem;
  font-size: 1.08rem;
  line-height: 1.15;
  padding: 0.28rem 0.45rem;
}

.fw-vote-btn[aria-pressed="true"] {
  border-color: var(--accent);
  box-shadow: 0 0 0 1px var(--accent);
}

/* Tagespreise Favoriten */
.tagespreise-fav-btn {
  padding: 0.28rem 0.45rem;
  line-height: 1;
  min-width: 2.25rem;
}

.tagespreise-fav-btn .tagespreise-fav-icon {
  display: inline-flex;
  vertical-align: middle;
}

.tagespreise-fav-btn--has-favorites .tagespreise-fav-icon--outline {
  display: none;
}

.tagespreise-fav-btn--has-favorites .tagespreise-fav-icon--fill {
  display: inline-flex !important;
}

.modal-panel--tp-favorites {
  max-width: min(52rem, 96vw);
  max-height: min(85vh, 900px);
  display: flex;
  flex-direction: column;
}

.tp-fav-table-wrap {
  overflow: auto;
  flex: 1;
  min-height: 0;
  margin-bottom: 0.5rem;
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 6px;
}

html[data-theme="light"] .tp-fav-table-wrap {
  border-color: rgba(0, 0, 0, 0.1);
}

.tp-fav-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.88rem;
}

.tp-fav-table th,
.tp-fav-table td {
  padding: 0.35rem 0.5rem;
  text-align: left;
  vertical-align: top;
  border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}

html[data-theme="light"] .tp-fav-table th,
html[data-theme="light"] .tp-fav-table td {
  border-bottom-color: rgba(0, 0, 0, 0.08);
}

.tp-fav-row-sup td {
  font-weight: 600;
}

.tp-fav-sup-td {
  display: flex;
  align-items: flex-start;
  gap: 0.45rem;
}

.tp-fav-sup-head {
  flex: 1;
  min-width: 0;
}

.tp-fav-sup-sub {
  display: block;
  margin-top: 0.12rem;
  font-size: 0.82rem;
  font-weight: normal;
  line-height: 1.25;
}

.tp-fav-indent {
  width: 1.25rem;
}

.tp-fav-prod-label {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  cursor: pointer;
  font-weight: normal;
}

.tp-fav-actions {
  flex-wrap: wrap;
  gap: 0.35rem;
}

.tp-fav-user-tools {
  margin-bottom: 0.65rem;
}

.tp-fav-sup-tbody {
  border-top: 1px solid rgba(255, 255, 255, 0.07);
}

html[data-theme='light'] .tp-fav-sup-tbody {
  border-top-color: rgba(0, 0, 0, 0.09);
}

.tp-fav-sup-tbody:first-of-type {
  border-top: none;
}

.tp-fav-move-btns {
  display: inline-flex;
  flex-direction: column;
  gap: 0.18rem;
  margin-left: 0.35rem;
  flex-shrink: 0;
  align-self: center;
}

.tp-fav-move-btns .btn-sm {
  padding: 0.1rem 0.25rem;
  font-size: 0.72rem;
  line-height: 1;
  min-width: 1.65rem;
}

/* mala Oil – Kundenstammdaten */
.mala-kunden-root {
  min-height: 0;
  flex: 1;
  overflow: visible;
}

.app-mala-oil .main-panel--mala-kunden {
  overflow: visible;
  position: relative;
}

.app-mala-oil .mala-spa-content > main.main-panel--mala-kunden {
  overflow-x: hidden;
  overflow-y: auto;
}

.app-mala-oil .main-panel--mala-artikel {
  overflow: visible;
  position: relative;
}

.app-mala-oil .mala-spa-content > main.main-panel--mala-artikel {
  overflow-x: hidden;
  overflow-y: auto;
}

.mala-artikel-refbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem;
}

.mala-artikel-refbar__sum {
  flex: 1 1 12rem;
  min-width: 0;
}

.mala-artikel-ref-out {
  flex: 1 1 100%;
}

.mala-artikel-date {
  max-width: 11rem;
}

.mala-artikel-subh {
  margin: 1rem 0 0.35rem;
  font-size: 1rem;
  font-weight: 600;
}

.mala-artikel-lf-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.9rem;
}

.mala-artikel-lf-table th,
.mala-artikel-lf-table td {
  border: 1px solid var(--border);
  padding: 0.35rem 0.45rem;
  vertical-align: middle;
}

.mala-artikel-lf-table th {
  text-align: left;
  background: var(--card);
}

.mala-artikel-lf-table select,
.mala-artikel-lf-table input {
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
}

.mala-artikel-pdf-list {
  list-style: none;
  margin: 0.5rem 0 0;
  padding: 0;
}

.mala-artikel-pdf-li {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem;
  padding: 0.35rem 0;
  border-bottom: 1px solid var(--border);
}

.mala-artikel-pdf-up {
  margin: 0.25rem 0 0.5rem;
}

.mala-artikel-hist-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.88rem;
  margin-top: 0.5rem;
}

.mala-artikel-hist-table th,
.mala-artikel-hist-table td {
  border: 1px solid var(--border);
  padding: 0.3rem 0.4rem;
  text-align: left;
}

.mala-artikel-cb {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
}

.mala-artikel .mala-kunden-panel .mala-kunden-adresse-stack {
  gap: 0.85rem;
}

.modal-panel.mala-artikel-ref-modal-panel {
  width: min(880px, calc(100% - 2rem));
  min-height: 745px;
  max-height: min(92vh, 920px);
  display: flex;
  flex-direction: column;
}

.mala-artikel-ref-modal-panel .mala-kunden-adresse-stack {
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: auto;
  padding-right: 0.2rem;
}

.mala-kunden {
  padding: 0.35rem 0.5rem 1rem;
  max-width: 1180px;
  margin: 0 auto;
}

.mala-kunden-keybar {
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 0.65rem 0.85rem;
  margin-bottom: 0.65rem;
  position: sticky;
  top: 0;
  z-index: 20;
}

.mala-kunden-keybar-row {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem 0.75rem;
  align-items: flex-end;
}

.mala-kunden-keybar-fields {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: 0.5rem 1.25rem;
  flex: 1 1 280px;
  min-width: 0;
}

.mala-kunden-keybar-fields .mala-kunden-field--sm {
  flex: 0 1 140px;
}

.mala-kunden-keybar-fields .mala-kunden-field--typ {
  flex: 1 1 200px;
  min-width: min(100%, 200px);
}

.mala-kunden-modus {
  font-size: 0.85rem;
  font-weight: 600;
  color: var(--text);
}

.mala-kunden-kopf {
  flex: 1 1 200px;
  font-size: 0.82rem;
}

.mala-kunden-keybar-actions {
  margin-left: auto;
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
}

.mala-kunden-typ {
  font-size: 0.85rem;
}

.mala-kunden-searchbar {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem;
  margin-top: 0.4rem;
  align-items: center;
}

.mala-kunden-search {
  flex: 1 1 200px;
  min-width: 180px;
  padding: 0.35rem 0.5rem;
  border-radius: 8px;
  border: 1px solid var(--border);
  background: var(--surface);
  color: var(--text);
  font-size: 0.88rem;
}

.mala-kunden-pick-modal__title {
  margin: 0 0 0.35rem;
  font-size: 1.05rem;
}

.mala-kunden-pick-modal__lead {
  margin: 0 0 0.75rem;
  font-size: 0.88rem;
}

.mala-kunden-pick-modal__actions {
  margin-top: 0.75rem;
}

.mala-kunden-pick-list {
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
  max-height: min(60vh, 420px);
  overflow-y: auto;
  padding-right: 0.15rem;
}

.mala-kunden-pick-item {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0.2rem;
  width: 100%;
  margin: 0;
  padding: 0.55rem 0.65rem;
  text-align: left;
  border-radius: 8px;
  border: 1px solid var(--border);
  background: var(--surface);
  color: var(--text);
  font: inherit;
  cursor: pointer;
  transition: border-color 0.12s ease, background 0.12s ease;
}

.mala-kunden-pick-item:hover {
  border-color: rgba(100, 180, 255, 0.75);
  background: var(--card);
}

.mala-kunden-pick-item.is-key-active {
  border-color: rgba(100, 180, 255, 0.9);
  box-shadow: 0 0 0 1px rgba(100, 180, 255, 0.35);
  background: var(--card);
}

.mala-kunden-pick-item__knr {
  font-weight: 700;
  font-size: 0.88rem;
}

.mala-kunden-pick-item__firma {
  font-size: 0.93rem;
  font-weight: 600;
  line-height: 1.35;
}

.mala-kunden-pick-item__zusatz {
  font-size: 0.8rem;
  line-height: 1.35;
}

.mala-kunden-pick-item__title {
  font-weight: 600;
  font-size: 0.92rem;
}

.mala-kunden-pick-item__meta {
  font-size: 0.8rem;
}

.mala-kunden-pick-item__addr {
  font-size: 0.82rem;
  line-height: 1.35;
}

.mala-kunden-pick-item__hint {
  font-size: 0.76rem;
  font-style: italic;
}

.mala-kunden-tablist {
  display: flex;
  flex-wrap: wrap;
  gap: 0.25rem;
  margin-bottom: 0.65rem;
  position: sticky;
  top: 4.55rem;
  z-index: 19;
  background: var(--bg);
  padding: 0.15rem 0;
}

.mala-kunden-tab {
  border: 1px solid var(--border);
  background: var(--surface);
  color: var(--text);
  border-radius: 8px;
  padding: 0.35rem 0.55rem;
  font-size: 0.78rem;
  cursor: pointer;
  font-weight: 500;
}

.mala-kunden-tab:hover {
  border-color: rgba(100, 180, 255, 0.6);
}

.mala-kunden-tab--active {
  background: var(--card);
  border-color: rgba(100, 180, 255, 0.85);
  box-shadow: 0 0 0 1px rgba(100, 180, 255, 0.25);
}

.mala-bestellung-tab--warn.mala-kunden-tab--active,
.mala-bestellung-tab--warn {
  border-color: rgba(220, 80, 80, 0.85) !important;
  box-shadow: 0 0 0 1px rgba(220, 80, 80, 0.28);
  background: rgba(220, 80, 80, 0.12);
}

.mala-kunden-pick-item--gesperrt {
  border-color: rgba(220, 80, 80, 0.55);
  background: rgba(220, 80, 80, 0.08);
}

.mala-bestellung-gesperrt-badge {
  display: inline-block;
  margin-left: 0.35rem;
  padding: 0.08rem 0.35rem;
  border-radius: 4px;
  font-size: 0.72rem;
  font-weight: 600;
  background: rgba(220, 80, 80, 0.2);
  color: var(--text);
}

.mala-bestellung-banner-warn {
  margin: 0 0 0.75rem;
  padding: 0.65rem 0.85rem;
  border-radius: 8px;
  border: 1px solid rgba(220, 80, 80, 0.55);
  background: rgba(220, 80, 80, 0.1);
}

.mala-bestellung-footer-totals {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr 1fr 1.2fr;
  gap: 0.55rem 1.2rem;
  margin-top: 0.75rem;
  padding: 0.75rem 1rem;
  border-radius: 8px;
  border: 1px solid var(--border);
  background: var(--surface);
  font-size: 0.88rem;
  align-items: center;
}

.mala-bestellung-footer-totals > div {
  white-space: nowrap;
}

.mala-bestellung-footer-totals__sum {
  font-weight: 600;
}

.mala-bestellung-footer-totals__grand {
  font-size: 0.96rem;
  font-weight: 700;
}

@media (max-width: 1200px) {
  .mala-bestellung-footer-totals {
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  }
}

.mala-bestellung-list-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.85rem;
}

.mala-bestellung-list-table th,
.mala-bestellung-list-table td {
  border-bottom: 1px solid var(--border);
  padding: 0.35rem 0.45rem;
  text-align: left;
}

.mala-bestellung-subh {
  margin: 0.75rem 0 0.35rem;
  font-size: 0.95rem;
}

.mala-bestellung-preis-ul {
  margin: 0.25rem 0 0.5rem 1.1rem;
  padding: 0;
}

.mb-ek-row {
  display: flex;
  gap: 0.4rem;
  align-items: center;
}

.mb-ek-row input {
  flex: 1 1 auto;
}

.mala-bestellung-warn-box {
  margin-top: 0.65rem;
  padding: 0.55rem 0.7rem;
  border-radius: 8px;
  border: 1px solid rgba(220, 160, 60, 0.65);
  background: rgba(220, 160, 60, 0.12);
}

.mala-bestellung-address-box {
  margin-top: 0.5rem;
  padding: 0.55rem 0.65rem;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: var(--surface);
  font-size: 0.86rem;
}

.mala-ls-board {
  display: flex;
  flex-direction: column;
  gap: 0.85rem;
}

.mala-ls-board__toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem 0.75rem;
}

.mala-ls-board__filters {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem;
}

.mala-ls-filter-btn {
  border: 1px solid var(--border);
  background: var(--surface);
  color: var(--text);
  border-radius: 999px;
  padding: 0.28rem 0.7rem;
  font-size: 0.8rem;
  cursor: pointer;
  transition: background 0.12s ease, border-color 0.12s ease;
}

.mala-ls-filter-btn:hover {
  border-color: var(--accent);
}

.mala-ls-filter-btn--active {
  background: rgba(61, 139, 253, 0.18);
  border-color: var(--accent);
  color: var(--text);
}

.mala-ls-filter-btn__count {
  opacity: 0.75;
  margin-left: 0.2rem;
}

.mala-ls-section {
  border: 1px solid var(--border);
  border-radius: 10px;
  background: var(--card);
  overflow: hidden;
}

.mala-ls-section__head {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: space-between;
  gap: 0.35rem 0.75rem;
  padding: 0.55rem 0.75rem;
  border-bottom: 1px solid var(--border);
  background: var(--surface);
}

.mala-ls-section__title {
  margin: 0;
  font-size: 0.92rem;
  font-weight: 600;
}

.mala-ls-table-wrap {
  overflow-x: auto;
}

.mala-ls-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.84rem;
}

.mala-ls-table th,
.mala-ls-table td {
  padding: 0.45rem 0.6rem;
  border-bottom: 1px solid var(--border);
  text-align: left;
  vertical-align: middle;
}

.mala-ls-table th {
  font-size: 0.75rem;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--muted);
  background: rgba(0, 0, 0, 0.12);
}

html[data-theme='light'] .mala-ls-table th {
  background: rgba(0, 0, 0, 0.04);
}

.mala-ls-table tbody tr:last-child td {
  border-bottom: none;
}

.mala-ls-table tbody tr:hover {
  background: rgba(61, 139, 253, 0.06);
}

.mala-ls-badge {
  display: inline-flex;
  align-items: center;
  border-radius: 999px;
  padding: 0.12rem 0.5rem;
  font-size: 0.72rem;
  font-weight: 600;
  letter-spacing: 0.02em;
  white-space: nowrap;
}

.mala-ls-badge--offen {
  background: rgba(227, 93, 106, 0.18);
  color: #f3a0a8;
}

html[data-theme='light'] .mala-ls-badge--offen {
  color: #8b1d2e;
}

.mala-ls-badge--erledigt {
  background: rgba(62, 207, 142, 0.18);
  color: #7ddeb0;
}

html[data-theme='light'] .mala-ls-badge--erledigt {
  color: #0d6b40;
}

.mala-ls-badge--teillieferung {
  background: rgba(220, 160, 60, 0.2);
  color: #e8c878;
}

html[data-theme='light'] .mala-ls-badge--teillieferung {
  color: #7a5200;
}

.mala-ls-badge--warte_lkw,
.mala-ls-badge--warte_auslieferung {
  background: rgba(255, 193, 7, 0.22);
  color: #ffc107;
}
.mala-ls-badge--menge_freigegeben,
.mala-ls-badge--rechnung_freigegeben {
  background: rgba(33, 150, 243, 0.2);
  color: #64b5f6;
}
.mala-ls-badge--rechnung_erstellt,
.mala-ls-badge--abgeschlossen {
  background: rgba(76, 175, 80, 0.22);
  color: #81c784;
}
.mala-ls-badge--ohne_lkw {
  background: rgba(154, 167, 181, 0.22);
  color: var(--muted);
}

.mala-ls-empty {
  padding: 0.85rem 0.75rem;
  margin: 0;
  font-size: 0.86rem;
}

.mala-ls-alert {
  margin: 0;
  padding: 0.65rem 0.75rem;
  border-radius: 6px;
  background: rgba(227, 93, 106, 0.12);
  color: #f3a0a8;
  font-size: 0.86rem;
}

html[data-theme='light'] .mala-ls-alert {
  color: #8b1d2e;
}

.mala-ls-menge-input {
  width: 6.5rem;
  max-width: 100%;
  text-align: right;
}

.mala-ls-num {
  text-align: right;
  white-space: nowrap;
}

.mala-ls-num--lkw {
  font-weight: 600;
  color: var(--accent, #3d8bfd);
}

.mala-ls-mengen-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin-top: 0.65rem;
}

.mala-bestellung-list-toolbar {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  align-items: center;
  margin-bottom: 0.75rem;
}

.mala-bestellung-list-toolbar .mala-kunden-search {
  flex: 1 1 12rem;
  min-width: 10rem;
}

.mala-bestellung-list-wrap {
  overflow: auto;
  max-height: min(70vh, 42rem);
}

.mala-bestellung-list-table--rich th,
.mala-bestellung-list-table--rich td {
  font-size: 0.82rem;
  padding: 0.4rem 0.55rem;
  white-space: nowrap;
}

.mala-bestellung-list-table--rich td:nth-child(3) {
  white-space: normal;
  min-width: 8rem;
}

.mala-bestellung-list-row--active {
  background: rgba(61, 139, 253, 0.12);
}

.mala-bestellung-list-row {
  cursor: pointer;
}

.mala-bestellung-list-row:hover {
  background: rgba(61, 139, 253, 0.06);
}

.mb-pos-lkw-block {
  margin-top: 0.85rem;
  padding: 0.75rem;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: rgba(0, 0, 0, 0.08);
}

html[data-theme='light'] .mb-pos-lkw-block {
  background: rgba(0, 0, 0, 0.03);
}

.mb-pos-lkw-block--ok {
  border-color: rgba(62, 207, 142, 0.45);
}

.mb-pos-lkw-title {
  margin: 0 0 0.5rem;
  font-size: 0.9rem;
}

.mb-pos-lkw-docs {
  margin: 0 0 0.65rem;
  padding-left: 1.1rem;
  font-size: 0.85rem;
}

.mb-pos-lkw-confirm-row {
  display: flex;
  flex-wrap: wrap;
  gap: 0.65rem;
  align-items: flex-end;
}

.mb-pos-lkw-bestaetigt-von,
.mb-ls-menge-bestaetigt-von {
  font-size: 0.82rem;
  line-height: 1.35;
  white-space: nowrap;
}

.mb-ls-menge-bestaetigt-von {
  margin-top: 0.25rem;
  white-space: normal;
}

.modal-panel--rechnung-pdf {
  width: 80vw;
  max-width: 80vw;
  height: 95vh;
  max-height: 95vh;
  display: flex;
  flex-direction: column;
  padding: 0;
  overflow: hidden;
}

.mr-pdf-modal__head {
  padding: 1rem 1.25rem 0.5rem;
  flex-shrink: 0;
}

.mr-pdf-modal__title {
  margin: 0 0 0.35rem;
  font-size: 1.1rem;
}

.mr-pdf-modal__hint {
  margin: 0;
  font-size: 0.85rem;
}

.mr-pdf-modal__body {
  flex: 1 1 auto;
  min-height: 0;
  padding: 0 1.25rem;
}

.mr-pdf-modal__iframe {
  width: 100%;
  height: calc(95vh - 10.5rem);
  min-height: 320px;
  border: 1px solid #ccc;
  border-radius: 4px;
}

.mr-pdf-modal__footer {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  padding: 0.85rem 1.25rem 1rem;
  flex-shrink: 0;
}

.mr-pdf-modal__footer--sticky {
  position: sticky;
  bottom: 0;
  background: var(--modal-panel-bg, #1a1a1a);
  border-top: 1px solid rgba(255, 255, 255, 0.08);
  z-index: 2;
}

html[data-theme='light'] .mr-pdf-modal__footer--sticky {
  background: #fff;
  border-top-color: #ddd;
}

.mr-email-modal .mala-kunden-field {
  margin-top: 0.5rem;
}

.mala-ls-modal-warn {
  color: #f3a0a8;
  border-left: 3px solid #e35d6a;
  padding-left: 0.65rem;
}

html[data-theme='light'] .mala-ls-modal-warn {
  color: #8b1d2e;
}

.mala-ls-section--warn .mala-ls-section__title {
  color: #f3a0a8;
}

.mala-ls-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem;
}

.mala-lieferfz-cards-wrap {
  max-height: 55vh;
  overflow: auto;
  padding: 0.15rem 0.1rem 0.35rem;
}
.mala-lieferfz-cards {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(248px, 1fr));
  gap: 0.75rem;
}
.mala-lieferfz-card {
  position: relative;
  display: block;
  margin: 0;
  cursor: pointer;
  border-radius: 10px;
  border: 2px solid var(--border);
  background: var(--surface);
  transition: box-shadow 0.15s ease, border-color 0.15s ease;
}
.mala-lieferfz-card input[type='radio'] {
  position: absolute;
  top: 0.65rem;
  left: 0.65rem;
  margin: 0;
}
.mala-lieferfz-card__inner {
  padding: 0.65rem 0.75rem 0.65rem 2rem;
  font-size: 0.82rem;
}
.mala-lieferfz-card--ein {
  background: rgba(40, 160, 90, 0.16);
  border-color: rgba(40, 160, 90, 0.42);
}
.mala-lieferfz-card--split {
  background: rgba(220, 175, 55, 0.2);
  border-color: rgba(190, 140, 45, 0.48);
}
.mala-lieferfz-card--bad {
  background: rgba(100, 100, 100, 0.08);
  border-color: var(--border);
}
.mala-lieferfz-card--tourenplanung {
  background: rgba(91, 127, 217, 0.12);
  border-color: rgba(91, 127, 217, 0.45);
}
.mala-lieferfz-card--disabled {
  cursor: not-allowed;
  opacity: 0.58;
  pointer-events: none;
}
.mala-lieferfz-card:has(input[type='radio']:checked) {
  box-shadow: 0 0 0 2px var(--mala-sidebar-active-accent, #c62828);
  border-color: rgba(198, 40, 40, 0.35);
}
.mala-lieferfz-card__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.35rem;
  margin-bottom: 0.35rem;
}
.mala-lieferfz-card__kz {
  font-weight: 700;
  font-size: 0.95rem;
  color: var(--text);
}
.mala-lieferfz-card__title {
  font-weight: 600;
  color: var(--text);
  margin-bottom: 0.12rem;
}
.mala-lieferfz-card__typ {
  font-size: 0.78rem;
  margin-bottom: 0.4rem;
}
.mala-lieferfz-card__detail {
  margin-top: 0.2rem;
  font-size: 0.78rem;
  color: var(--muted);
}
.mala-lieferfz-card__detail .mono {
  font-family: ui-monospace, monospace;
  color: var(--text);
}
.mala-lieferfz-card__tours {
  margin-top: 0.5rem;
  padding-top: 0.45rem;
  border-top: 1px solid var(--border);
  font-size: 0.84rem;
  color: var(--text);
}
.mala-lieferfz-legend {
  display: inline-block;
  width: 0.85rem;
  height: 0.85rem;
  border-radius: 4px;
  vertical-align: middle;
  margin-right: 0.15rem;
  border: 1px solid var(--border);
}
.mala-lieferfz-legend--ein {
  background: rgba(40, 160, 90, 0.35);
  border-color: rgba(40, 160, 90, 0.5);
}
.mala-lieferfz-legend--split {
  background: rgba(220, 175, 55, 0.45);
  border-color: rgba(190, 140, 45, 0.55);
}
.mala-lieferfz-legend--tp {
  background: rgba(91, 127, 217, 0.4);
  border-color: rgba(91, 127, 217, 0.55);
}
.mala-lieferfz-table tbody tr.mala-lieferfz-row--ok {
  background: rgba(40, 160, 90, 0.08);
}
.mala-lieferfz-table tbody tr.mala-lieferfz-row--warn {
  background: rgba(200, 120, 40, 0.1);
}
.mala-lieferfz-badge {
  display: inline-block;
  padding: 0.12rem 0.45rem;
  border-radius: 6px;
  font-size: 0.72rem;
  font-weight: 600;
}
.mala-lieferfz-badge--ok {
  color: var(--text);
  background: rgba(40, 160, 90, 0.22);
  border: 1px solid rgba(40, 160, 90, 0.45);
}
.mala-lieferfz-badge--warn {
  color: var(--text);
  background: rgba(200, 120, 40, 0.2);
  border: 1px solid rgba(200, 120, 40, 0.45);
}
.mala-lieferfz-badge--info {
  color: var(--text);
  background: rgba(91, 127, 217, 0.22);
  border: 1px solid rgba(91, 127, 217, 0.45);
}

.mala-lieferfz-prod-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.84rem;
}
.mala-lieferfz-prod-table th,
.mala-lieferfz-prod-table td {
  border: 1px solid var(--border);
  padding: 0.35rem 0.45rem;
  text-align: left;
  vertical-align: middle;
}
.mala-lieferfz-prod-table th {
  background: var(--surface-2, rgba(0, 0, 0, 0.04));
  font-weight: 600;
}
.mala-lieferfz-prod-inp {
  width: 100%;
  min-width: 6rem;
  box-sizing: border-box;
  padding: 0.25rem 0.35rem;
  font-size: 0.84rem;
}

.mala-kunden-panel[hidden],
.mala-kunden-panel.hidden {
  display: none !important;
}

.mala-kunden-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: 0.45rem 0.75rem;
  align-items: end;
}

.mala-kunden-grid--3 {
  grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
}

.mala-kunden-field {
  display: flex;
  flex-direction: column;
  gap: 0.18rem;
  font-size: 0.72rem;
  color: var(--muted);
}

.mala-kunden-field > span {
  font-weight: 600;
  color: var(--text);
}

.mala-kunden-field > input,
.mala-kunden-field > select,
.mala-kunden-field > textarea {
  width: 100%;
  box-sizing: border-box;
  padding: 0.35rem 0.45rem;
  border-radius: 8px;
  border: 1px solid var(--border);
  background: var(--surface);
  color: var(--text);
  font-size: 0.88rem;
}

.mala-kunden-field--sm {
  max-width: 120px;
}

.mala-kunden-kundenbereich-wrap {
  grid-column: 1 / -1;
}

.mala-kunden-kundenbereich-wrap .mala-kunden-checks {
  margin-top: 0.25rem;
}

.mala-kunden-er-post-row {
  margin: 0 0 0.65rem;
  padding-bottom: 0.5rem;
  border-bottom: 1px solid var(--border);
}

.mala-kunden-field--full {
  grid-column: 1 / -1;
}

.mala-kunden-field--full textarea {
  min-height: 10rem;
  resize: vertical;
}

.mala-kunden-subh {
  margin: 0.5rem 0 0.35rem;
  font-size: 0.85rem;
  font-weight: 600;
}

.mala-kunden-faktura-stack,
.mala-kunden-adresse-stack,
.mala-kunden-fibu-stack,
.mala-kunden-diverses-stack {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.mala-kunden-card {
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 0.9rem 1rem;
  background: var(--surface);
}

.mala-kunden-card--kredit {
  margin-bottom: 0.25rem;
}

.mala-kunden-kredit-head {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem 1.25rem;
  justify-content: space-between;
  align-items: flex-start;
}

.mala-kunden-kredit-head-main {
  flex: 1 1 220px;
  min-width: 0;
}

.mala-kunden-kredit-sperre {
  flex: 0 1 280px;
  margin-left: auto;
  text-align: right;
  padding: 0.65rem 0.75rem;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: rgba(0, 0, 0, 0.08);
}

html[data-theme='light'] .mala-kunden-kredit-sperre {
  background: rgba(0, 0, 0, 0.04);
}

.mala-kunden-kredit-sperre__title {
  margin: 0 0 0.5rem;
  font-size: 0.88rem;
  font-weight: 600;
  text-align: right;
}

.mala-kunden-kredit-sperre__chk {
  justify-content: flex-end;
  text-align: left;
}

.mala-kunden-kredit-sperre__grund {
  text-align: right;
}

.mala-kunden--gesperrt .mala-kunden-tab {
  background: rgba(185, 28, 28, 0.28) !important;
  border-color: rgba(127, 29, 29, 0.45);
}

.mala-kunden--gesperrt .mala-kunden-tab:hover {
  background: rgba(185, 28, 28, 0.38) !important;
}

.mala-kunden-readonly-banner {
  margin: 0;
  padding: 0.35rem 0 0;
  max-width: 42rem;
}

.mala-kunden--readonly .mala-kunden-panels input,
.mala-kunden--readonly .mala-kunden-panels textarea,
.mala-kunden--readonly .mala-kunden-panels select {
  cursor: default;
}

.mala-kunden--gesperrt .mala-kunden-tab--active {
  background: rgba(185, 28, 28, 0.48) !important;
  border-color: rgba(127, 29, 29, 0.65);
  font-weight: 600;
}

.mala-kunden-card__title {
  margin: 0 0 0.65rem;
  font-size: 0.95rem;
  font-weight: 600;
  color: var(--text);
}

.mala-kunden-card__hint {
  margin: 0 0 0.65rem;
  font-size: 0.82rem;
  line-height: 1.35;
}

.mala-kunden-card__lead {
  margin: 0 0 0.65rem;
  font-size: 0.82rem;
  line-height: 1.35;
}

.mala-kunden-card__foot {
  margin: 0.5rem 0 0;
  font-size: 0.82rem;
}

.mala-kunden-card__intro {
  margin: 0 0 0.75rem;
  font-size: 0.82rem;
  line-height: 1.4;
}

.mala-kunden-card__actions {
  margin-top: 0.75rem;
  padding-top: 0.5rem;
  border-top: 1px solid var(--border);
}

.mala-kunden-fieldset--card {
  margin: 0.5rem 0 0.65rem;
}

.mala-kunden-er-bh-detail {
  margin-top: 0.35rem;
}

.mala-kunden-er-format-agb-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.45rem 1rem;
}

.mala-kunden-er-agb-sep {
  flex: 0 0 1px;
  width: 1px;
  align-self: stretch;
  min-height: 1.15em;
  margin: 0 0.1rem;
  background: var(--border);
}

html[data-theme='light'] .mala-kunden-card {
  background: var(--card);
}

.mala-kunden-card__title--spaced {
  margin-top: 0.65rem;
}

.mala-kunden-adresse-footer {
  margin-bottom: 0.15rem;
}

.mala-kunden-checks--card {
  margin: 0.35rem 0 0.5rem;
  padding-top: 0.35rem;
  border-top: 1px dashed var(--border);
}

.mala-kunden-card--fuel .mala-kunden-grid {
  margin-top: 0.25rem;
}

.mala-kunden-fuel {
  margin-top: 0.4rem;
  padding: 0.5rem 0.65rem;
  border: 1px dashed var(--border);
  border-radius: 10px;
  background: rgba(0, 0, 0, 0.12);
}

html[data-theme='light'] .mala-kunden-fuel {
  background: rgba(0, 0, 0, 0.03);
}

.mala-kunden-geo {
  margin-top: 0.65rem;
  border-top: 1px solid var(--border);
  padding-top: 0.6rem;
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem 0.75rem;
  align-items: center;
}

.mala-kunden-geo-btns {
  display: inline-flex;
  gap: 0.35rem;
}

.mala-kunden-owner-row {
  flex: 1 1 100%;
}

.mala-kunden-checks {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem 0.75rem;
  margin-top: 0.4rem;
}

.mala-kunden-check {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  font-size: 0.78rem;
  cursor: pointer;
}

.mala-kunden-struktur {
  display: flex;
  flex-direction: column;
  gap: 0.65rem;
}

.mala-kunden-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  align-items: center;
  margin-top: 0.75rem;
  padding-top: 0.6rem;
  border-top: 1px solid var(--border);
}

.mala-kunden-save-hint {
  font-size: 0.85rem;
}

.modal-panel--map {
  width: min(96vw, 920px);
  max-width: 96vw;
}

.mala-kunden-map-frame {
  width: 100%;
  height: min(60vh, 420px);
  border: 0;
  border-radius: 8px;
  background: #111;
}

@media (max-width: 640px) {
  .mala-kunden-tab {
    font-size: 0.72rem;
    padding: 0.3rem 0.4rem;
  }
}

.mala-kunden-kredit-block {
  margin-bottom: 0.75rem;
  padding: 0.5rem 0.65rem;
  border: 1px solid var(--border);
  border-radius: 10px;
  background: rgba(0, 0, 0, 0.06);
}

html[data-theme='light'] .mala-kunden-kredit-block {
  background: rgba(0, 0, 0, 0.03);
}

.mala-kunden-kredit-row {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  align-items: flex-end;
}

.mala-kunden-kredit-ampel {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem 0.75rem;
  align-items: center;
}

.mala-kunden-kredit-swatches {
  display: inline-flex;
  gap: 0.4rem;
  align-items: center;
}

.mala-kunden-kredit-swatch {
  position: relative;
  width: 2rem;
  height: 2rem;
  border-radius: 6px;
  cursor: pointer;
  border: 2px solid var(--border);
  padding: 0;
  margin: 0;
  display: inline-block;
  box-sizing: border-box;
}

.mala-kunden-kredit-swatch input {
  position: absolute;
  opacity: 0;
  width: 100%;
  height: 100%;
  margin: 0;
  cursor: pointer;
}

button.mala-kunden-kredit-swatch {
  cursor: pointer;
  flex-shrink: 0;
}

.mala-kunden-kredit-swatch--current {
  outline: 2px solid var(--accent, #1976d2);
  outline-offset: 2px;
}

.mala-kunden-kredit-swatch--weiss {
  background: #fff;
}

.mala-kunden-kredit-swatch--rot {
  background: #c62828;
  border-color: #8e0000;
}

.mala-kunden-kredit-swatch--gelb {
  background: #f9a825;
  border-color: #c17900;
}

.mala-kunden-kredit-swatch--gruen {
  background: #2e7d32;
  border-color: #1b5e20;
}

.mala-kunden-la-nb-table th[scope='row'] {
  text-align: left;
  font-weight: 600;
}

.mala-kunden-la-modal {
  max-height: min(90vh, 880px);
  overflow: auto;
}

/* Admin: mala-Stammdaten (Einstellungen-Modals) */
.sett-admin-mala-btns {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem;
}

.stc-admin-mala-modal.modal-panel--wide {
  width: min(720px, calc(100% - 2rem));
  max-height: min(90vh, 880px);
  overflow: auto;
}

.stc-admin-mala-table-wrap {
  overflow-x: auto;
  margin: 0.5rem 0;
}

.stc-admin-mala-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.88rem;
}

.stc-admin-mala-table th,
.stc-admin-mala-table td {
  padding: 0.35rem 0.5rem;
  border: 1px solid var(--border);
  text-align: left;
}

.stc-admin-mala-table thead th {
  background: var(--surface-elevated, var(--surface));
}

.stc-admin-mala-table tfoot th {
  font-weight: 600;
}

.stc-admin-mala-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  gap: 0.65rem;
  margin-top: 0.35rem;
}

.stc-admin-mala-subh {
  margin: 0.85rem 0 0.4rem;
  font-size: 0.95rem;
  font-weight: 600;
}

.stc-admin-mala-typ-inline {
  margin: 0.65rem 0;
  padding: 0.65rem;
  border: 1px dashed var(--border);
  border-radius: 8px;
  display: grid;
  grid-template-columns: 1fr 1fr auto auto;
  gap: 0.5rem;
  align-items: end;
}

@media (max-width: 640px) {
  .stc-admin-mala-typ-inline {
    grid-template-columns: 1fr;
  }
}

/* mala Oil · OMR einlesen (Omr PDF) */
.sidebar-nav-item--sub2 {
  padding-left: 2.15rem;
}

.mala-omr-panel {
  max-width: 100%;
}

.mala-omr-hint {
  margin: 0 0 1rem;
  max-width: 52rem;
  padding: 0.65rem 0.85rem;
  font-size: 0.88rem;
  line-height: 1.45;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: rgba(0, 0, 0, 0.06);
  box-sizing: border-box;
}

.mala-omr-hint kbd {
  display: inline-block;
  padding: 0.08em 0.35em;
  font-size: 0.9em;
  font-family: inherit;
  border: 1px solid var(--border);
  border-radius: 4px;
  background: rgba(255, 255, 255, 0.06);
}

html[data-theme='light'] .mala-omr-hint {
  background: rgba(0, 0, 0, 0.04);
}

.mala-omr-hint-kbd {
  display: block;
  margin-top: 0.5rem;
  font-size: 0.86em;
  opacity: 0.92;
}

.mala-omr-toolbar {
  max-width: 100%;
  margin-bottom: 1rem;
  padding: 0.65rem 0.75rem;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: rgba(0, 0, 0, 0.04);
  box-sizing: border-box;
}

html[data-theme='light'] .mala-omr-toolbar {
  background: rgba(0, 0, 0, 0.02);
}

.mala-omr-toolbar-row {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: 0.45rem 0.75rem;
  margin-bottom: 0.55rem;
}

.mala-omr-toolbar-row:last-child {
  margin-bottom: 0;
}

.mala-omr-toolbar-row--date {
  align-items: center;
}

.mala-omr-field {
  display: flex;
  flex-direction: column;
  gap: 0.2rem;
  min-width: 0;
}

.mala-omr-field-label,
.mala-omr-label {
  font-size: 0.78rem;
  font-weight: 600;
  opacity: 0.88;
}

.mala-omr-label {
  align-self: center;
  margin-right: 0.15rem;
}

.mala-omr-input {
  min-width: 12rem;
  max-width: min(28rem, 100%);
  font: inherit;
  font-size: 0.88rem;
  padding: 0.35rem 0.45rem;
  border: 1px solid var(--border);
  border-radius: 6px;
  background: var(--panel);
  color: inherit;
}

.mala-omr-toolbar input[type='date'].mala-omr-input {
  min-width: 10.5rem;
}

.mala-omr-toolbar select.mala-omr-input {
  min-width: 14rem;
  max-width: min(22rem, 100%);
}

.mala-omr-toolbar-row--region-product {
  align-items: flex-end;
}

.mala-omr-region-presets {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.35rem;
  flex: 1 1 14rem;
}

.mala-omr-region-presets-label {
  width: 100%;
  margin-bottom: 0.1rem;
  font-size: 0.78rem;
  font-weight: 600;
  opacity: 0.88;
}

@media (min-width: 960px) {
  .mala-omr-region-presets-label {
    width: auto;
    margin-bottom: 0;
    margin-right: 0.25rem;
  }
}

.mala-omr-prod-presets {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.35rem;
  flex: 1 1 12rem;
}

.mala-omr-presets-label {
  width: 100%;
  margin-bottom: 0.1rem;
  font-size: 0.78rem;
  font-weight: 600;
  opacity: 0.88;
}

@media (min-width: 720px) {
  .mala-omr-presets-label {
    width: auto;
    margin-bottom: 0;
    margin-right: 0.25rem;
  }
}

.mala-omr-toolbar-omr {
  align-items: center;
  gap: 0.35rem;
}

/* OMR-Art: aktive Schnellwahl blau wie andere Filter-Schnellwahlen */
.mala-omr-toolbar .mala-omr-kind {
  border: 1px solid transparent;
}

.mala-omr-toolbar .mala-omr-kind.mala-omr-kind--active {
  background: var(--accent);
  border-color: transparent;
  color: #fff;
  box-shadow: none;
}

.mala-omr-toolbar .mala-omr-kind.mala-omr-kind--active:hover {
  filter: brightness(0.95);
}

html[data-theme='light'] .mala-omr-toolbar .mala-omr-kind.mala-omr-kind--active {
  border-color: var(--accent);
}

.mala-omr-nav {
  display: inline-flex;
  gap: 0.25rem;
  align-items: center;
}

.mala-omr-modal-title {
  font-size: 1.05rem;
  font-weight: 600;
  margin: 0 0 0.45rem;
}

.mala-omr-modal-lead {
  margin: 0 0 0.85rem;
  font-size: 0.9rem;
}

.mala-omr-modal-dl {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 0.35rem 1rem;
  margin: 0 0 1rem;
  font-size: 0.9rem;
}

.mala-omr-modal-dl dt {
  margin: 0;
  opacity: 0.82;
  font-weight: 500;
}

.mala-omr-modal-dl dd {
  margin: 0;
}

.mala-omr-modal-note {
  margin: 0 0 0.65rem;
  font-size: 0.88rem;
  line-height: 1.4;
}

.mala-omr-modal-warn {
  margin: 0 0 0.85rem;
  padding: 0.5rem 0.65rem;
  border-radius: 6px;
  background: rgba(255, 183, 77, 0.12);
  font-size: 0.88rem;
  line-height: 1.4;
}

.mala-omr-pdf-offer {
  margin: 0 0 0.65rem;
  font-size: 0.86rem;
  line-height: 1.45;
}

.mala-omr-modal-q {
  margin: 0.25rem 0 0;
  font-size: 0.92rem;
}

.mala-omr-intro {
  margin: 0 0 1rem;
  max-width: 52rem;
}

.mala-omr-form {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem 1rem;
  align-items: flex-end;
  margin-bottom: 1.5rem;
}

.mala-omr-form--paste {
  flex-direction: column;
  align-items: stretch;
  margin-top: 1.25rem;
  margin-bottom: 0;
}

.mala-omr-paste-label {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
  font-size: 0.9rem;
  width: 100%;
}

.mala-omr-textarea {
  width: 100%;
  max-width: 52rem;
  min-height: 9rem;
  font-family: inherit;
  font-size: 0.85rem;
  line-height: 1.4;
  padding: 0.5rem 0.6rem;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: var(--panel);
  color: inherit;
  resize: vertical;
}

.mala-omr-file-label {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
  font-size: 0.9rem;
}

.mala-omr-file-label input[type='file'] {
  max-width: 28rem;
}

.mala-omr-h2 {
  font-size: 1rem;
  margin: 0 0 0.65rem;
  font-weight: 600;
}

.mala-omr-h3 {
  font-size: 0.95rem;
  margin: 1.25rem 0 0.5rem;
  font-weight: 600;
}

.mala-omr-table-wrap {
  overflow-x: auto;
  border: 1px solid var(--border);
  border-radius: 8px;
  margin-bottom: 1rem;
}

.mala-omr-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.85rem;
}

.mala-omr-table th,
.mala-omr-table td {
  padding: 0.4rem 0.5rem;
  text-align: left;
  border-bottom: 1px solid var(--border);
}

.mala-omr-table th {
  background: rgba(0, 0, 0, 0.12);
  font-weight: 600;
}

/* ±-Spalten: Vorzeichen (Dark = Standard) */
.mala-omr-table td.mala-omr-delta--pos {
  background: rgba(63, 185, 80, 0.22);
}

.mala-omr-table td.mala-omr-delta--neg {
  background: rgba(248, 81, 73, 0.2);
}

html[data-theme='light'] .mala-omr-table td.mala-omr-delta--pos {
  background: rgba(34, 139, 34, 0.14);
}

html[data-theme='light'] .mala-omr-table td.mala-omr-delta--neg {
  background: rgba(220, 53, 69, 0.12);
}

.mala-omr-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.35rem;
  vertical-align: middle;
}

.mala-omr-pdf-missing {
  opacity: 0.45;
  cursor: not-allowed;
  pointer-events: none;
}

html[data-theme='light'] .mala-omr-table th {
  background: rgba(0, 0, 0, 0.05);
}

.mala-omr-table--dense {
  font-size: 0.78rem;
}

.mala-omr-warn {
  color: #ffb74d;
}

.mala-omr-err {
  color: #ef9a9a;
  margin: 0.5rem 0;
}

tr.mala-omr-import-row.mala-omr-import-row--active td {
  background: rgba(90, 140, 255, 0.14);
  box-shadow: inset 3px 0 0 rgba(100, 160, 255, 0.75);
}

html[data-theme='light'] tr.mala-omr-import-row.mala-omr-import-row--active td {
  background: rgba(0, 70, 180, 0.09);
  box-shadow: inset 3px 0 0 rgba(0, 100, 200, 0.55);
}

tr.mala-omr-detail-below td.mala-omr-detail-below-cell {
  padding: 0.75rem 1rem 1rem;
  vertical-align: top;
  background: var(--surface);
  border-top: 1px dashed var(--border);
}

.mala-omr-detail-inner {
  max-width: 100%;
}

tr.mala-omr-import-row {
  cursor: pointer;
}

button.mala-omr-pdf-open--missing {
  opacity: 0.78;
}

button.mala-omr-pdf-open--missing:hover {
  opacity: 1;
}

.modal-panel--omr-pdf {
  width: min(1200px, calc(100% - 2rem));
  max-height: min(92vh, 960px);
  display: flex;
  flex-direction: column;
  padding: 0.75rem 1rem 1rem;
  overflow: hidden;
}

.mala-omr-pdf-modal-head {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
  gap: 0.5rem;
  flex-shrink: 0;
  margin-bottom: 0.5rem;
}

.mala-omr-pdf-modal-title {
  font-weight: 600;
}

.mala-omr-pdf-iframe {
  flex: 1 1 auto;
  min-height: min(85vh, 780px);
  width: 100%;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: #1a1a1a;
}

html[data-theme='light'] .mala-omr-pdf-iframe {
  background: #e8e8e8;
}

.modal-panel--omr-pdf .modal-actions {
  flex-shrink: 0;
  margin-top: 0.6rem;
  padding-top: 0;
}

.modal-panel--omr-row {
  width: min(1240px, calc(100% - 2rem));
  max-height: min(94vh, 980px);
  overflow-y: auto;
}

/* Zeilen-/PDF-Modal: nicht durch .modal-panel--omr-import (480px) begrenzen */
.modal-panel--omr-import.modal-panel--omr-row {
  max-width: min(1240px, calc(100% - 2rem));
}

@media (min-width: 768px) {
  .modal-panel--omr-row {
    min-width: 680px;
  }
}

.mala-omr-row-meta {
  font-size: 0.82rem;
  margin-bottom: 0.45rem;
}

.mala-omr-pdf-ok {
  color: #9be7a3;
}

.mala-omr-row-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.45rem;
  margin-bottom: 0.6rem;
}

.mala-omr-row-pdf-wrap {
  margin-top: 0.55rem;
}

.mala-omr-row-pdf-wrap.is-hidden {
  display: none;
}

.mala-omr-row-pdf-tools {
  display: flex;
  gap: 0.45rem;
  margin-bottom: 0.35rem;
}
/* CAROENERGY 1.8.15 · Multi-warehouse and follow-up controls */
.energy-warehouse-form,.energy-warehouse-filter{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,195px),1fr));gap:14px;align-items:end}
.energy-warehouse-form>[data-wh-choice],.energy-warehouse-form>[data-wh-book-status],.energy-warehouse-form>[data-book-button],.energy-warehouse-form>label:first-child{grid-column:1/-1}
.energy-warehouse-selected{display:flex;gap:12px;align-items:center;flex-wrap:wrap;padding:10px;border:1px solid var(--border,#cbd3cd);border-radius:12px}
.energy-stock-badge{display:inline-flex;padding:2px 7px;border-radius:10px;background:rgba(139,203,15,.16);margin:2px 4px 2px 0;color:inherit}
.energy-stock-search{display:block;font-size:.83rem;margin:3px 0;line-height:1.5}
.energy-warehouse-bars{display:grid;gap:8px;margin:20px 0;max-width:900px}
.energy-warehouse-bar{display:grid;grid-template-columns:minmax(65px,125px) 1fr minmax(50px,90px);gap:10px;align-items:center;font-size:13px}
.energy-warehouse-bar>span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.energy-warehouse-bar>div{height:12px;background:rgba(100,114,105,.14);border-radius:9px;overflow:hidden}
.energy-warehouse-bar i{height:100%;display:block;background:#a6ff1a;border-radius:9px}
.energy-warehouse-bar strong{text-align:right;font-variant-numeric:tabular-nums}
.energy-followup-control{display:flex;gap:8px;align-items:end;flex-wrap:wrap;margin-bottom:14px}
.energy-followup-control>label{flex:1;min-width:135px}
.energy-followup-item{display:flex;justify-content:space-between;gap:8px;align-items:center;padding:9px 0;border-bottom:1px solid var(--border,#d4dbd5);flex-wrap:wrap}
.energy-overdue{color:#9c2929}
.energy-warehouse-filter .energy-checkbox{align-self:end;padding:7px 0}
@media(max-width:600px){.energy-warehouse-bar{grid-template-columns:75px minmax(60px,1fr) 55px;font-size:11px}.energy-followup-control{align-items:stretch}.energy-followup-control>label{flex-basis:100%}.energy-warehouse-form{grid-template-columns:1fr}}

/* CAROENERGY 1.8.16: Scanner workflow and compact mobile header */
.energy-warehouse-primary {display:block;max-width:590px;margin-bottom:20px;}
.energy-warehouse-primary select{min-height:48px;width:100%;}
.energy-warehouse-form{grid-template-columns:repeat(2,minmax(0,1fr));gap:22px 18px;align-items:start;}
.energy-warehouse-form>label,.energy-warehouse-filter>label{min-width:0;display:flex;flex-direction:column;gap:8px;}
.energy-warehouse-form>label:first-child{grid-column:auto;}
.energy-warehouse-form>.energy-wh-article,.energy-warehouse-form>[data-wh-choice],.energy-warehouse-form>[data-wh-book-status],.energy-warehouse-form>[data-book-button]{grid-column:1/-1;}
.energy-warehouse-form>label input,.energy-warehouse-form>label select{min-height:46px;width:100%;box-sizing:border-box;}
.energy-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(175px,1fr));gap:12px;margin:20px 0;}
.energy-stat{min-height:72px;display:flex;flex-direction:column;justify-content:center;gap:10px;padding:14px 16px;}
.energy-stat strong{font-size:1.25rem;line-height:1.15;display:block;}
.energy-stat small{line-height:1.4;display:block;}
.energy-scanner-footer{display:flex;gap:12px;align-items:center;justify-content:center;padding:10px;}
@media(max-width:700px){
  .app-topbar{align-items:center;gap:6px;padding:8px;min-width:0;max-width:100%;}
  .app-topbar-main,.app-topbar-actions{min-width:0;max-width:100%;gap:6px;}
  .app-topbar-actions{flex-wrap:nowrap;}
  .app-topbar-actions>.btn,.app-topbar-actions>button{min-width:32px;max-width:44px;overflow:hidden;}
  .topbar-page-title{font-size:clamp(.95rem,3.8vw,1.15rem);}
  .topbar-tkp-strip{min-width:0;}
  .energy-warehouse-form{grid-template-columns:1fr;gap:18px;}
  .energy-warehouse-filter{grid-template-columns:1fr;gap:16px;}
  .energy-page-intro{display:flex;flex-wrap:wrap;gap:12px;}
}
body.energy-scanner-fullscreen .sidebar,body.energy-scanner-fullscreen .app-topbar,body.energy-scanner-fullscreen .sidebar-topbar{display:none!important;}
body.energy-scanner-fullscreen .energy-page-intro .energy-actions{display:none;}
body.energy-scanner-fullscreen .energy-page-intro{padding:4px 0 10px;}
body.energy-scanner-fullscreen .energy-page-intro p{display:none;}
body.energy-scanner-fullscreen .main-panel,body.energy-scanner-fullscreen .mala-spa-content,body.energy-scanner-fullscreen .app-panels-wrap{height:100dvh;max-height:100dvh;min-height:0;overflow-y:auto!important;}
body.energy-scanner-fullscreen .energy-warehouse-scan-panel{margin:0;}
body.energy-scanner-fullscreen .energy-warehouse-form{gap:12px;}
body.energy-scanner-fullscreen .energy-scanner-footer{position:sticky;bottom:0;background:var(--card,#fff);z-index:4;box-shadow:0 -2px 12px rgba(0,0,0,.08);}
body.energy-scanner-fullscreen .energy-warehouse-form>label input,body.energy-scanner-fullscreen .energy-warehouse-form>label select{min-height:48px;font-size:16px;}

.energy-slot-pills{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}.energy-slot-pills span{display:inline-flex;padding:4px 8px;border-radius:8px;border:1px solid var(--border,#ddd);font-size:12px}

.energy-inventory-actions{display:flex;flex-wrap:wrap;align-items:end;gap:12px;margin-bottom:18px}.energy-inventory-actions>label{min-width:230px;flex:1}.energy-inventory-form{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,210px),1fr));gap:15px}.energy-inventory-form>[data-inventory-chosen],.energy-inventory-form>[data-inventory-status]{grid-column:1/-1}

/* CaroEnergy 1.8.18: warehouse stock aligned next to product document badges. */
.energy-article-suggestions [role=option] .energy-suggestion-summary{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;width:100%;min-width:0}
.energy-article-suggestions [role=option] .energy-article-search-meta{flex:1 1 190px;min-width:0;margin-top:0}
.energy-article-suggestions [role=option] .energy-stock-search{display:flex;align-items:center;justify-content:flex-end;flex:0 1 auto;gap:5px;flex-wrap:wrap;margin:0 0 0 auto;font-size:.78rem;max-width:100%}
.energy-article-suggestions [role=option] .energy-stock-badge{margin:0;white-space:normal;text-align:center;border:1px solid rgba(70,116,12,.2);padding:3px 8px;font-weight:600}
@media(max-width:650px){
 .energy-article-suggestions{box-sizing:border-box;max-width:calc(100vw - 16px)}
 .energy-article-suggestions [role=option]{padding:10px 8px}
 .energy-article-suggestions [role=option] .energy-suggestion-summary{gap:6px}
 .energy-article-suggestions [role=option] .energy-stock-search{flex:1 1 100%;justify-content:flex-end;font-size:.76rem}
 .energy-article-suggestions [role=option] .energy-article-search-meta{flex:1 1 100%}
}

/* Dedicated CaroEnergy scanner PWA (not the normal full-featured Web-App). */
body.energy-scanner-fullscreen .energy-section-tabs,
body.energy-scanner-fullscreen .energy-subtabs,
body.energy-scanner-fullscreen .energy-navigation,
body.energy-scanner-fullscreen .energy-scanner-footer,
body.energy-scanner-fullscreen .energy-page-intro{display:none!important}
body.energy-scanner-fullscreen .app-main-column{width:100%;max-width:none;min-width:0;margin:0;padding:0}
body.energy-scanner-fullscreen .app-panels-wrap,
body.energy-scanner-fullscreen #mala-spa-content,
body.energy-scanner-fullscreen .main-panel{box-sizing:border-box;width:100%;max-width:100%;min-width:0;height:100dvh!important;max-height:100dvh!important;overflow:hidden!important;margin:0!important;padding:0!important}
body.energy-scanner-fullscreen #energy-workspace-root{height:100dvh;min-width:0;display:flex;flex-direction:column;overflow:hidden;gap:0}
body.energy-scanner-fullscreen .energy-warehouse-scan-panel,
body.energy-scanner-fullscreen .energy-inventory-panel{flex:1 1 auto;min-height:0;overflow:auto;overscroll-behavior:contain;margin:0!important;border:0;border-radius:0}
body.energy-scanner-fullscreen .energy-warehouse-scan-panel>.energy-panel-body,
body.energy-scanner-fullscreen .energy-inventory-panel>.energy-panel-body{padding:12px clamp(12px,3vw,26px) 20px}
.energy-scanner-nav{background:var(--surface,#fff);border-bottom:1px solid var(--border,#dfe5d9);padding:9px clamp(12px,3vw,26px);display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:10px;flex:0 0 auto;z-index:5}
.energy-scanner-brand{display:flex;align-items:center;gap:9px;font-size:.88rem}.energy-scanner-brand img{object-fit:contain}
.energy-scanner-buttons{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.energy-scanner-buttons .btn{font-size:.78rem;min-height:37px;text-decoration:none}
body.energy-scanner-fullscreen .energy-warehouse-form{gap:10px;grid-template-columns:repeat(2,minmax(0,1fr))}
body.energy-scanner-fullscreen .energy-warehouse-form>[data-wh-choice],
body.energy-scanner-fullscreen .energy-warehouse-form>button,
body.energy-scanner-fullscreen .energy-warehouse-form>[data-wh-book-status]{grid-column:1/-1}
body.energy-scanner-fullscreen .energy-warehouse-primary{margin-bottom:7px}
@media(max-width:600px){.energy-scanner-nav{align-items:flex-start;flex-direction:column}.energy-scanner-buttons{width:100%;display:grid;grid-template-columns:1fr 1fr auto}.energy-scanner-buttons .btn{font-size:.72rem;padding:7px 4px;justify-content:center}.energy-scanner-brand{font-size:.8rem}body.energy-scanner-fullscreen .energy-warehouse-form{grid-template-columns:1fr;gap:8px}}

/* Compact actions kept at the beginning of the sales dialog header. */
.mala-kunden-keybar-row .mala-kunden-keybar-actions--records{margin-left:0;flex:0 1 auto;flex-wrap:wrap;gap:5px}
.mala-kunden-keybar-actions--records>.btn{white-space:nowrap}
@media(max-width:700px){.mala-kunden-keybar-row .mala-kunden-keybar-actions--records{flex:1 1 100%;max-width:100%;overflow-x:auto;flex-wrap:nowrap;padding-bottom:2px}.mala-kunden-keybar-actions--records .btn{flex:none}}

/* 1.8.21: consistent stock badges in all live article previews. */
.mala-kunden-pick-item .energy-stock-search{display:flex;justify-content:flex-end;gap:6px;flex-wrap:wrap;margin-left:auto;max-width:100%}
.mala-kunden-pick-item .energy-stock-badge{border:1px solid rgba(70,116,12,.25);border-radius:7px;padding:3px 8px;font-weight:600}
.mala-kunden-tab[disabled]{opacity:.50;cursor:not-allowed}
@media(max-width:650px){.mala-kunden-pick-item .energy-stock-search{width:100%;justify-content:flex-end}}

/* CAROENERGY 1.8.25: Tankstellen > Tankinhalte / Messzeiten.
   Deliberately scoped: the existing Lager > Tankbestände board stays unchanged. */
.tankcontents-dashboard { padding: 1rem; }
.tankcontents-top { display: flex; justify-content: space-between; align-items: center; gap: 1rem; margin-bottom: .85rem; }
.tankcontents-top h2 { font-size: 1.17rem; line-height: 1.4; margin: 0; }
.tankcontents-top p { margin: .2rem 0 0; font-size: .87rem; }
.tankcontents-summary { display: flex; flex-wrap: wrap; gap: .6rem; margin: 0 0 1.05rem; }
.tankcontents-summary > span { display: flex; align-items: center; gap: .45rem; background: var(--surface); border: 1px solid var(--border); border-radius: 9px; padding: .42rem .8rem; font-size: .84rem; font-weight: 600; }
.tankcontents-grid { display: grid; grid-template-columns: repeat(auto-fit,minmax(min(100%,390px),1fr)); gap: 1rem; align-items: start; }
.tankcontents-station { min-width: 0; border-radius: 13px; border: 1px solid var(--border); background: var(--surface); padding: 1rem; box-shadow: 0 2px 10px rgba(0,0,0,.035); }
.tankcontents-station--green { border-left: 4px solid #26834e; }
.tankcontents-station--yellow { border-left: 4px solid #bb8d14; background: linear-gradient(rgba(204,156,0,.065),rgba(204,156,0,.065)), var(--surface); }
.tankcontents-station--red { border: 1px solid rgba(195,45,45,.48); border-left: 4px solid #c43e39; background: linear-gradient(rgba(200,48,48,.075),rgba(200,48,48,.075)), var(--surface); }
.tankcontents-station-header { display: flex; justify-content: space-between; align-items: flex-start; flex-wrap: wrap; gap: .65rem; border-bottom: 1px solid var(--border); padding-bottom: .7rem; margin-bottom: .7rem; }
.tankcontents-kicker { color: var(--muted); font-size: .69rem; letter-spacing: .045em; text-transform: uppercase; margin: 0 0 .14rem; }
.tankcontents-station h2 { font-size: 1rem; line-height: 1.38; margin: 0; overflow-wrap: anywhere; }
.tankcontents-signal { display: inline-flex; align-items: center; gap: .48rem; border-radius: 999px; padding: .35rem .65rem; font-size: .76rem; font-weight: 700; white-space: normal; }
.tankcontents-signal--green { color: #206e40; background: #e3f3e9; }
.tankcontents-signal--yellow { color: #795600; background: #fff2c2; }
.tankcontents-signal--red { color: #982923; background: #fbe1df; }
.tankcontents-dot { display: inline-block; vertical-align: middle; width: 9px; height: 9px; border-radius: 50%; flex: 0 0 9px; background: currentColor; }
.tankcontents-dot--green { background: #22824c; }
.tankcontents-dot--yellow { background: #be9200; }
.tankcontents-dot--red { background: #c3352c; }
.tankcontents-message { font-size: .85rem; line-height: 1.5; margin: 0 0 .3rem; overflow-wrap: anywhere; }
.tankcontents-lastseen { font-size: .79rem; color: var(--muted); margin-bottom: .8rem; }
.tankcontents-lastseen strong { color: var(--text); font-variant-numeric: tabular-nums; }
.tankcontents-dates { border: 1px solid rgba(190,140,25,.4); border-radius: 8px; padding: .6rem .7rem; margin-bottom: .7rem; background: rgba(208,155,0,.07); font-size: .79rem; }
.tankcontents-dates > strong { display: block; margin-bottom: .3rem; }
.tankcontents-dates p { margin: .2rem 0; overflow-wrap: anywhere; }
.tankcontents-tanks { display: grid; gap: .65rem; }
.tankcontents-tank { background: rgba(120,140,160,.065); border: 1px solid var(--border); border-radius: 10px; padding: .78rem; min-width: 0; }
.tankcontents-tank--low { border-color: rgba(190,54,48,.52); }
.tankcontents-tank-head { display: flex; justify-content: space-between; align-items: flex-start; gap: .6rem; }
.tankcontents-tank-head strong { font-size: .9rem; }
.tankcontents-product { font-size: .78rem; color: var(--muted); margin-top: .12rem; }
.tankcontents-fill { white-space: nowrap; font-variant-numeric: tabular-nums; }
.tankcontents-fill--green { color: #27864f; }
.tankcontents-fill--yellow { color: #b08510; }
.tankcontents-fill--red { color: #c43e39; }
.tankcontents-progress { height: 9px; border-radius: 8px; background: rgba(126,141,153,.2); overflow: hidden; margin: .6rem 0 .78rem; }
.tankcontents-progress-bar { display: block; height: 100%; border-radius: inherit; }
.tankcontents-progress-bar--green { background: #289657; }
.tankcontents-progress-bar--yellow { background: #d4a323; }
.tankcontents-progress-bar--red { background: #d04b40; }
.tankcontents-metrics { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: .56rem .7rem; margin: 0; }
.tankcontents-metrics > div { min-width: 0; }
.tankcontents-metrics dt { font-size: .7rem; color: var(--muted); }
.tankcontents-metrics dd { margin: .07rem 0 0; font-size: .85rem; font-weight: 600; font-variant-numeric: tabular-nums; }
.tankcontents-measured { border-top: 1px solid var(--border); margin: .7rem 0 0; padding-top: .6rem; font-size: .78rem; }
.tankcontents-empty,.tankcontents-no-tanks { color: var(--muted); font-size: .89rem; }
@keyframes tankcontents-signal-blink { 50% { opacity: .45; } }
.tankcontents-signal--blink .tankcontents-dot { animation: tankcontents-signal-blink 1.1s ease-in-out infinite; }
@media (prefers-reduced-motion: reduce) { .tankcontents-signal--blink .tankcontents-dot { animation: none; } }
@media (max-width: 620px) {
  .tankcontents-dashboard { padding: .55rem .15rem; }
  .tankcontents-top { align-items: flex-start; }
  .tankcontents-station { padding: .7rem; }
  .tankcontents-metrics { grid-template-columns: repeat(2,minmax(0,1fr)); }
}
@media (max-width: 370px) { .tankcontents-metrics { grid-template-columns: 1fr; } }

.tankcontents-warning { margin: 0 0 1rem; padding: .65rem .8rem; border: 1px solid rgba(195,45,45,.45); border-radius: 9px; background: rgba(200,48,48,.075); font-size: .84rem; }

/* 1.8.26: offene Auftragsmenge in sämtlichen Live-Artikelsuchen */
.energy-pending-stock-badge{display:inline-flex;align-items:center;border:1px solid #b3a578;background:#fff8df;color:#403513;border-radius:7px;padding:3px 7px;font-size:.76rem;font-weight:600;max-width:100%;white-space:normal;text-align:right}
@media(max-width:650px){.energy-stock-search{flex-wrap:wrap;justify-content:flex-end}}

/* 1.8.26: administration and employee settings dialog ergonomics */
.modal-panel--admin-wide{display:flex;flex-direction:column;width:min(1120px,96vw)!important;max-height:94vh!important}
.modal-panel--admin-wide>.admin-new-tabs-body{flex:1 1 auto;min-height:0;overflow-y:auto;padding:12px 8px 22px}
.admin-new-tabs{flex:none;display:flex;gap:8px;flex-wrap:wrap}
.admin-new-tabs button[aria-selected=true]{background:#eaf8d2;color:#274e0d;border-bottom:2px solid #527d0a}
.admin-new-tabs-body .admin-form{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,250px),1fr));gap:12px}
.admin-new-tabs-body .admin-form>.admin-acl-block{grid-column:1/-1;max-width:100%}
.admin-new-tabs-body .admin-form>#nu-create{justify-self:start}
.admin-new-tabs-body .admin-acl-matrix-wrap{overflow:auto;max-height:min(56vh,630px)}
.modal-panel--settings .energy-settings-body{min-height:0;overflow-y:auto}
.modal-panel--settings .energy-settings-body label{max-width:100%;min-width:0}
.modal-panel--settings .energy-settings-body input:not([type=checkbox]):not([type=radio]),.modal-panel--settings .energy-settings-body select{width:min(100%,600px);max-width:100%}
.modal-panel--settings .energy-settings-body .checkbox-row{display:flex;align-items:center;gap:10px;justify-content:flex-start;min-height:38px;max-width:680px}
.modal-panel--settings .energy-settings-body .checkbox-row>input{flex:0 0 auto;width:18px;height:18px;margin:0}
@media(max-width:650px){.modal-panel--admin-wide{width:99vw!important;max-height:97vh!important}.admin-new-tabs{overflow-x:auto;flex-wrap:nowrap}.admin-new-tabs button{white-space:nowrap}}
/* CAROENERGY 1.8.27: chart controls for analytic/report SVG outside price-OMR charts */
.energy-universal-chart{position:relative;min-width:0}
.energy-universal-chart-tools{display:flex;gap:7px;flex-wrap:wrap;justify-content:flex-end;margin:4px 0 9px}
.energy-universal-chart-tools button{border:1px solid #bed6a1;border-radius:8px;background:#f2fbe8;color:#20401a;padding:7px 11px;min-height:33px;cursor:pointer;font:inherit}
.energy-universal-chart-tools button:focus-visible{outline:2px solid #679f13;outline-offset:2px}
.energy-universal-chart svg{width:100%;max-width:100%;height:auto}
.energy-universal-chart-fullscreen{position:fixed!important;z-index:2147483000;inset:12px!important;overflow:auto;background:var(--surface,#fff);padding:clamp(12px,3vw,28px);border:1px solid #bed6a1;border-radius:14px;box-shadow:0 16px 80px #0004}
.energy-universal-chart-fullscreen svg{max-height:calc(100vh - 120px);width:100%}
.energy-vehicle-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr));gap:12px;margin:12px 0 20px}
.energy-vehicle-card{border:1px solid #dbe5d2;border-radius:12px;padding:14px;display:grid;gap:8px;min-width:0;background:var(--surface,#fff)}
.energy-vehicle-card p{margin:3px 0}.energy-vehicle-intro{display:flex;flex-wrap:wrap;justify-content:space-between;gap:8px;border-bottom:1px solid #dde5d6;padding-bottom:12px}
.energy-vehicle-stock>div{display:flex;justify-content:space-between;gap:12px;padding:8px;border-bottom:1px solid #e3e9de}
.energy-vehicle-card input{max-width:100%;width:100%;box-sizing:border-box}
@media(max-width:600px){.energy-universal-chart-fullscreen{inset:0!important;border-radius:0}.energy-vehicle-cards{grid-template-columns:1fr}}

/* CAROENERGY 1.8.28: broad, horizontal station panels and responsive tank cards */
body:has(#tankstock-root[data-tank-contents="1"]) .main-panel--tankstock {
  width:100%; max-width:none; margin:0; padding:clamp(8px,1.2vw,22px); min-width:0;
}
body:has(#tankstock-root[data-tank-contents="1"]) .mala-spa-content,
body:has(#tankstock-root[data-tank-contents="1"]) #tankstock-root {width:100%;max-width:none;min-width:0;}
#tankstock-root[data-tank-contents="1"] .tankcontents-grid {display:flex;flex-direction:column;gap:16px;width:100%;}
#tankstock-root[data-tank-contents="1"] .tankcontents-station {width:100%;min-width:0;}
#tankstock-root[data-tank-contents="1"] .tankcontents-tanks {display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,290px),1fr));gap:12px;align-items:stretch;}
#tankstock-root[data-tank-contents="1"] .tankcontents-tank {min-width:0;}
@media(max-width:650px){
 #tankstock-root[data-tank-contents="1"] .tankcontents-tanks{grid-template-columns:minmax(0,1fr);}
 #tankstock-root[data-tank-contents="1"] .tankcontents-top{flex-wrap:wrap;}
 #tankstock-root[data-tank-contents="1"] .tankcontents-station{padding:12px;}
}
/* topbar compact controls, contextual date and responsive station fallback */
.app-topbar-actions{align-self:stretch;justify-content:flex-end;align-content:flex-start;position:relative;gap:5px;}
.app-topbar-actions .header-brand-date{flex:0 0 100%;text-align:right;font-size:.73rem;margin-top:-2px;}
.app-topbar-main .header-brand-date{display:none;}
.topbar-tkp-strip{min-width:0;flex:1 1 40%;max-width:none;}
.tkp-status-strip--header{display:flex;flex-wrap:wrap;align-items:center;gap:4px;overflow:hidden;}
.tkp-status-strip--header .tkp-pill{font-size:calc(.78rem * var(--tank-pill-zoom,1));padding:calc(5px * var(--tank-pill-zoom,1)) calc(7px * var(--tank-pill-zoom,1));}
#tkp-header-status-wrap[data-only-warnings="1"] .tkp-pill:not(.tkp-pill--offline):not([class*="warn"]):not([class*="crit"]):not([class*="yellow"]):not([class*="red"]){display:none!important;}
.header-tank-fallback{display:none;}
@media(max-width:1100px){#tkp-header-status-wrap .tkp-status-strip--header{display:none;}#tkp-header-status-wrap .header-tank-fallback{display:inline-flex;}}
@media(max-width:650px){.app-topbar-actions{gap:3px}.app-topbar-actions .header-brand-date{font-size:.65rem;white-space:nowrap;}#tkp-header-status-wrap{flex:0 1 auto;min-width:0;}.app-topbar-actions>.btn{min-width:30px;}}
/* Diagram series options are kept out of the chart canvas. */
.energy-chart-settings-shell[hidden]{display:none!important;}
.energy-chart-settings-shell{position:absolute;inset:0;z-index:7;display:grid;place-items:center;padding:12px;background:rgba(0,0,0,.42);}
.energy-chart-settings-dialog{width:min(760px,100%);max-height:min(84vh,860px);display:flex;flex-direction:column;gap:12px;overflow:hidden;background:var(--surface);border:1px solid var(--border);border-radius:14px;padding:20px;box-shadow:0 15px 60px rgba(0,0,0,.24);}
.energy-chart-settings-dialog .energy-chart-series-picker{display:flex;flex-wrap:wrap;gap:8px;overflow:auto;min-height:65px;padding:8px;}
.energy-chart-settings-actions{display:flex;justify-content:flex-end;gap:8px;flex-wrap:wrap;}
/* User editor: independent ACL and login-hour dialogs */
.energy-admin-subdialog[hidden]{display:none!important;}
.energy-admin-subdialog{position:fixed;inset:0;z-index:2100;background:rgba(15,21,18,.55);display:grid;place-items:center;padding:12px;}
.energy-admin-subdialog-panel{background:var(--surface);color:var(--text);border-radius:14px;width:min(1040px,100%);max-height:92dvh;display:flex;flex-direction:column;padding:18px;gap:12px;box-shadow:0 16px 60px rgba(0,0,0,.32);overflow:hidden;}
.energy-admin-subdialog-body{overflow:auto;min-height:0;flex:1;padding:5px 3px;}
.energy-admin-subdialog .admin-acl-matrix-wrap{overflow:auto;max-height:none;}
.energy-admin-subdialog-head,.energy-admin-subdialog-actions{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;}
.energy-admin-launches{display:flex;gap:8px;flex-wrap:wrap;margin:12px 0;}



#tkp-header-status-wrap.header-tank-overflow .tkp-status-strip--header{display:none;}
#tkp-header-status-wrap.header-tank-overflow .header-tank-fallback{display:inline-flex;}




/* CAROENERGY 1.8.29: redesigned topbar actions and contextual help */
.app-topbar-actions{display:flex;flex-direction:column;align-items:flex-end;justify-content:flex-start;align-self:stretch;gap:0.28rem;min-width:max-content;}
.app-topbar-action-row{display:flex;align-items:center;justify-content:flex-end;gap:0.45rem;flex-wrap:nowrap;}
.app-topbar-action-row>.btn{min-height:2.6rem;padding:.5rem .68rem;display:inline-flex;align-items:center;justify-content:center;}
.energy-help-button{min-width:2.6rem;font-size:1rem;font-weight:700;}
.energy-omr-toggle{min-width:4.25rem;justify-content:center;white-space:nowrap;}
.energy-chat-button,.app-topbar-print,.app-topbar-theme,.energy-help-button{min-width:2.6rem;}
.app-topbar-actions .header-brand-date{margin:0;text-align:right;font-size:.76rem;line-height:1.25;max-width:18rem;}
.app-topbar-main{align-items:flex-start;}
.topbar-title-block{padding-top:0.18rem;}
.energy-section-tabs .energy-help-inline,[data-caro-help-inline]{display:none!important;}
.energy-help-layout{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(19rem,.9fr);gap:1rem;align-items:start;}
.energy-help-current{display:flex;flex-direction:column;gap:1rem;min-width:0;}
.energy-help-searchpanel{display:flex;flex-direction:column;gap:.85rem;min-width:0;}
.energy-help-hero{padding:1rem 1.05rem;border:1px solid var(--border);border-radius:16px;background:linear-gradient(180deg,rgba(166,255,26,.10),rgba(166,255,26,.03));}
.energy-help-hero h3{margin:0 0 .35rem;font-size:1.05rem;}
.energy-help-hero p{margin:0;color:var(--muted);line-height:1.5;}
.energy-help-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.85rem;}
.energy-help-card,.energy-wiki-card{border:1px solid var(--border);border-radius:14px;padding:.9rem 1rem;background:var(--surface);}
.energy-help-card h4,.energy-wiki-card h3{margin:0 0 .5rem;font-size:.96rem;}
.energy-help-card p,.energy-wiki-card p{margin:0;color:var(--muted);line-height:1.48;}
.energy-help-list{margin:.45rem 0 0;padding-left:1.1rem;}
.energy-help-list li{margin:.28rem 0;line-height:1.45;}
.energy-help-chiprow{display:flex;flex-wrap:wrap;gap:.45rem;}
.energy-help-chip{display:inline-flex;align-items:center;padding:.3rem .58rem;border:1px solid var(--border);border-radius:999px;font-size:.78rem;background:rgba(166,255,26,.06);}
.energy-help-searchpanel .stack>span{display:block;margin-bottom:.35rem;font-weight:600;}
.energy-wiki-results{display:flex;flex-direction:column;gap:.7rem;max-height:48vh;overflow:auto;padding-right:.2rem;}
.energy-help-empty{margin:0;color:var(--muted);}
.energy-help-tabs-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(13rem,1fr));gap:.7rem;}
.energy-help-tabitem{border:1px dashed var(--border);border-radius:12px;padding:.75rem .8rem;background:rgba(255,255,255,.02);}
.energy-help-tabitem strong{display:block;margin-bottom:.3rem;}
.energy-help-tabitem.is-active{border-style:solid;box-shadow:inset 3px 0 0 #9be15d;}
.energy-help-registers{display:flex;flex-direction:column;gap:.75rem;}
.energy-help-toc{margin:0 0 .75rem;padding:.65rem .8rem;border:1px solid var(--line,rgba(0,0,0,.12));border-radius:12px;}
.energy-help-toc ol{margin:.35rem 0 0;padding-left:1.2rem;}
.energy-help-steps{margin:.2rem 0 0;padding-left:1.2rem;display:flex;flex-direction:column;gap:.45rem;}
.energy-help-guide-section{scroll-margin-top:.5rem;}
.energy-help-guide-section+.energy-help-guide-section{margin-top:1rem;padding-top:.8rem;border-top:1px solid var(--line,rgba(0,0,0,.08));}
@media (max-width:800px){.energy-help-layout{display:block;}.energy-help-image-button img{max-height:220px;}}
.energy-help-nested{display:flex;flex-direction:column;gap:.45rem;}
.energy-help-subhead{margin:.65rem 0 .3rem;font-size:.72rem;font-weight:700;letter-spacing:.04em;text-transform:uppercase;}
@media(max-width:1100px){.energy-help-layout{grid-template-columns:1fr;}.energy-help-searchpanel{order:2;}.energy-help-grid{grid-template-columns:1fr;}}
@media(max-width:900px){.app-topbar{align-items:flex-start;}.app-topbar-main{flex:1 1 auto;}.app-topbar-actions{min-width:0;}.app-topbar-action-row{gap:.32rem;}.energy-omr-toggle{min-width:3.9rem;}}
@media(max-width:650px){.app-topbar{gap:.5rem;padding:.55rem .75rem;}.app-topbar-main{gap:.4rem .75rem;}.app-topbar-actions{flex:0 0 auto;}.app-topbar-action-row>.btn{min-height:2.3rem;min-width:2.3rem;padding:.42rem .5rem;}.energy-omr-toggle{min-width:3.7rem;font-size:.84rem;}.app-topbar-actions .header-brand-date{font-size:.68rem;max-width:10rem;}.topbar-page-title{font-size:1rem;}}

/* 1.8.30: stable, explicitly controlled station dropdown. No CSS :hover that toggles layout. */
#tkp-header-status-wrap{position:relative;min-width:0;isolation:isolate;}
#tkp-header-status-wrap .header-tank-fallback{white-space:nowrap;flex-shrink:0;}
#tkp-header-status-wrap.header-tank-overflow .tkp-status-strip--header{display:none!important;}
#tkp-header-status-wrap.header-tank-overflow .header-tank-fallback{display:inline-flex;}
#tkp-header-status-wrap.tank-header-expanded .tkp-status-strip--header{
 display:flex!important;position:absolute;left:auto;right:0;top:calc(100% + 6px);z-index:1100;
 width:min(650px,calc(100vw - 30px));max-height:min(60vh,520px);padding:12px;
 flex-wrap:wrap;align-content:flex-start;align-items:flex-start;gap:7px;
 overflow-y:auto;overflow-x:hidden;overscroll-behavior:contain;
 background:var(--card);border:1px solid var(--border);border-radius:14px;
 box-shadow:0 14px 38px rgba(0,0,0,.25);
}
#tkp-header-status-wrap.tank-header-expanded .header-tank-fallback{display:inline-flex!important;}
#tkp-header-status-wrap.tank-header-expanded .tkp-pill{flex:0 0 auto;cursor:pointer;}
#tkp-header-popover{z-index:1350;}
#tkp-header-status-wrap:not(.tank-header-expanded):not(.header-tank-overflow) .tkp-status-strip--header{position:static;}
@media(max-width:1100px){
 #tkp-header-status-wrap .tkp-status-strip--header{display:none!important;}
 #tkp-header-status-wrap .header-tank-fallback{display:inline-flex!important;}
 #tkp-header-status-wrap.tank-header-expanded .tkp-status-strip--header{display:flex!important;}
}
@media(max-width:650px){
 #tkp-header-status-wrap .tkp-status-strip--header{display:none!important;}
 #tkp-header-status-wrap .header-tank-fallback{display:inline-flex!important;}
 #tkp-header-status-wrap.tank-header-expanded .tkp-status-strip--header{display:flex!important;width:min(380px,calc(100vw - 20px));gap:8px;right:0;max-height:55dvh;}
 #tkp-header-status-wrap.tank-header-expanded .tkp-pill{padding:8px 10px;}
}

/* 1.8.30 contextual help: per-tab explanations, per-field guidance, test-data screenshots. */
.energy-help-modal-panel{width:min(1180px,calc(100vw - 24px));max-width:1180px;max-height:min(92dvh,1050px);position:relative;}
.energy-help-modal-panel .energy-modal-content{overflow-y:auto;min-height:0;}
.energy-help-fields-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(245px,1fr));gap:.65rem;margin:.8rem 0 0;}
.energy-help-field{margin:0;border:1px solid var(--border);border-radius:12px;padding:.8rem .9rem;background:rgba(126,140,126,.045);min-width:0;}
.energy-help-field dt{font-weight:700;margin:0 0 .35rem;font-size:.86rem;}
.energy-help-field dd{margin:0;color:var(--muted);font-size:.83rem;line-height:1.55;overflow-wrap:anywhere;}
.energy-help-example p{line-height:1.5;}
.energy-help-image-button{display:block;border:1px solid var(--border);background:var(--surface);border-radius:12px;overflow:hidden;width:100%;margin:.8rem 0 .55rem;cursor:zoom-in;text-align:left;padding:0;}
.energy-help-image-button img{width:100%;height:auto;max-height:320px;display:block;object-fit:contain;object-position:top;background:#f5f6f4;}
.energy-help-caption{font-size:.8rem;color:var(--muted);margin:.25rem 0;}
.energy-help-zoom-layer{position:absolute;inset:0;z-index:15;background:rgba(12,22,16,.82);display:flex;align-items:center;justify-content:center;padding:12px;}
.energy-help-zoom-dialog{display:flex;flex-direction:column;align-items:stretch;gap:.55rem;width:min(1100px,100%);max-height:100%;overflow:auto;background:var(--surface);border:1px solid var(--border);border-radius:14px;padding:14px;box-shadow:0 15px 55px rgba(0,0,0,.35);}
.energy-help-zoom-dialog header{display:flex;justify-content:space-between;align-items:center;gap:12px;}
.energy-help-zoom-dialog img{display:block;max-height:calc(92dvh - 185px);max-width:100%;width:100%;object-fit:contain;border-radius:8px;background:#f5f6f4;}
.energy-help-zoom-dialog p{margin:0;font-size:.78rem;color:var(--muted);}
.energy-help-modal-panel .energy-help-layout{grid-template-columns:minmax(0,1.4fr) minmax(260px,.65fr);}
.energy-help-modal-panel .energy-help-searchpanel{position:sticky;top:0;align-self:start;}
.energy-help-modal-panel .energy-help-current{gap:.85rem;}
@media(max-width:900px){
 .energy-help-modal-panel .energy-help-layout{grid-template-columns:1fr;}
 .energy-help-modal-panel .energy-help-searchpanel{position:static;}
 .energy-help-modal-panel .energy-help-fields-grid{grid-template-columns:1fr;}
 .energy-help-modal-panel .energy-help-image-button img{max-height:260px;}
}

/* 1.8.30: independent contextual help layer; underlying edit dialogs remain untouched. */
.energy-help-portal{position:fixed;inset:0;z-index:3500;display:grid;place-items:center;padding:12px;isolation:isolate;}
.energy-help-portal .energy-help-backdrop{position:absolute;inset:0;background:rgba(12,20,14,.62);}
.energy-help-portal .energy-help-modal-panel{z-index:1;margin:0;min-width:0;width:min(1180px,calc(100vw - 24px));max-height:calc(100dvh - 24px);display:flex;flex-direction:column;overflow:hidden;background:var(--card);border:1px solid var(--border);box-shadow:0 20px 60px rgba(0,0,0,.3);}
.energy-help-portal .energy-modal-header{flex-shrink:0;}
.energy-help-portal .energy-modal-content{min-height:0;overflow-y:auto;overscroll-behavior:contain;}
.energy-help-portal .energy-help-zoom-layer{z-index:3;}
@media(max-width:650px){.energy-help-portal{padding:7px;}.energy-help-portal .energy-help-modal-panel{max-height:calc(100dvh - 14px);width:calc(100vw - 14px);}.energy-help-portal .energy-modal-header{gap:8px;}.energy-help-portal .energy-modal-header h2{font-size:1.1rem;}}

.energy-rights-root{position:fixed;inset:0;z-index:1040;display:grid;place-items:center;padding:16px;background:rgba(12,20,14,.62);overflow:hidden;}
.energy-rights-root[hidden]{display:none !important;}
body.energy-rights-open{overflow:hidden;}
.energy-rights-dialog{width:min(1080px,100%);max-height:calc(100dvh - 32px);display:flex;flex-direction:column;background:var(--card,#fff);color:var(--text,#172117);border:1px solid var(--border,#d7e0d8);border-radius:16px;box-shadow:0 24px 70px rgba(0,0,0,.28);outline:none;}
.energy-rights-head,.energy-rights-foot,.energy-rights-tabs{flex:0 0 auto;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 18px;}
.energy-rights-head{border-bottom:1px solid var(--border,#d7e0d8);}
.energy-rights-head h2{margin:0;font-size:1.35rem;}
.energy-rights-tabs{padding-top:0;padding-bottom:0;border-bottom:1px solid var(--border,#d7e0d8);}
.energy-rights-tabs button{background:transparent;border:0;border-bottom:2px solid transparent;padding:12px 10px;cursor:pointer;color:inherit;}
.energy-rights-tabs button[aria-selected="true"]{border-bottom-color:var(--accent,#1f7a3a);font-weight:700;}
.energy-rights-tabs button:focus-visible,.energy-rights-check input:focus-visible,.energy-rights-info:focus-visible{outline:2px solid var(--accent,#1f7a3a);outline-offset:2px;}
.energy-rights-body{min-height:0;overflow:auto;padding:16px 18px 20px;}
.energy-rights-foot{border-top:1px solid var(--border,#d7e0d8);justify-content:flex-end;}
.energy-rights-form,.energy-rights-tools{display:grid;gap:12px;}
.energy-rights-form label{display:grid;gap:6px;font-weight:650;}
.energy-rights-form input,.energy-rights-form select,.energy-rights-tools input{width:100%;max-width:100%;box-sizing:border-box;}
.energy-rights-tools{grid-template-columns:minmax(0,1fr) auto auto auto;align-items:center;}
.energy-rights-tree{display:grid;gap:8px;margin-top:12px;}
.energy-rights-menu,.energy-rights-area{border:1px solid var(--border,#d7e0d8);border-radius:12px;background:color-mix(in srgb,var(--card,#fff) 92%,var(--accent,#1f7a3a));padding:8px 10px;}
.energy-rights-nested{display:grid;gap:8px;margin-top:8px;}
.energy-rights-kicker{margin:4px 0;font-size:.78rem;letter-spacing:.04em;text-transform:uppercase;opacity:.7;}
.energy-rights-checks{display:flex;flex-wrap:wrap;gap:8px 14px;}
.energy-rights-check{display:inline-flex;align-items:center;gap:6px;max-width:100%;}
.energy-rights-info{width:1.3rem;height:1.3rem;border-radius:50%;border:1px solid var(--border,#d7e0d8);background:transparent;cursor:help;position:relative;}
.energy-rights-info:hover::after,.energy-rights-info:focus::after{content:attr(data-tip);position:absolute;left:0;bottom:calc(100% + 6px);width:min(280px,70vw);padding:8px 10px;border-radius:8px;background:#172117;color:#fff;font-size:.82rem;font-weight:500;z-index:2;white-space:normal;}
.energy-rights-error,.energy-rights-note{padding:10px 12px;border-radius:10px;background:#fff4e5;}
.energy-rights-help{position:absolute;inset:0;display:grid;place-items:center;padding:16px;background:rgba(8,14,10,.45);z-index:2;}
.energy-rights-help-panel{width:min(760px,100%);max-height:calc(100dvh - 64px);overflow:auto;background:var(--card,#fff);border-radius:16px;padding:16px 18px;}
.energy-hours-grid,.energy-service-row{display:grid;gap:8px;}
.energy-hours-head,.energy-hours-row{display:grid;grid-template-columns:9rem minmax(0,1fr) minmax(0,1fr);gap:8px;align-items:center;}
.energy-hours-head{font-size:.78rem;letter-spacing:.04em;text-transform:uppercase;opacity:.7;margin-top:10px;}
.energy-service-row{grid-template-columns:minmax(0,1fr) 8rem 6rem auto;align-items:end;margin:10px 0;padding:10px;border:1px solid var(--border,#d7e0d8);border-radius:12px;}
.energy-service-row textarea,.energy-service-row input{width:100%;box-sizing:border-box;}
#energy-users-root{z-index:1030;}
#energy-service-root{z-index:1040;}
@media(max-width:760px){.energy-hours-head,.energy-hours-row,.energy-service-row{grid-template-columns:1fr;}}
@media(max-width:760px){.energy-rights-root{padding:0;}.energy-rights-dialog{width:100%;max-height:100dvh;border-radius:0;}.energy-rights-tools{grid-template-columns:1fr;}.energy-rights-head,.energy-rights-foot{padding:12px;}}
.energy-page-intro > div:first-child{display:none}
.energy-page-intro:not(:has(.energy-actions)):not(:has(.btn)):not(:has(a)):not(:has(button)){display:none}
.energy-drive-layout{grid-column:1 / -1;display:grid;grid-template-columns:minmax(228px,268px) minmax(0,1fr);gap:8px;width:100%;min-width:0;align-items:stretch;height:calc(100vh - 228px);min-height:420px}
.energy-drive-pool,.energy-drive-main{min-width:0;min-height:0}
.energy-drive-pool{display:flex;flex-direction:column;height:100%;max-height:100%;overflow:hidden;background:#f4f7fb;border:1px solid #d5e0ea;border-radius:12px;padding:8px 0 0}
.energy-drive-pool h3{margin:10px 4px 6px;font-size:11px;letter-spacing:.04em;text-transform:uppercase;color:#5c6b7a}
.energy-drive-pool.is-over{outline:2px solid #1f6feb}
.energy-drive-pool-search{width:calc(100% - 16px);box-sizing:border-box;min-height:36px;margin:0 8px 4px;padding:6px 8px;border:1px solid #9aafc2;border-radius:8px;color:#102033;background:#fff;flex:0 0 auto}
.energy-drive-pool-scroll{flex:1;min-height:0;overflow:auto;overscroll-behavior:contain;padding:0 8px 8px;scrollbar-gutter:stable}
.energy-drive-job{position:relative;display:flex;flex-direction:column;gap:1px;margin:0 0 6px;padding:8px 10px;border:1px solid #d5e0ea;border-radius:10px;background:#fff;cursor:grab;color:#102033;box-shadow:0 1px 2px rgba(16,32,51,.05);user-select:none}
.energy-drive-job .who,.energy-drive-job .where,.energy-drive-bar .who,.energy-drive-bar .where{display:block;overflow-wrap:anywhere}
.energy-drive-nav{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin:0 0 8px}
.energy-drive-nav input[type=date]{min-height:36px;border:1px solid #9aafc2;border-radius:8px;padding:4px 8px;color:#102033;background:#fff}
.energy-drive-dirty{color:#8a5a00;font-weight:700}
.energy-drive-kpis{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin:0 0 8px}
.energy-drive-kpis article,.energy-drive-row{min-width:0;background:#fff;border:1px solid #d5e0ea;border-radius:10px;padding:8px}
.energy-drive-main{display:flex;flex-direction:column;height:100%}
.energy-drive-board{width:100%;min-width:0}
.energy-drive-scroll{flex:1;min-height:0;overflow:auto;overscroll-behavior:contain;max-width:100%;border:1px solid #d5e0ea;border-radius:12px;background:#fff}
.energy-drive-timehead{position:sticky;top:0;z-index:8;background:#f7f9fb}
.energy-drive-timehead,.energy-drive-row{display:grid;grid-template-columns:92px 3072px;gap:4px;align-items:stretch;width:max-content}
.energy-drive-name{position:sticky;left:0;z-index:6;background:#fff;display:flex;flex-direction:column;justify-content:center;gap:1px;font-size:12px;padding:2px 4px}
.energy-drive-row:hover{position:relative;z-index:4}
.energy-drive-scale{display:grid;grid-template-columns:repeat(96,32px);width:3072px}
.energy-drive-scale span{font-size:9px;color:#5c6b7a;text-align:left;white-space:nowrap}
.energy-drive-lane{position:relative;min-height:36px;width:3072px;background:repeating-linear-gradient(90deg,#f4f7fb 0 31px,#d5e0ea 31px 32px)}
.energy-drive-lane.is-over{outline:2px solid #1f6feb}
.energy-drive-bar,.energy-drive-note{position:absolute;height:28px;min-height:28px;min-width:64px;display:flex;align-items:center;gap:6px;border:0;border-radius:4px;background:#7eb6e6;color:#102033;text-align:left;padding:0 8px 0 22px;cursor:grab;z-index:2;overflow:hidden;white-space:nowrap;user-select:none}
.energy-drive-bar em{font-style:normal;overflow:hidden;text-overflow:ellipsis}
.energy-drive-bar .live{margin-left:auto;font-size:11px;font-weight:700;color:#102033}
.energy-drive-bar .live.is-stale,.energy-drive-livebox .is-stale{color:#8a5a00}
.energy-drive-info{position:absolute;left:2px;top:4px;z-index:3;width:18px;height:18px;border:0;border-radius:4px;background:#102033;color:#fff;font-size:11px;line-height:18px;padding:0;cursor:pointer}
.energy-drive-livebox{display:grid;gap:2px;margin-top:6px;color:#102033;white-space:normal;overflow-wrap:anywhere}
.energy-drive-live-history{margin:4px 0 0;padding-left:18px}
.energy-drive-live-help{margin-top:6px;color:#334155}
.energy-chat-drive-status{color:#334155;font-weight:650}
.energy-drive-resize{position:absolute;top:0;right:0;width:8px;height:100%;cursor:ew-resize;background:rgba(16,32,51,.18)}
.energy-drive-note{background:#f4b183;padding-left:8px}
.energy-drive-note.is-sent{background:#f7d7b5}
.energy-drive-bar.is-run{background:repeating-linear-gradient(-45deg,#ffe08a 0 6px,#fff3c4 6px 12px)}
.energy-drive-bar.is-done{background:repeating-linear-gradient(-45deg,#d8f3df 0 6px,#b7e4c4 6px 12px)}
.energy-drive-menu{position:fixed;z-index:1400;display:grid;min-width:160px;background:#fff;color:#102033;border:1px solid #9aafc2;border-radius:8px;box-shadow:0 8px 24px rgba(16,32,51,.18);padding:4px}
.energy-drive-menu button{border:0;background:#fff;color:#102033;text-align:left;padding:8px 10px;cursor:pointer}
.energy-drive-menu button:hover{background:#f4f7fb}
.energy-drive-bar .when,.energy-drive-job .odate,.energy-drive-bar .odate{font-weight:700}
.energy-tour-modal{display:grid;gap:12px;color:#102033}
.energy-tour-head h2,.energy-tour-head p{margin:0}
.energy-tour-facts{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
.energy-tour-facts div{padding:10px;border:1px solid #d5e0ea;border-radius:10px;background:#f4f7fb}
.energy-tour-facts span{display:block;font-size:.75rem;color:#5c6b7a}
.energy-tour-lines{list-style:none;margin:0;padding:0;display:grid;gap:6px}
.energy-tour-lines li{display:flex;justify-content:space-between;gap:12px;padding:8px 10px;border-radius:8px;background:#fff;border:1px solid #d5e0ea}
.energy-tour-actions{display:flex;flex-wrap:wrap;gap:8px;justify-content:flex-end}
.energy-tour-preview{width:100%;height:62vh;border:1px solid #d5e0ea;border-radius:10px;background:#fff}
.mala-tour-plan{display:inline-block;margin-left:8px;padding:2px 8px;border-radius:999px;background:#e7eef6;color:#102033;font-weight:700}
.energy-drive-bar.is-started{background:#f0b46a}
.energy-drive-bar strong,.energy-drive-bar .qty{font-weight:700}
.energy-drive-job .who{font-weight:650;font-size:13px;line-height:1.3}
.energy-drive-job .where{color:#334155;font-size:12px;line-height:1.35}
.energy-drive-pop{display:none;position:absolute;z-index:30;left:0;top:calc(100% + 4px);width:min(320px,70vw);background:#fff;color:#102033;border:1px solid #d5e0ea;border-radius:8px;padding:8px;box-shadow:0 8px 24px rgba(16,32,51,.16);white-space:normal;pointer-events:none}
.energy-drive-pop p,.energy-drive-pop ul{margin:4px 0 0;padding-left:16px}
.energy-drive-job.is-tip .energy-drive-pop,.energy-drive-bar.is-tip .energy-drive-pop,.energy-drive-note.is-tip .energy-drive-pop{display:block}
.energy-drive-notice{position:fixed;inset:0;z-index:1300;display:grid;place-items:center;background:rgba(16,32,51,.45);padding:16px}
.energy-drive-notice-panel{width:min(480px,100%);background:#fff;color:#102033;border-radius:12px;padding:18px;box-shadow:0 12px 40px rgba(16,32,51,.25)}
.energy-drive-notice-panel p{margin:0 0 14px;white-space:pre-wrap}
.energy-drive-api .btn:disabled{opacity:.45;cursor:not-allowed}
.energy-fleet-modal{width:min(920px,calc(100vw - 16px));max-width:100%;box-sizing:border-box;overflow-x:hidden}
.energy-fleet-modal .energy-analysis-scroll,.energy-grant,.energy-grant-card,.energy-grant-card span{min-width:0;max-width:100%}
.energy-grant{display:grid;gap:12px;margin-top:16px}
.energy-grant h3{margin:0;color:#102033}
.energy-grant-modes{display:grid;gap:8px}
.energy-grant-mode{display:grid;grid-template-columns:28px minmax(0,1fr);gap:10px;align-items:start;min-height:48px;padding:12px;border:1px solid #9aafc2;border-radius:12px;background:#f4f7fb;color:#102033}
.energy-grant-mode input{width:22px;height:22px;margin-top:2px}
.energy-grant-mode small,.energy-grant-card small{display:block;color:#24384d}
.energy-grant-list{display:grid;gap:8px;max-height:420px;overflow:auto}
.energy-grant-card{display:grid;gap:8px;padding:12px;border:1px solid #d5deea;border-radius:12px;background:#fff;color:#102033}
.energy-grant-card label{display:grid;grid-template-columns:28px minmax(0,1fr);gap:10px;align-items:start;min-height:48px}
.energy-grant-card input{width:22px;height:22px;margin-top:2px}
.energy-grant-card.is-off{background:#f7f8fa}
.energy-grant-badge{display:inline-block;margin-top:6px;padding:2px 8px;border-radius:999px;background:#e7eef6;color:#102033}
.energy-grant-error{color:#5c1212}
.energy-grant .btn,.energy-grant-card .btn{min-height:44px}
@media(max-width:360px){.energy-fleet-modal{width:calc(100vw - 8px);padding-left:8px;padding-right:8px}}
.energy-drive-api-modal{width:min(920px,calc(100vw - 24px));max-width:100%;box-sizing:border-box}
.energy-drive-api-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.energy-drive-secret{display:flex;gap:8px;align-items:center}
.energy-drive-secret input{min-width:0;flex:1}
.energy-drive-status-card{margin:0 0 12px;padding:14px;border-radius:12px;border:1px solid #9aafc2;background:#f4f7fb;color:#102033}
.energy-drive-status-card.is-ok{background:#e5f6ec;border-color:#1d7a43;color:#0d3b22}
.energy-drive-status-card.is-warn{background:#fff4d6;border-color:#8a5a00;color:#3f2b00}
.energy-drive-status-card.is-bad{background:#fde8e8;border-color:#9b2c2c;color:#5c1212}
.energy-drive-status-card strong,.energy-drive-status-card p{color:inherit}
.energy-drive-missing{margin:8px 0 0;padding-left:18px}
.energy-drive-missing code{font-family:ui-monospace,monospace}
.energy-drive-advanced{margin:8px 0 12px}
@media(max-width:700px){.energy-drive-api-grid,.energy-drive-secret{grid-template-columns:1fr;display:grid}.modal-panel.energy-drive-api-modal{width:min(100%,calc(100vw - 16px));margin-inline:auto}}
@media(max-width:900px){.energy-drive-layout,.energy-drive-kpis,.energy-tour-facts{grid-template-columns:1fr}.energy-drive-layout{height:auto}.energy-drive-pool,.energy-drive-scroll{max-height:70vh}}
.energy-drive-job.is-open{background:#fff}
.energy-drive-job.is-planned{background:repeating-linear-gradient(-45deg,#fff8dc 0 8px,#ffe08a 8px 16px);border-color:#d4a017}
.energy-drive-nav .energy-day-filter{color:#fff;border:1px solid transparent;font-weight:700}
.energy-drive-nav .energy-day-filter.is-on{background:#b42318;border-color:#8d1b13}
.energy-drive-nav .energy-day-filter:not(.is-on){background:#1f7a3a;border-color:#17612d}
.energy-app-tabs{display:flex;flex-wrap:wrap;gap:4px;align-items:center;padding:6px 10px;background:#eef3f8;border-bottom:1px solid #d5e0ea}
.energy-app-tab,.energy-app-tab-close{border:1px solid #9aafc2;background:#fff;color:#102033;border-radius:8px;min-height:32px;padding:4px 8px;cursor:pointer}
.energy-app-tab.is-active{background:#1f6feb;color:#fff;border-color:#1f6feb}
.energy-app-tab-close{padding:4px 7px}
.energy-tour-screen-banner{display:flex;gap:10px;align-items:center;justify-content:space-between;padding:8px 12px;background:#fff8dc;border-bottom:1px solid #d4a017;color:#102033}
body.energy-tour-window .app-sidebar,body.energy-tour-window .app-topbar,body.energy-tour-window #btn-sidebar-mobile-open,body.energy-tour-window .app-sidebar-overlay{display:none!important}
body.energy-tour-window .app-main-column{width:100%}
body.energy-tour-window .main-panel{padding:6px 8px 8px 8px}
body.energy-tour-window .energy-drive-layout{height:auto;min-height:0}
body.energy-tour-window [data-tour-window]{display:none}
.energy-team-selector{display:flex;flex-direction:column;gap:10px;max-height:min(62vh,560px);overflow:auto}
.energy-team-section{border:1px solid #d5e0ea;border-radius:10px;background:#fff;min-width:0}
.energy-team-section h3{margin:0;padding:8px 12px;background:#f4f7fb;color:#102033;font-size:13px}
.energy-team-section-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:6px;max-height:168px;overflow:auto;padding:8px}
.energy-chat-flags{position:fixed;right:0;top:120px;z-index:1040;display:flex;flex-direction:column;gap:6px;max-height:calc(100vh - 150px);overflow:auto;overscroll-behavior:contain;padding:4px 0;scrollbar-width:thin}
.energy-chat-flag{writing-mode:vertical-rl;transform:rotate(180deg);border:0;border-radius:10px 0 0 10px;background:#1f6feb;color:#fff;padding:12px 8px;cursor:pointer;max-height:168px;min-height:64px;font-size:13px;font-weight:650;letter-spacing:.01em;box-shadow:-2px 2px 8px rgba(16,32,51,.16);overflow:hidden}
.energy-chat-flag.is-group{background:#102033}
body:has(#energy-chat:not([hidden])) .energy-chat-flags{right:440px}
.energy-group-modal{width:min(1080px,calc(100vw - 24px));max-width:100%}
.energy-group-modal .energy-modal-content{flex:1;min-height:0;overflow:hidden;display:flex;flex-direction:column}
.energy-group-layout{flex:1;min-height:0;display:grid;grid-template-columns:minmax(220px,300px) minmax(0,1fr);gap:16px}
.energy-group-list,.energy-group-detail{min-width:0;min-height:0}
.energy-group-list{display:flex;flex-direction:column;gap:8px}
.energy-group-cards{flex:1;min-height:0;overflow:auto;display:flex;flex-direction:column;gap:8px;padding-right:4px}
.energy-group-card{display:flex;flex-direction:column;align-items:flex-start;gap:4px;width:100%;margin:0;padding:12px;border:1px solid #d5e0ea;border-radius:12px;background:#fff;color:#102033;text-align:left;cursor:pointer;box-shadow:0 1px 2px rgba(16,32,51,.06)}
.energy-group-card strong{font-size:15px}
.energy-group-card span{color:#334155;font-size:12px}
.energy-group-card.is-selected{border-color:#1f6feb;background:#f4f8ff}
.energy-group-detail{display:flex;flex-direction:column}
.energy-group-fields{flex-shrink:0}
.energy-group-fields .stack,.energy-group-list .stack{margin-bottom:8px}
.energy-group-fields input,.energy-group-fields textarea,.energy-group-list input{width:100%;max-width:100%}
.energy-group-members{flex:1;min-height:0;overflow:auto;display:flex;flex-direction:column;gap:8px;margin:8px 0}
.energy-member-fold{border:1px solid #d5e0ea;border-radius:10px;background:#fff;min-width:0}
.energy-member-fold-head{display:flex;align-items:center;gap:8px;width:100%;padding:10px 12px;border:0;background:#f7f9fb;color:#102033;font-weight:650;text-align:left;cursor:pointer}
.energy-member-fold-head .mark{width:22px;height:22px;border:1px solid #8ea0b3;border-radius:6px;display:inline-flex;align-items:center;justify-content:center;color:#102033;background:#fff;flex:0 0 auto}
.energy-member-fold-head small{margin-left:auto;color:#334155}
.energy-member-fold-body{max-height:168px;overflow:auto;padding:8px 12px 10px}
.energy-member-fold-body .checkbox-row{display:flex;align-items:flex-start;gap:8px;color:#102033;margin:0 0 8px}
.energy-member-fold-body small{display:block;color:#334155}
.energy-group-actions{flex-shrink:0;display:flex;justify-content:flex-end;flex-wrap:wrap;gap:8px;padding-top:10px;border-top:1px solid #d5e0ea;background:#fff}
@media(max-width:768px){
  .energy-group-layout{grid-template-columns:1fr;grid-template-rows:minmax(140px,32vh) minmax(0,1fr)}
  .energy-group-cards{max-height:none}
  .energy-member-fold-body{max-height:140px}
}
.energy-departure{display:grid;gap:10px;margin:12px 0;padding:12px;border:1px solid #cbd5e1;border-radius:12px;background:#f8fafc;color:#0f172a}
.energy-departure h3{margin:0;color:#0f172a}
.energy-departure-row{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:8px;align-items:end}
.energy-departure input,.energy-departure button{max-width:100%}
.energy-chat-photo-count{display:inline-block;margin-top:6px;padding:2px 8px;border-radius:999px;background:var(--card);color:var(--text);border:1px solid var(--border);font-size:12px}
.energy-chat-photo img,.energy-chat-stage img{display:block;max-width:min(100%,240px);height:auto;object-fit:contain;border-radius:8px}
.energy-chat-stage img{max-width:100%}
@media(max-width:720px){
  .energy-departure-row{grid-template-columns:1fr}
}
.energy-chat-threads{display:flex;flex-direction:column;gap:6px;max-height:190px;overflow:auto;padding:8px 12px;max-width:100%}
.energy-chat-thread{display:flex;flex-direction:column;gap:2px;width:100%;padding:8px 10px;border:1px solid var(--border,#cbd5e1);border-radius:10px;background:var(--card,#fff);color:var(--text,#0f172a);text-align:left}
.energy-chat-thread small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--text,#0f172a)}
.energy-chat-thread.is-on{border-color:#1d4ed8}
.energy-chat-thread.is-fresh{animation:energy-thread-blink 1.15s ease-in-out 4}
@keyframes energy-thread-blink{0%,100%{background:var(--card,#fff)}50%{background:color-mix(in srgb,#f59e0b 35%,var(--card,#fff))}}
.energy-chat-ticks{font-weight:700}
.energy-chat-ticks.is-pending::before{content:"◷ "}
.energy-chat-ticks.is-accepted::before{content:"✓ ";color:#64748b}
.energy-chat-ticks.is-delivered::before{content:"✓ ";color:#1d4ed8}
.energy-chat-ticks.is-read::before{content:"✓✓ ";color:#1d4ed8}
.energy-chat-draft{display:inline-flex;flex-direction:column;gap:4px;margin:6px 6px 0 0}
.energy-chat-draft img{width:72px;height:72px;object-fit:cover;border-radius:8px}
.energy-chat-message.mine .energy-chat-bubble{color:var(--text,#0f172a)}
@media(max-width:720px){
  .energy-chat-panel,.energy-chat-feed,.energy-chat-compose{max-width:100%;overflow-x:hidden}
  .energy-chat-bubble{font-size:16px}
}