/**
 * NZL Platform UI System 9.1.2
 * Gemeinsame Abstände, Oberflächen und Layout-Grundregeln für Portal-Module.
 */
:root {
  --nzl-ui-red: #8d2f24;
  --nzl-ui-red-dark: #662019;
  --nzl-ui-red-soft: #f7ded8;
  --nzl-ui-green: #5fa71d;
  --nzl-ui-green-soft: #e7f5db;
  --nzl-ui-cream: #f7f3ec;
  --nzl-ui-surface: #ffffff;
  --nzl-ui-ink: #211d1a;
  --nzl-ui-muted: #645d57;
  --nzl-ui-line: #d9d1c7;
  --nzl-ui-radius-sm: 12px;
  --nzl-ui-radius: 16px;
  --nzl-ui-radius-lg: 22px;
  --nzl-ui-space-1: .35rem;
  --nzl-ui-space-2: .6rem;
  --nzl-ui-space-3: .85rem;
  --nzl-ui-space-4: 1rem;
  --nzl-ui-space-5: 1.25rem;
  --nzl-ui-space-6: 1.5rem;
  --nzl-ui-space-7: 2rem;
  --nzl-ui-shadow: 0 10px 28px rgba(35, 28, 22, .07);
}

/* Wiederverwendbare Bausteine für neue Module. */
.nzl-ui-stack { display: grid; gap: var(--nzl-ui-space-5); }
.nzl-ui-section {
  padding: var(--nzl-ui-space-6);
  border: 1px solid var(--nzl-ui-line);
  border-radius: var(--nzl-ui-radius);
  background: var(--nzl-ui-surface);
  box-sizing: border-box;
}
.nzl-ui-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: var(--nzl-ui-space-3);
}
.nzl-ui-alert {
  padding: var(--nzl-ui-space-4) var(--nzl-ui-space-5);
  border-left: 5px solid var(--nzl-ui-red);
  border-radius: var(--nzl-ui-radius-sm);
  background: var(--nzl-ui-red-soft);
}
.nzl-ui-search { margin: 0; padding: 0; border: 0; background: transparent; }

/* Zunft-App: einheitliche Innenabstände unter den Reitern. */
.nzl-ops-app .ops-panel {
  padding: var(--nzl-ui-space-6) !important;
  box-sizing: border-box;
}

/* Die gezielte Suche liegt zwischen Reitern und Inhalt und erhält einen eigenen,
   gleichmäßigen Außenabstand – ohne zusätzlichen Kartenrahmen. */
.nzl-ops-app .ops-advanced-search {
  margin: var(--nzl-ui-space-6) var(--nzl-ui-space-6) var(--nzl-ui-space-5) !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  box-sizing: border-box;
}

/* Öffentliche Plätze-Ansicht: Hinweis, Legende und Saalplan bleiben als klarer Stack. */
.nzl-ops-app .ops-public-plan {
  display: grid;
  gap: var(--nzl-ui-space-5) !important;
}
.nzl-ops-app .ops-public-hint,
.nzl-ops-app .ops-seat-legend,
.nzl-ops-app .ops-seat-detail,
.nzl-ops-app .ops-room-viewport {
  margin: 0 !important;
}

/* Kartenmanagement: der rote Hinweis darf den weißen Rahmen nie berühren. */
.nzl-ops-app .ops-panel.ops-km-host {
  padding: 0 !important;
}
.nzl-ops-app .ops-panel.ops-km-host > .ops-km {
  display: grid;
  gap: var(--nzl-ui-space-5) !important;
  padding: var(--nzl-ui-space-6) !important;
  box-sizing: border-box;
}
.nzl-ops-app .ops-panel.ops-km-host .ops-km-note {
  margin: 0 !important;
  padding: var(--nzl-ui-space-4) var(--nzl-ui-space-5) !important;
  border-radius: var(--nzl-ui-radius-sm) !important;
}
.nzl-ops-app .ops-panel.ops-km-host .ops-crm-queue,
.nzl-ops-app .ops-panel.ops-km-host .ops-km-toolbar,
.nzl-ops-app .ops-panel.ops-km-host .ops-km-selection,
.nzl-ops-app .ops-panel.ops-km-host .ops-selection-overview,
.nzl-ops-app .ops-panel.ops-km-host .ops-seat-legend,
.nzl-ops-app .ops-panel.ops-km-host .ops-room-viewport {
  margin: 0 !important;
}

/* Keine kollabierenden Abstände an der Grenze zwischen Suchbereich und Panel. */
.nzl-ops-app .ops-advanced-search + .ops-panel {
  margin-top: 0 !important;
}

@media (max-width: 700px) {
  .nzl-ops-app .ops-panel { padding: var(--nzl-ui-space-4) !important; }
  .nzl-ops-app .ops-advanced-search {
    margin: var(--nzl-ui-space-4) var(--nzl-ui-space-4) var(--nzl-ui-space-3) !important;
  }
  .nzl-ops-app .ops-panel.ops-km-host > .ops-km {
    padding: var(--nzl-ui-space-4) !important;
    gap: var(--nzl-ui-space-4) !important;
  }
}
