.mq-async-action-frame-pulsing {
  --mq-async-action-frame-pulse-color: var(--ant-color-primary-border);
  box-shadow: 0 0 0 0 var(--mq-async-action-frame-pulse-color);
  animation: mq-async-action-frame-pulse 1.8s ease-out infinite;
}

.mq-async-action-frame-pulsing.ant-btn-dangerous {
  --mq-async-action-frame-pulse-color: var(--ant-color-error-border, var(--ant-color-error));
}

@keyframes mq-async-action-frame-pulse {
  0% {
    box-shadow: 0 0 0 0 var(--mq-async-action-frame-pulse-color);
  }

  70% {
    box-shadow: 0 0 0 var(--mq-space-xs, 8px) transparent;
  }

  100% {
    box-shadow: 0 0 0 0 transparent;
  }
}

@media (prefers-reduced-motion: reduce) {
  .mq-async-action-frame-pulsing {
    animation: none;
    box-shadow: 0 0 0 1px var(--mq-async-action-frame-pulse-color);
  }
}
/* Admin Services: Tab-Inhalt mitwachsen lassen, kein innerer Vertikal-Scroll bei wenigen Einträgen */
.admin-services-page .admin-services-tabs.ant-tabs .ant-tabs-content-holder {
  flex: none;
  height: auto;
  overflow: visible;
}

:root {
  --m1-space-1: 1px;
  --m1-space-2: 2px;
  --m1-space-3: 3px;
  --m1-space-4: 4px;
  --m1-space-5: 5px;
  --m1-space-6: 6px;
  --m1-space-8: 8px;
  --m1-space-10: 10px;
  --m1-space-12: 12px;
  --m1-space-14: 14px;
  --m1-space-16: 16px;
  --m1-space-18: 18px;
  --m1-space-20: 20px;
  --m1-space-24: 24px;
  --m1-space-32: 32px;
  --m1-font-size-10: 10px;
  --m1-font-size-11: 11px;
  --m1-font-size-12: 12px;
  --m1-font-size-13: 13px;
  --m1-font-size-14: 14px;
  --m1-font-size-16: 16px;
  --m1-line-height-1: 1;
  --m1-line-height-1-1: 1.1;
  --m1-line-height-1-15: 1.15;
  --m1-line-height-1-2: 1.2;
  --m1-line-height-1-4: 1.4;
  --m1-line-height-16: 16px;
  --m1-line-height-18: 18px;
  --m1-line-height-20: 20px;
  --m1-radius-3: 3px;
  --m1-radius-4: 4px;
  --m1-radius-6: 6px;
  --m1-radius-8: 8px;
  --m1-radius-10: 10px;
  color-scheme: light;
}

:root[data-theme="dark"] {
  color-scheme: dark;
}

html,
body,
#root {
  height: 100%;
}

body {
  margin: 0;
  background: transparent;
}

/* Interne Fachformulare: Browser-Autofill darf keine privaten Kontakt-/Adressdaten vorschlagen oder gelb einfärben. */
input[data-mqorva-no-browser-autofill="true"]:-webkit-autofill,
input[data-mqorva-no-browser-autofill="true"]:-webkit-autofill:hover,
input[data-mqorva-no-browser-autofill="true"]:-webkit-autofill:focus,
input[data-mqorva-no-browser-autofill="true"]:-webkit-autofill:active {
  -webkit-box-shadow: 0 0 0 1000px var(--ant-color-bg-container) inset !important;
  box-shadow: 0 0 0 1000px var(--ant-color-bg-container) inset !important;
  -webkit-text-fill-color: var(--ant-color-text) !important;
  caret-color: var(--ant-color-text) !important;
  transition: background-color 999999s ease-out 0s !important;
}

.mu-app-shell-mobile-menu {
  height: 100%;
  min-height: 0;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}

/*
  Scrollfläche ohne sichtbaren Balken.

  Gescrollt wird weiter — Mausrad, Touch, Tastatur und das Ziehen einer Auswahl bis an den Rand
  bleiben unverändert; es entfällt ausschließlich die Leiste. Sie steht in schmalen, dauerhaft
  sichtbaren Bereichen (Hauptmenü, Blattfenster der Dokumenteditoren) neben dem Inhalt und
  zerschneidet die Fläche, obwohl der Rollbereich ohnehin am Zeigergerät hängt.

  Bewusst kein `overflow: hidden` am Element: Das nähme mit dem Balken auch das Scrollen.
*/
.mu-scroll-hidden {
  scrollbar-width: none;
  -ms-overflow-style: none;
}

.mu-scroll-hidden::-webkit-scrollbar {
  width: 0;
  height: 0;
}

.global-studio-selector-button.ant-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--m1-space-8);
  overflow: hidden;
}

.global-studio-selector-label {
  display: inline-block;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  line-height: var(--m1-line-height-20);
}

@media (max-width: 767.98px) {
  .mu-app-shell-header {
    padding-inline: var(--m1-space-8) !important;
  }

  .mu-app-shell-header-brand img {
    height: 24px !important;
  }

  .global-studio-selector-button.ant-btn {
    height: 30px;
    line-height: var(--m1-line-height-20);
    padding-inline: var(--m1-space-10);
  }

  .mu-app-shell .ant-layout-content {
    padding: var(--m1-space-12) var(--m1-space-10) var(--m1-space-32) !important;
  }
}

/* App-Shell: leichtes Seitenmenü (wie früher unter ProLayout: Primary-Text, kein gefüllter Selected-Block). */
.mu-app-shell .ant-layout-sider .ant-menu {
  background: transparent;
}

.mu-app-shell .ant-layout-sider .ant-menu-sub {
  background: transparent !important;
}

.mu-app-shell .ant-layout-sider .ant-menu-item:hover,
.mu-app-shell .ant-layout-sider .ant-menu-submenu-title:hover,
.mu-app-shell .ant-layout-sider .ant-menu-item-active,
.mu-app-shell .ant-layout-sider .ant-menu-item-selected,
.mu-app-shell .ant-layout-sider .ant-menu-submenu-selected > .ant-menu-submenu-title {
  background: transparent !important;
  background-color: transparent !important;
}

.mu-app-shell .ant-layout-sider .ant-menu-item-selected,
.mu-app-shell .ant-layout-sider .ant-menu-submenu-selected > .ant-menu-submenu-title {
  color: var(--ant-color-primary, var(--ant-colorPrimary)) !important;
  font-weight: 600;
}

.mu-app-shell .ant-layout-sider .ant-menu-item-selected .ant-menu-title-content,
.mu-app-shell .ant-layout-sider .ant-menu-item-selected .ant-menu-item-icon,
.mu-app-shell .ant-layout-sider .ant-menu-submenu-selected > .ant-menu-submenu-title .ant-menu-title-content,
.mu-app-shell .ant-layout-sider .ant-menu-submenu-selected > .ant-menu-submenu-title .ant-menu-item-icon {
  color: inherit !important;
}

.mu-app-shell .ant-layout-sider .ant-menu-item:hover .ant-menu-title-content,
.mu-app-shell .ant-layout-sider .ant-menu-submenu-title:hover .ant-menu-title-content,
.mu-app-shell .ant-layout-sider .ant-menu-item:hover .ant-menu-item-icon,
.mu-app-shell .ant-layout-sider .ant-menu-submenu-title:hover .ant-menu-item-icon {
  color: var(--ant-color-primary, var(--ant-colorPrimary)) !important;
}

/*
 * Eingeklapptes Seitenmenü: Blatt-Items sind in einen Tooltip gewickelt (Standard = dunkler Spotlight),
 * Untermenüs öffnen ein helles Flyout – wirkt optisch uneinheitlich. Tooltip wie Submenu-Popup (elevated) gestalten.
 */
.mu-app-shell .ant-tooltip.ant-menu-inline-collapsed-tooltip .ant-tooltip-unique-container,
.mu-app-shell .ant-tooltip.ant-menu-inline-collapsed-tooltip .ant-tooltip-container {
  background-color: var(--ant-color-bg-elevated) !important;
  color: var(--ant-color-text) !important;
  box-shadow: var(--ant-box-shadow-secondary) !important;
}

.mu-app-shell .ant-tooltip.ant-menu-inline-collapsed-tooltip a,
.mu-app-shell .ant-tooltip.ant-menu-inline-collapsed-tooltip a:hover {
  color: var(--ant-color-text) !important;
}

.mu-app-shell .ant-tooltip.ant-menu-inline-collapsed-tooltip .ant-tooltip-arrow::before {
  background: var(--ant-color-bg-elevated) !important;
}

/* Ant Feedback-Portale: statische message/notification-Holder liegen außerhalb der App-Shell. */
:root[data-theme="dark"] .ant-message .ant-message-notice,
:root[data-theme="dark"] .ant-message .ant-message-notice-content,
:root[data-theme="dark"] .ant-notification .ant-notification-notice {
  background: var(--ant-color-bg-elevated, #1f1f1f) !important;
  color: var(--ant-color-text, rgba(255, 255, 255, 0.88)) !important;
  box-shadow: var(--ant-box-shadow, 0 6px 16px rgba(0, 0, 0, 0.32)) !important;
}

:root[data-theme="dark"] .ant-message .ant-message-notice-title,
:root[data-theme="dark"] .ant-notification .ant-notification-notice-message,
:root[data-theme="dark"] .ant-notification .ant-notification-notice-description {
  color: var(--ant-color-text, rgba(255, 255, 255, 0.88)) !important;
}

/* Karten: keine durchgezogene Linie unter dem Titel – einheitliches Layout ohne Header-Trennlinie */
.ant-card-head {
  border-bottom: none;
}

/* Foto-Icons wie im Original: nur beim Hover sichtbar */
.person-photo-icons {
  opacity: 0;
  transition: opacity 120ms ease-in-out;
  pointer-events: none;
}

.person-photo-container:hover .person-photo-icons {
  opacity: 1;
  pointer-events: auto;
}

/* Lade-Anzeige – ausschließlich über components/LoadingOverlay.tsx genutzt.
   Grundsatz: Struktur zuerst, Daten dimmen. Der Inhalt wird abgeblendet statt verdeckt,
   damit das Layout von Anfang an steht. Keine Farbliterale: die Deckkraft wirkt auf den
   echten Inhalt, deshalb stimmt die Anmutung in Light und Dark automatisch. */
.mu-loading-host {
  position: relative;
  min-width: 0;
}

/* Das Anlaufen ist verzögert, das Zurückfahren nicht: kurze Anfragen zeigen gar nichts,
   mittlere ein weiches Atmen. Bewusst ohne Timer und ohne Mindeststandzeit — niemand
   wartet länger als die Anfrage dauert. */
.mu-loading-dim {
  opacity: 1;
  transition: opacity 160ms ease 0ms;
}
.mu-loading-dim[data-busy="true"] {
  opacity: 0.55;
  pointer-events: none;
  transition-delay: 220ms;
}

.mu-loading-indicator {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  pointer-events: none;
  opacity: 0;
  transition: opacity 160ms ease 0ms;
}
.mu-loading-indicator[data-busy="true"] {
  opacity: 1;
  transition-delay: 220ms;
}

/* Blockierende Vollbildsperre, solange eine Aktion läuft. Hintergrund kommt als Token
   aus der Komponente (colorBgMask). */
.mu-loading-screen {
  position: fixed;
  inset: var(--critical-issue-banner-height, 0px) 0 0;
  display: flex;
  align-items: center;
  justify-content: center;
  backdrop-filter: blur(2px);
}

/* Der Admin-Störungsbanner belegt den obersten Viewport-Bereich. Portalbasierte Vollflächen
   müssen darunter beginnen; ein höherer z-index allein ließe Drawer oder Masken hinter dem
   Banner weiterlaufen und würde ihren Kopf verdecken. */
.ant-drawer,
.ant-modal-root .ant-modal-mask,
.ant-modal-root .ant-modal-wrap {
  top: var(--critical-issue-banner-height, 0px);
  height: calc(100% - var(--critical-issue-banner-height, 0px));
}

/* Nur dort, wo noch kein Gerüst stehen kann: Routen-Suspense und Inhalte, die vollständig
   aus Serverdaten bestehen (Mahnungs-/SEPA-Drawer). Bewusst schlicht — lieber ein Spinner
   als ein nachgebautes Gerüst, das anders aussieht als das Ergebnis. */
.mu-loading-placeholder {
  display: grid;
  place-items: center;
  min-height: 180px;
}

@media (prefers-reduced-motion: reduce) {
  .mu-loading-dim,
  .mu-loading-indicator {
    transition-duration: 0ms;
  }
}

/* Kalender-Seite: Mindestbreite, damit Toolbar und Inhalte nicht zu schmal werden */
.calendar-page-root {
  min-width: 1000px;
}

.calendar-toolbar {
  max-width: 100%;
}

.calendar-toolbar-view-switch,
.calendar-toolbar-date-nav,
.calendar-toolbar-row-height,
.calendar-toolbar-primary-action {
  max-width: 100%;
}

.calendar-toolbar-date-nav {
  margin-left: auto;
}

.calendar-toolbar-primary-action {
  margin-left: auto;
}

@media (max-width: 1199.98px) {
  .calendar-page-root {
    min-width: 0;
  }

  .calendar-toolbar-resources {
    flex: 1 1 180px !important;
  }

  .calendar-toolbar-date-nav {
    flex: 1 1 260px !important;
    justify-content: flex-end !important;
  }

  .calendar-toolbar-row-height,
  .calendar-toolbar-primary-action {
    margin-left: auto;
  }
}

@media (max-width: 767.98px) {
  .calendar-page-root {
    min-width: 0;
  }

  .calendar-toolbar {
    align-items: stretch !important;
  }

  .calendar-toolbar-view-switch {
    width: 100%;
  }

  .calendar-toolbar-date-nav {
    width: 100%;
    justify-content: flex-end !important;
  }

  [style*="grid-template-columns: 1fr 1fr"],
  [style*="grid-template-columns: 1fr 1fr 1fr"],
  [style*="grid-template-columns: 2fr 1fr"],
  [style*="grid-template-columns: 2fr 1fr 1fr"],
  [style*="grid-template-columns: repeat(2"],
  [style*="grid-template-columns: repeat(3"] {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  .ant-segmented {
    max-width: 100%;
    overflow-x: auto;
  }

  .ant-segmented .ant-segmented-group {
    min-width: 0;
  }

  .settings-list-toolbar-extra .ant-segmented .ant-segmented-group {
    flex-wrap: wrap;
  }

  .ant-segmented .ant-segmented-item {
    min-width: 0;
  }

  .ant-tabs {
    max-width: 100%;
    min-width: 0;
  }

  .ant-tabs .ant-tabs-nav {
    max-width: 100%;
  }

  .ant-tabs .ant-tabs-nav-wrap {
    min-width: 0;
  }

  .ant-modal {
    max-width: calc(100vw - 20px) !important;
    margin: var(--m1-space-10) auto;
  }

  .ant-modal .ant-modal-content {
    max-width: 100%;
    overflow: hidden;
  }

  .ant-modal .ant-modal-body {
    max-width: 100%;
    overflow-x: hidden;
  }

  .ant-modal .ant-modal-footer {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: var(--m1-space-8);
  }

  .ant-modal .ant-modal-footer .ant-btn + .ant-btn {
    margin-inline-start: 0;
  }
}

/* m1member Kalender (Today/Week grid) */
.mu-cal-wrapper {
  overflow: hidden;
  position: relative;
}

.mu-cal-grid {
  border: 1px solid var(--ant-color-border-secondary);
  border-radius: var(--m1-radius-10);
  overflow-y: auto;
  overflow-x: hidden;
  background: var(--ant-color-bg-container);
}
:root[data-shape="square"] .mu-cal-grid {
  border-radius: 0;
}

/* Eingebettetes Wochengitter (Dienstplan/Verfügbarkeiten): Höhe kommt vom Inhalt,
   die Seite scrollt — kein eigener Scrollbereich im Gitter */
.mu-cal-grid.mu-cal-grid-embedded {
  overflow-y: hidden;
}

.mu-cal-gridtable {
  display: grid;
  min-width: 0;
  width: 100%;
  position: relative;
}

/* Wochenansicht: ohne Mindestbreite, damit Inhalt auf eine Seite passt */
.mu-cal-week {
  min-width: 0;
  /* Zeilenhöhe der ersten Kopfzeile (Tag/Datum) — für sticky zweite Kopfzeile (Ressourcen) */
  --mu-cal-week-day-row-h: 24px;
}

/* Wochenansicht: Tag und Datum als eine Zeile über alle Ressourcen-Spalten des Tages */
.mu-cal-week .mu-cal-week-time-corner {
  align-items: center;
  justify-content: center;
}

.mu-cal-week .mu-cal-header-cell.mu-cal-week-day-banner {
  top: 0;
  z-index: 5;
  border-bottom: 1px solid var(--ant-color-border-secondary);
  background: var(--ant-color-fill-tertiary);
  font-size: var(--m1-font-size-13);
  font-weight: 600;
  justify-content: center;
}

.mu-cal-week .mu-cal-week-day-start {
  border-left: 0;
}

.mu-cal-week .mu-cal-week-day-start:not(.mu-cal-week-day-banner) {
  box-shadow: inset 1px 0 0 color-mix(in srgb, var(--ant-color-border) 45%, transparent);
}

.mu-cal-week .mu-cal-week-day-banner-text {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 100%;
}

.mu-cal-week .mu-cal-header-cell.mu-cal-week-resource-header {
  top: var(--mu-cal-week-day-row-h);
  z-index: 4;
  border-bottom: 2px solid var(--ant-color-border);
  background: var(--ant-color-bg-elevated);
}

.mu-cal-today {
  --mu-cal-today-day-row-h: 24px;
  --mu-cal-today-studio-row-h: 24px;
}

.mu-cal-today .mu-cal-today-time-corner {
  align-items: center;
  justify-content: center;
}

.mu-cal-today .mu-cal-header-cell.mu-cal-today-day-banner {
  top: 0;
  z-index: 6;
  border-bottom: 1px solid var(--ant-color-border-secondary);
  background: var(--ant-color-fill-tertiary);
  font-size: var(--m1-font-size-13);
  font-weight: 600;
  justify-content: center;
}

.mu-cal-today .mu-cal-today-day-banner-text {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 100%;
}

.mu-cal-today .mu-cal-header-cell.mu-cal-today-studio-banner {
  z-index: 5;
}

.mu-cal-today .mu-cal-header-cell.mu-cal-today-resource-header {
  z-index: 4;
  container-type: inline-size;
  padding: 0;
  overflow: hidden;
}

.mu-cal-today-resource-header-inner {
  width: 100%;
  min-width: 0;
  height: 100%;
  padding: var(--m1-space-4) var(--m1-space-6);
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--m1-space-6);
  overflow: hidden;
  box-sizing: border-box;
}

.mu-cal-today-resource-icon {
  flex: 0 0 auto;
  font-size: var(--m1-font-size-14);
  line-height: var(--m1-line-height-1);
}

.mu-cal-today-resource-studio-tag {
  flex: 0 1 auto;
  min-width: 0;
  max-width: 42%;
  margin: 0;
  padding: 0 var(--m1-space-4);
  font-size: var(--m1-font-size-10);
  line-height: var(--m1-line-height-16);
  overflow: hidden;
  text-overflow: ellipsis;
}

.mu-cal-today-resource-dot {
  flex: 0 0 auto;
}

.mu-cal-today-resource-name {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-weight: 500;
}

.mu-cal-today-resource-short {
  display: none;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: var(--m1-font-size-12);
  font-weight: 700;
}

.mu-cal-today-resource-capacity {
  flex: 0 0 auto;
  padding: var(--m1-space-1) var(--m1-space-5);
  border-radius: var(--m1-radius-8);
  background: var(--ant-color-primary-bg);
  color: var(--ant-color-primary);
  font-size: var(--m1-font-size-10);
  line-height: var(--m1-line-height-1-4);
}

.mu-cal-today-resource-badge {
  display: none;
  width: 100%;
  height: 100%;
  min-width: 0;
}

.mu-cal-today-resource-badge .mu-cal-resource-header-badge {
  width: 100%;
  height: 100%;
  min-width: 0;
  border-radius: 0;
}

@container (max-width: 132px) {
  .mu-cal-today-resource-icon {
    display: none;
  }
}

@container (max-width: 104px) {
  .mu-cal-today-resource-studio-tag,
  .mu-cal-today-resource-capacity {
    display: none;
  }
}

@container (max-width: 84px) {
  .mu-cal-today-resource-dot,
  .mu-cal-today-resource-name {
    display: none;
  }

  .mu-cal-today-resource-short {
    display: inline-block;
  }
}

@container (max-width: 56px) {
  .mu-cal-today-resource-header-inner {
    padding: 0;
    gap: 0;
  }

  .mu-cal-today-resource-short {
    display: none;
  }

  .mu-cal-today-resource-badge {
    display: block;
  }
}

.mu-cal-week-grid {
  overflow-x: hidden;
}

/* Monatsansicht: gleicher Rahmen wie Today/Week, Kopfzeile (Wochentage) volle Breite, einheitlich */
.mu-cal-month-grid {
  min-width: 0;
}
/* Panel und Tabellen auf volle Breite, damit Kopfzeile nicht wie aufgelegte Tabelle wirkt */
.mu-cal-month-grid .ant-picker-calendar-full .ant-picker-panel {
  width: 100%;
}
.mu-cal-month-grid .ant-picker-calendar-full .ant-picker-panel .ant-picker-body,
.mu-cal-month-grid .ant-picker-calendar-full .ant-picker-panel .ant-picker-content {
  width: 100%;
}
.mu-cal-month-grid .ant-picker-calendar-full .ant-picker-panel .ant-picker-body table,
.mu-cal-month-grid .ant-picker-calendar-full .ant-picker-panel .ant-picker-content table {
  width: 100%;
  table-layout: fixed;
}
.mu-cal-month-grid .ant-picker-calendar-full .ant-picker-panel .ant-picker-body th,
.mu-cal-month-grid .ant-picker-calendar-full .ant-picker-panel .ant-picker-content th {
  background: var(--ant-color-bg-elevated);
  border-bottom: 2px solid var(--ant-color-border);
  padding: var(--m1-space-4) var(--m1-space-6);
  text-align: center;
  font-weight: 500;
}
/* Kopfzeile (Wochentage) als durchgehende Zeile: gleicher Hintergrund über die ganze Breite */
.mu-cal-month-grid .ant-picker-calendar-full .ant-picker-panel .ant-picker-body thead tr {
  background: var(--ant-color-bg-elevated);
}
.mu-cal-month-grid .ant-picker-calendar-full .ant-picker-panel .ant-picker-body thead th {
  width: 14.2857%; /* 1/7 für sieben Wochentage */
}

/* Oberste Woche: Antd-eigener border-top der Tageszellen entfällt, die Kopfzeile hat bereits die Trennlinie */
.mu-cal-month-grid .ant-picker-calendar-full .ant-picker-panel .ant-picker-body tbody tr:first-child .ant-picker-calendar-date {
  border-top: none;
}

.mu-cal-month-grid .ant-picker-calendar-date {
  cursor: pointer;
  transition: background 120ms ease-in-out, outline 120ms ease-in-out;
}

.mu-cal-month-grid .ant-picker-cell:not(.ant-picker-cell-disabled) .ant-picker-calendar-date:hover {
  background: var(--ant-color-primary-bg, color-mix(in srgb, var(--ant-color-primary) 12%, transparent));
  outline: 2px solid var(--ant-color-primary);
  outline-offset: -1px;
}

.mu-cal-month-grid .ant-picker-cell-selected .ant-picker-calendar-date,
.mu-cal-month-grid .ant-picker-cell-selected .ant-picker-calendar-date-today,
.mu-cal-month-grid .ant-picker-cell-selected .ant-picker-cell-inner {
  background: transparent !important;
  border-color: transparent !important;
  box-shadow: none !important;
}

.mu-cal-month-grid .ant-picker-cell-selected .ant-picker-calendar-date-value,
.mu-cal-month-grid .ant-picker-cell-selected .ant-picker-cell-inner {
  color: var(--ant-color-text) !important;
}

.mu-cal-month-grid .ant-picker-cell-today .ant-picker-calendar-date {
  background: color-mix(in srgb, var(--ant-color-primary) 10%, var(--ant-color-bg-container)) !important;
  border-color: var(--ant-color-primary) !important;
}

.mu-cal-month-grid .ant-picker-cell-today .ant-picker-calendar-date-value {
  color: var(--ant-color-primary) !important;
  font-weight: 700;
}

.mu-cal-month-appts {
  margin-top: var(--m1-space-6);
  display: flex;
  flex-wrap: wrap;
  gap: var(--m1-space-4);
  align-content: flex-start;
}

.mu-cal-month-appt-pill {
  min-width: 0;
  max-width: 100%;
  height: 20px;
  border: 1px solid var(--ant-color-border);
  border-radius: var(--m1-radius-4);
  padding: 0 var(--m1-space-5);
  font-size: var(--m1-font-size-11);
  font-weight: 700;
  line-height: var(--m1-line-height-18);
  cursor: pointer;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.mu-cal-month-appt-pill:hover {
  filter: brightness(1.06);
}

/* Grid-Zellen: Zeilenhöhe kommt vom Grid, nicht von min-height – Linien laufen horizontal durch */
.mu-cal-gridtable .mu-cal-cell {
  min-height: 0;
  border-bottom: 1px solid var(--ant-color-border-secondary);
  border-right: 1px solid var(--ant-color-border-secondary);
  padding: var(--m1-space-4) var(--m1-space-8);
  box-sizing: border-box;
  display: flex;
  align-items: center;
}

/* Tagesgrenzen nur im Mitarbeiter- und Zeitraster: nie nach Sonntag und nicht im Tagesbanner. */
.mu-cal-gridtable.mu-cal-week .mu-cal-week-resource-header.mu-cal-week-day-end,
.mu-cal-gridtable.mu-cal-week .mu-cal-slot.mu-cal-week-day-end,
.mu-cal-gridtable.mu-cal-week .mu-cal-time:not(.mu-cal-header-cell) {
  border-right: 2px solid var(--ant-color-border);
}

.mu-cal-cell {
  border-bottom: 1px solid var(--ant-color-border-secondary);
  border-right: 1px solid var(--ant-color-border-secondary);
  padding: var(--m1-space-8);
  min-height: 54px;
  box-sizing: border-box;
}

.mu-cal-header .mu-cal-cell {
  min-height: 52px;
  background: var(--ant-color-bg-elevated);
}

/* Kopfzeile: einheitliche Höhe, Inhalt zentriert, kräftige Trennlinie darunter */
.mu-cal-gridtable .mu-cal-header-cell {
  position: sticky;
  top: 0;
  z-index: 4;
  background: var(--ant-color-bg-elevated);
  border-bottom: 2px solid var(--ant-color-border);
  justify-content: center;
  align-items: center;
  padding: var(--m1-space-4) var(--m1-space-6);
}

.mu-cal-gridtable .mu-cal-header-cell .mu-cal-role {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 100%;
  justify-content: center;
}

/* Spalten per Drag & Drop umsortierbar */
.mu-cal-header-draggable {
  cursor: grab;
  user-select: none;
}
.mu-cal-header-draggable:active {
  cursor: grabbing;
}

.mu-cal-time {
  position: sticky;
  left: 0;
  z-index: 5;
  background: var(--ant-color-bg-container);
}

.mu-cal-header-cell {
  position: sticky;
  top: 0;
  z-index: 4;
  background: var(--ant-color-bg-elevated);
}

.mu-cal-header-cell.mu-cal-time {
  background: var(--ant-color-bg-elevated);
}

/* Zeit-Spalte: Label an Zeile ausrichten (zentriert in der Zelle) */
.mu-cal-gridtable .mu-cal-time:not(.mu-cal-header-cell) {
  justify-content: flex-end;
  padding-right: var(--m1-space-10);
}

.mu-cal-time-label {
  color: var(--ant-color-text-secondary);
  font-variant-numeric: tabular-nums;
  font-size: var(--m1-font-size-12);
}

.mu-cal-slot {
  cursor: pointer;
  transition: background 120ms ease-in-out, box-shadow 120ms ease-in-out;
  position: relative;
  align-items: stretch;
}

/* Hover wie unter Einstellungen → Verfügbarkeiten: Feld unter dem Cursor klar markieren */
.mu-cal-slot:hover {
  background: var(--ant-color-primary-bg, color-mix(in srgb, var(--ant-color-primary) 12%, transparent));
  outline: 2px solid var(--ant-color-primary);
  outline-offset: -1px;
  z-index: 3;
}

.mu-drop-target {
  background: color-mix(in srgb, var(--ant-color-primary) 28%, var(--ant-color-bg-container)) !important;
  outline: 2px solid var(--ant-color-primary);
  outline-offset: -2px;
  box-shadow:
    inset 0 0 0 2px color-mix(in srgb, var(--ant-color-primary) 86%, transparent),
    inset 0 0 0 999px color-mix(in srgb, var(--ant-color-primary) 14%, transparent),
    0 0 0 2px color-mix(in srgb, var(--ant-color-bg-container) 90%, transparent),
    0 0 0 4px color-mix(in srgb, var(--ant-color-primary) 55%, transparent);
  z-index: 3;
}

.mu-drop-target-range {
  outline: none;
  box-shadow:
    inset 3px 0 0 color-mix(in srgb, var(--ant-color-primary) 86%, transparent),
    inset -3px 0 0 color-mix(in srgb, var(--ant-color-primary) 86%, transparent),
    inset 0 0 0 999px color-mix(in srgb, var(--ant-color-primary) 16%, transparent),
    0 0 0 1px color-mix(in srgb, var(--ant-color-bg-container) 92%, transparent);
}

.mu-cal-gridtable .mu-cal-slot.mu-drop-target-range {
  border-bottom-color: transparent;
}

.mu-drop-target-range-start {
  box-shadow:
    inset 3px 0 0 color-mix(in srgb, var(--ant-color-primary) 86%, transparent),
    inset -3px 0 0 color-mix(in srgb, var(--ant-color-primary) 86%, transparent),
    inset 0 3px 0 color-mix(in srgb, var(--ant-color-primary) 86%, transparent),
    inset 0 0 0 999px color-mix(in srgb, var(--ant-color-primary) 16%, transparent),
    0 0 0 1px color-mix(in srgb, var(--ant-color-bg-container) 92%, transparent);
}

.mu-drop-target-range-end {
  box-shadow:
    inset 3px 0 0 color-mix(in srgb, var(--ant-color-primary) 86%, transparent),
    inset -3px 0 0 color-mix(in srgb, var(--ant-color-primary) 86%, transparent),
    inset 0 -3px 0 color-mix(in srgb, var(--ant-color-primary) 86%, transparent),
    inset 0 0 0 999px color-mix(in srgb, var(--ant-color-primary) 16%, transparent),
    0 0 0 1px color-mix(in srgb, var(--ant-color-bg-container) 92%, transparent);
}

.mu-drop-target-range-start.mu-drop-target-range-end {
  box-shadow:
    inset 0 0 0 3px color-mix(in srgb, var(--ant-color-primary) 86%, transparent),
    inset 0 0 0 999px color-mix(in srgb, var(--ant-color-primary) 16%, transparent),
    0 0 0 2px color-mix(in srgb, var(--ant-color-bg-container) 90%, transparent),
    0 0 0 4px color-mix(in srgb, var(--ant-color-primary) 55%, transparent);
}

.mu-cal-appt {
  /* Terminart-Farbe füllt den Termin; Detailtext bleibt im Tooltip. */
  border: 1px solid color-mix(in srgb, var(--mu-appt-color, var(--ant-color-primary)) 82%, var(--ant-color-border));
  background: var(--mu-appt-color, var(--ant-color-primary));
  color: var(--mu-appt-text-color, var(--ant-color-text));
  border-radius: var(--m1-radius-6);
  padding: var(--m1-space-3);
  margin-bottom: var(--m1-space-2);
  position: relative;
  cursor: grab;
  transition: box-shadow 120ms ease-in-out, opacity 120ms ease-in-out, transform 120ms ease-in-out;
  height: 100%;
  min-height: 0;
  display: flex;
  flex-direction: column;
  box-sizing: border-box;
  container-type: inline-size;
}

/* Wenn ein Termin im Slot steht: Hover markiert den Termin-Block (wie leere Slots) */
.mu-cal-appt:hover {
  box-shadow: 0 0 0 2px var(--ant-color-primary);
  outline: none;
}

.mu-cal-appt-span {
  margin: var(--m1-space-4);
  height: calc(100% - 8px);
  overflow: visible;
  z-index: 4;
}

.mu-cal-appt-overlap {
  padding: var(--m1-space-2);
  box-shadow:
    0 1px 3px color-mix(in srgb, var(--ant-color-text, #000) 18%, transparent),
    inset 0 0 0 1px color-mix(in srgb, var(--mu-appt-text-color, #fff) 28%, transparent);
}

.mu-cal-appt:active {
  cursor: grabbing;
}

.mu-cal-appt-resize-handle {
  position: absolute;
  left: 0;
  right: 0;
  z-index: 5;
  height: var(--m1-space-16);
  cursor: ns-resize;
  touch-action: none;
}

.mu-cal-appt-resize-handle-start {
  top: calc(var(--m1-space-8) * -1);
}

.mu-cal-appt-resize-handle-end {
  bottom: calc(var(--m1-space-8) * -1);
}

.mu-cal-appt-resize-preview {
  box-shadow: 0 0 0 2px var(--ant-color-primary);
}

.mu-cal-appt-drag-source {
  opacity: 0.72;
  transform: scale(0.985);
  box-shadow:
    0 8px 18px color-mix(in srgb, var(--ant-color-text, #000) 22%, transparent),
    0 0 0 2px color-mix(in srgb, var(--mu-appt-text-color, #fff) 40%, transparent);
  cursor: grabbing;
}

.mu-cal-appt-drag-ghost {
  position: fixed;
  left: 0;
  top: 0;
  z-index: 2000;
  margin: 0;
  pointer-events: none;
  opacity: 1;
  visibility: visible;
  overflow: hidden;
  transform-origin: top left;
  box-shadow:
    0 14px 32px color-mix(in srgb, var(--ant-color-text, #000) 28%, transparent),
    0 0 0 2px color-mix(in srgb, var(--mu-appt-text-color, #fff) 42%, transparent);
}

.mu-cal-dragging-appointment .mu-cal-appt-drag-ghost {
  opacity: 1;
}

.mu-cal-appt-drag-ghost .mu-cal-appt-content,
.mu-cal-appt-drag-ghost .mu-cal-appt-type,
.mu-cal-appt-drag-ghost .mu-cal-appt-type-short,
.mu-cal-appt-drag-ghost .mu-cal-appt-person {
  opacity: 1;
  visibility: visible;
}

.mu-cal-appt:last-child {
  margin-bottom: 0;
}

.mu-cal-appt-content {
  width: 100%;
  min-width: 0;
  height: 100%;
  box-sizing: border-box;
  padding-right: 0;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  justify-content: flex-start;
  gap: var(--m1-space-2);
  overflow: hidden;
}

.mu-cal-appt-has-status .mu-cal-appt-content {
  padding-right: var(--m1-space-14);
}

.mu-cal-appt-type,
.mu-cal-appt-type-short,
.mu-cal-appt-person {
  max-width: 100%;
  color: var(--mu-appt-text-color, var(--ant-color-text));
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.mu-cal-appt-type,
.mu-cal-appt-type-short {
  font-size: var(--mu-cal-appt-font-size, var(--m1-font-size-11));
  font-weight: 700;
  line-height: var(--m1-line-height-1-15);
}

.mu-cal-appt-type-short {
  display: block;
}

.mu-cal-appt-person {
  font-size: var(--mu-cal-appt-font-size, var(--m1-font-size-11));
  font-weight: 500;
  line-height: var(--m1-line-height-1-15);
  opacity: 0.92;
}

.mu-cal-dragging-appointment .mu-cal-appt {
  pointer-events: none;
}

.mu-cal-appt-status-icon {
  position: absolute;
  top: 3px;
  right: 4px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--mu-appt-text-color, var(--ant-color-text));
  font-size: var(--m1-font-size-12);
  line-height: var(--m1-line-height-1);
  opacity: 0.92;
  z-index: 4;
  pointer-events: none;
  text-shadow: 0 1px 2px color-mix(in srgb, var(--mu-appt-color, #000) 45%, transparent);
}

@container (max-width: 32px) {
  .mu-cal-appt-has-status .mu-cal-appt-content {
    padding-top: var(--m1-space-14);
    padding-right: 0;
  }

  .mu-cal-appt-status-icon {
    top: 2px;
    right: 50%;
    width: 10px;
    height: 10px;
    font-size: var(--m1-font-size-10);
    transform: translateX(50%);
    overflow: hidden;
  }
}

.mu-calendar-status-selector {
  display: flex;
  flex-wrap: wrap;
  gap: var(--m1-space-6);
  max-width: 100%;
  min-width: 0;
}

.mu-calendar-status-option.ant-btn {
  height: auto;
  min-height: 30px;
  max-width: 100%;
  white-space: normal;
  overflow-wrap: anywhere;
  text-align: left;
  line-height: var(--m1-line-height-1-2);
  padding: var(--m1-space-4) var(--m1-space-10);
}

.mu-cal-role {
  display: flex;
  align-items: center;
  gap: var(--m1-space-8);
}

.mu-cal-role-dot {
  width: 10px;
  height: 10px;
  border-radius: var(--m1-radius-3);
  background: var(--ant-color-primary);
}

.mu-cal-resource-header-badge {
  min-width: 22px;
  height: 22px;
  border-radius: var(--m1-radius-6);
  padding: 0 var(--m1-space-6);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--mu-resource-header-color, var(--ant-color-primary));
  color: var(--mu-resource-header-text-color, #fff);
  font-size: var(--m1-font-size-12);
  font-weight: 700;
  line-height: var(--m1-line-height-1);
  box-sizing: border-box;
  flex: 0 0 auto;
}

.mu-cal-week .mu-cal-week-resource-header {
  padding: 0;
}

.mu-cal-week .mu-cal-week-resource-header .mu-cal-day-sub {
  height: 100%;
  gap: 0;
}

.mu-cal-week .mu-cal-week-resource-header .mu-cal-resource-header-badge {
  width: 100%;
  height: 100%;
  min-width: 0;
  border-radius: 0;
  font-size: var(--m1-font-size-12);
}

/* Spaltenkopf (Dienstplan/Verfügbarkeiten): voller Name, wenn Platz ist; sonst Kürzel.
   Container-Query gegen die Spaltenbreite des Kopf-Kästchens. */
.mu-week-col-badge {
  container-type: inline-size;
  padding: 0 var(--m1-space-4);
}
.mu-week-col-badge .mu-week-col-full,
.mu-week-col-badge .mu-week-col-short {
  display: block;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.mu-week-col-badge .mu-week-col-short {
  display: none;
}
@container (max-width: 72px) {
  .mu-week-col-badge .mu-week-col-full {
    display: none;
  }
  .mu-week-col-badge .mu-week-col-short {
    display: block;
  }
}

.mu-cal-day {
  display: flex;
  flex-direction: column;
  line-height: var(--m1-line-height-1-1);
  align-items: center;
  justify-content: center;
  text-align: center;
}

.mu-cal-day-top {
  font-weight: 600;
}

.mu-cal-day-sub {
  color: var(--ant-color-text-secondary);
  font-size: var(--m1-font-size-11);
}

/* DatePicker und TimePicker im Dark Mode sichtbar machen */
:root[data-theme="dark"] .ant-picker-dropdown {
  /* Ensure dropdown itself doesn't look "different" from the app background */
  background-color: transparent !important;
}

:root[data-theme="dark"] .ant-picker-dropdown .ant-picker-panel-container {
  /* Use the same container background as the app (darker), not "elevated" gray */
  background-color: var(--ant-color-bg-container, #141414) !important;
  color: var(--ant-color-text, rgba(255, 255, 255, 0.88)) !important;
  border: 1px solid var(--ant-color-border-secondary, rgba(255, 255, 255, 0.12)) !important;
  /* border-right wird weiter unten explizit gesetzt, damit sie durchgezogen wird */
}

:root[data-theme="dark"] .ant-picker-dropdown .ant-picker-panel {
  /* Use the same container background as the app (darker), not "elevated" gray */
  background-color: var(--ant-color-bg-container, #141414) !important;
  color: var(--ant-color-text, rgba(255, 255, 255, 0.88)) !important;
  border-right: none !important; /* Entferne rechte Border vom Panel, damit Container-Border sichtbar bleibt */
}

:root[data-theme="dark"] .ant-picker-dropdown .ant-picker-header,
:root[data-theme="dark"] .ant-picker-dropdown .ant-picker-footer {
  background-color: var(--ant-color-bg-container, #141414) !important;
  border-color: var(--ant-color-border-secondary, rgba(255, 255, 255, 0.12)) !important;
}

:root[data-theme="dark"] .ant-picker-dropdown .ant-picker-panel-container {
  box-shadow: 0 12px 28px rgba(0, 0, 0, 0.55) !important;
}

:root[data-theme="dark"] .ant-picker-dropdown .ant-picker-header button {
  color: var(--ant-color-text, rgba(255, 255, 255, 0.88)) !important;
}

:root[data-theme="dark"] .ant-picker-dropdown .ant-picker-content th {
  color: var(--ant-color-text-secondary, rgba(255, 255, 255, 0.65)) !important;
}

/* TimePicker spezifisch */
.ant-picker-time-panel-column > li {
  color: var(--ant-color-text, rgba(255, 255, 255, 0.88)) !important;
}

.ant-picker-time-panel-column > li:hover {
  background-color: var(--ant-color-bg-container-hover, rgba(255, 255, 255, 0.08)) !important;
}

.ant-picker-time-panel-column > li.ant-picker-time-panel-cell-selected {
  background-color: var(--ant-color-primary) !important;
  color: var(--ant-color-white) !important;
}

/* DatePicker Kalender-Zellen */
.ant-picker-cell {
  color: var(--ant-color-text, rgba(255, 255, 255, 0.88)) !important;
}

.ant-picker-cell-in-view {
  color: var(--ant-color-text, rgba(255, 255, 255, 0.88)) !important;
}

.ant-picker-cell:hover:not(.ant-picker-cell-disabled):not(.ant-picker-cell-selected) {
  background-color: var(--ant-color-bg-container-hover, rgba(255, 255, 255, 0.08)) !important;
}

/* Stelle sicher, dass renderExtraFooter-Inhalt mittig ausgerichtet ist (Padding kommt inline aus der Komponente) */
.date-picker-duration-footer {
  justify-content: center !important;
}

/* Stelle sicher, dass die InputNumber-Felder im Footer gleich groß sind, aber nicht zu breit */
.date-picker-duration-footer .ant-input-number {
  width: 100% !important;
  max-width: 75px !important;
}

/* "Heute"-Link im DatePicker-Footer: Standard-Textfarbe statt Primary (blau) */
.ant-picker-footer .ant-picker-today-btn {
  color: var(--ant-color-text, rgba(0, 0, 0, 0.88)) !important;
}
:root[data-theme="dark"] .ant-picker-footer .ant-picker-today-btn {
  color: var(--ant-color-text, rgba(255, 255, 255, 0.85)) !important;
}

/* Member-App Lesegerät-Zuordnung: Checkbox-Zelle immer klickbar (kein Overlay/pointer-events blockieren) */
.member-app-reader-assignments-table .ant-table-cell {
  pointer-events: auto !important;
}
.member-app-reader-assignments-table .ant-table-cell input[type="checkbox"] {
  pointer-events: auto !important;
  cursor: pointer;
}

/* Wrapper für Einstellungslisten (SettingsListPage): Spaltenbreiten automatisch, kein zusätzliches Layout-CSS */
.settings-list-table-wrap .ant-table-cell,
.settings-list-table-wrap .ant-table-thead > tr > th {
  outline: none;
  box-shadow: none;
}
.settings-list-table-wrap .ant-table,
.settings-list-table-wrap .ant-table-container,
.settings-list-table-wrap .ant-table-content {
  max-width: 100%;
}
.settings-list-table-wrap .ant-table-thead > tr > th,
.settings-list-table-wrap .ant-table-tbody > tr > td {
  padding-left: var(--m1-space-8) !important;
  padding-right: var(--m1-space-8) !important;
}
.settings-list-table-wrap .ant-table table {
  width: 100% !important;
}
.settings-list-table-wrap .logs-table .ant-table-content {
  overflow-x: hidden !important;
}
.settings-list-table-wrap .logs-table .ant-table-cell,
.settings-list-table-wrap .logs-table .ant-table-cell .ant-table-cell-content,
.settings-list-table-wrap .logs-table .ant-table-cell .ant-typography {
  min-width: 0;
}
.settings-list-table-wrap .logs-table .ant-table-tbody > tr > td {
  vertical-align: top;
}
.settings-list-table-wrap .logs-table code,
.settings-list-table-wrap .logs-table pre {
  max-width: 100%;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  word-break: break-word;
}
/* Keine Trennlinie zwischen letzter Daten-Spalte und Aktions-/Zahnrad-Spalte (fixed right) */
.settings-list-table-wrap .ant-table-cell-fix-right::before,
.settings-list-table-wrap .ant-table-cell-fix-right::after {
  box-shadow: none !important;
}
.settings-list-table-wrap .settings-list-expanded-detail-table .ant-table-content {
  overflow-x: hidden !important;
}
.settings-list-table-wrap .settings-list-expanded-detail-table .ant-table {
  background: transparent;
}
.settings-list-table-wrap .ant-table-tbody > tr.settings-list-expanded-inlay-row > td {
  background: transparent !important;
  padding: 0 !important;
}
.settings-list-table-wrap .ant-table-tbody > tr.settings-list-expanded-inlay-row .ant-table-expanded-row-fixed {
  margin: 0 !important;
  padding: 0 !important;
}
.settings-list-card-children {
  display: grid;
  gap: var(--m1-space-8);
  margin-top: var(--m1-space-8);
  padding-left: var(--m1-space-12);
  border-left: 3px solid rgba(22, 119, 255, 0.22);
}
.settings-list-card-child {
  background: rgba(22, 119, 255, 0.04);
}
.settings-list-card-field-value {
  max-width: 100%;
}
.settings-list-card-field-label {
  color: var(--ant-color-text-secondary);
  flex-shrink: 0;
}
.settings-list-card-field-value .ant-typography {
  max-width: 100%;
}
.settings-list-card-field-value .ant-typography-ellipsis,
.settings-list-card-field-value .ant-typography-ellipsis-single-line {
  white-space: normal !important;
}
@media (max-width: 575px) {
  .settings-list-card-field-row {
    align-items: flex-start !important;
  }
  .settings-list-card-field-label {
    flex: 0 1 140px;
    max-width: 42%;
    overflow-wrap: break-word;
    word-break: normal;
  }
  .settings-list-card-field-value {
    flex: 1 1 0;
    min-width: 0;
    text-align: left !important;
  }
}
@media (max-width: 575px) {
  .settings-list-card-field-label {
    max-width: 38%;
  }
}
@media (max-width: 359px) {
  .settings-list-card-field-label,
  .settings-list-card-field-value {
    flex-basis: 100%;
    max-width: 100%;
  }
}
.settings-list-card-actions-row {
  align-self: stretch;
  flex: 0 0 auto;
  row-gap: var(--m1-space-8);
  justify-content: flex-end !important;
  align-items: center;
  text-align: right;
}
.settings-list-card-actions-row > * {
  flex: 0 0 auto;
}
.settings-list-card-actions-row > .ant-flex,
.settings-list-card-actions-row > .ant-space {
  justify-content: flex-end;
  max-width: 100%;
}
.settings-list-card-actions-row .ant-btn {
  white-space: nowrap;
}
@media (max-width: 575px) {
  .settings-list-card-actions-row {
    flex-direction: column;
    align-items: flex-end !important;
  }
}
.settings-list-card-actions-row-mobile .ant-btn {
  min-width: 32px;
  width: 32px;
  height: 32px;
  min-height: 32px;
  padding: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.settings-list-card-header-extra > .ant-space {
  justify-content: flex-end;
  width: 100%;
}
.settings-list-card-header-extra > .ant-flex,
.settings-list-card-header-extra > .ant-space {
  justify-content: flex-end;
  max-width: 100%;
}
.page-header-extra {
  flex: 0 0 auto;
  min-width: 0;
  display: flex;
  justify-content: flex-end;
}
.page-header-extra > .ant-space,
.page-header-extra > .ant-flex {
  justify-content: flex-end;
  max-width: 100%;
}
.settings-list-toolbar-extra,
.settings-list-toolbar-right {
  max-width: 100%;
}
.settings-list-toolbar-extra {
  display: flex;
  justify-content: flex-start;
}
.settings-list-toolbar-extra > .ant-flex,
.settings-list-toolbar-extra > .ant-space {
  justify-content: flex-start;
  max-width: 100%;
}
.settings-list-toolbar-extra > .ant-space > .ant-space-item {
  max-width: 100%;
}
.settings-list-toolbar-extra > .ant-space > .ant-space-item > .ant-flex,
.settings-list-toolbar-extra > .ant-space > .ant-space-item > .ant-space {
  justify-content: flex-start;
  max-width: 100%;
}
.settings-list-toolbar-right > .ant-flex,
.settings-list-toolbar-right > .ant-space {
  justify-content: flex-end;
  max-width: 100%;
}
.person-detail-toolbar-switch {
  max-width: 100%;
}
.person-detail-toolbar-switch .ant-typography {
  min-width: 0;
  overflow-wrap: anywhere;
}
.person-profile-action-bar {
  padding-bottom: var(--m1-space-16);
  border-bottom: 1px solid var(--ant-color-split, rgba(5, 5, 5, 0.06));
}
.person-profile-save-action {
  min-width: 0;
}
.settings-list-toolbar-extra .ant-select,
.settings-list-toolbar-extra .ant-input,
.settings-list-toolbar-extra .ant-input-affix-wrapper,
.settings-list-toolbar-extra .ant-picker,
.settings-list-toolbar-extra .ant-segmented,
.settings-list-toolbar-right .ant-select,
.settings-list-toolbar-right .ant-input,
.settings-list-toolbar-right .ant-input-affix-wrapper,
.settings-list-toolbar-right .ant-picker {
  max-width: 100%;
}
.persons-list-toolbar-actions,
.leads-list-toolbar-actions {
  justify-content: flex-end !important;
  max-width: 100%;
}
.persons-list-search-controls {
  max-width: 100%;
}
.leads-list-search-controls {
  max-width: 100%;
}
.persons-list-filter-controls {
  max-width: 100%;
}
.leads-list-filter-controls {
  max-width: 100%;
}
.persons-list-filter-controls .ant-tag {
  max-width: 100%;
  margin-inline-end: 0;
  overflow-wrap: anywhere;
  white-space: normal;
}
.leads-list-filter-controls .ant-tag {
  max-width: 100%;
  margin-inline-end: 0;
  overflow-wrap: anywhere;
  white-space: normal;
}
.persons-list-toolbar-action-buttons {
  max-width: 100%;
}
.person-digital-file-mobile-actions {
  justify-content: flex-end !important;
  max-width: 100%;
}
@media (min-width: 576px) {
  .settings-list-toolbar-right:has(.persons-list-toolbar-actions) {
    flex: 0 0 auto !important;
  }
  .settings-list-toolbar-right:has(.leads-list-toolbar-actions) {
    flex: 0 0 auto !important;
  }
  .settings-list-toolbar-extra:has(.persons-list-basic-search) {
    flex: 1 1 auto !important;
  }
  .settings-list-toolbar-extra:has(.leads-list-basic-search) {
    flex: 1 1 auto !important;
  }
  .settings-list-toolbar-extra:has(.persons-list-basic-search) > .ant-space,
  .settings-list-toolbar-extra:has(.persons-list-basic-search) > .ant-space > .ant-space-item {
    width: 100%;
    min-width: 0;
  }
  .settings-list-toolbar-extra:has(.leads-list-basic-search) > .ant-space,
  .settings-list-toolbar-extra:has(.leads-list-basic-search) > .ant-space > .ant-space-item {
    width: 100%;
    min-width: 0;
  }
  .persons-list-search-controls {
    flex-wrap: nowrap !important;
    width: 100%;
  }
  .leads-list-search-controls {
    flex-wrap: nowrap !important;
    width: 100%;
  }
  .persons-list-basic-search {
    flex: 1 1 auto !important;
    min-width: 0 !important;
  }
  .leads-list-basic-search {
    flex: 1 1 auto !important;
    min-width: 0 !important;
  }
  .persons-list-filter-controls {
    flex: 0 0 auto;
  }
  .leads-list-filter-controls {
    flex: 0 0 auto;
  }
}
.persons-list-advanced-active-tag {
  display: flex;
  justify-content: flex-end;
  max-width: 100%;
}
.persons-list-advanced-active-tag .ant-tag {
  max-width: 100%;
  margin-inline-end: 0;
  overflow-wrap: anywhere;
  white-space: normal;
  text-align: right;
}
@media (max-width: 767px) {
  .settings-list-toolbar-extra {
    width: 100%;
  }
  .settings-list-toolbar-extra > .ant-space {
    display: flex;
    width: 100%;
    flex-direction: column;
    align-items: stretch;
  }
  .settings-list-toolbar-extra > .ant-space > .ant-space-item,
  .settings-list-toolbar-extra > div {
    min-width: 0;
  }
  .settings-list-toolbar-extra > .ant-space > .ant-space-item {
    width: 100%;
  }
  .settings-list-toolbar-extra .ant-select,
  .settings-list-toolbar-extra .ant-input,
  .settings-list-toolbar-extra .ant-input-affix-wrapper,
  .settings-list-toolbar-extra .ant-picker,
  .settings-list-toolbar-extra .ant-segmented {
    width: 100% !important;
    min-width: 0 !important;
  }
  .settings-list-toolbar-extra > div {
    width: 100%;
    flex-direction: column;
    align-items: stretch;
  }
  .settings-list-toolbar-extra > .person-detail-toolbar-switch {
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
  }
  .person-detail-toolbar-switch .ant-switch {
    flex: 0 0 auto;
  }
  .person-profile-action-bar {
    align-items: stretch !important;
  }
  .person-profile-save-action {
    width: 100%;
    justify-content: flex-end !important;
  }
  .settings-list-toolbar-extra > .ant-space-compact {
    flex-direction: row;
    align-items: stretch;
  }
  .settings-list-toolbar-extra > div > .ant-space {
    width: 100%;
  }
  .settings-list-toolbar-right {
    justify-content: flex-end !important;
  }
  .settings-list-toolbar-right > .ant-flex,
  .settings-list-toolbar-right > .ant-space {
    width: 100%;
  }
  .page-header-main,
  .page-header-extra {
    width: 100%;
  }
  .page-header-extra {
    flex: 1 1 100%;
  }
  .page-header-extra .ant-btn {
    max-width: 100%;
  }
  .ant-drawer .ant-drawer-header {
    flex-wrap: wrap;
    row-gap: var(--m1-space-8);
  }
  .ant-drawer .ant-drawer-header-title {
    min-width: 0;
    flex: 1 1 auto;
  }
  .ant-drawer .ant-drawer-title {
    min-width: 0;
    overflow-wrap: anywhere;
  }
  .ant-drawer .ant-drawer-extra {
    flex: 1 1 100%;
    min-width: 0;
    margin-inline-start: 0;
    display: flex;
    justify-content: flex-end;
  }
  .ant-drawer .ant-drawer-extra > .ant-space,
  .ant-drawer .ant-drawer-extra > .ant-flex {
    justify-content: flex-end;
    flex-wrap: wrap;
    max-width: 100%;
  }
  .persons-list-toolbar-actions,
  .leads-list-toolbar-actions {
    justify-content: flex-end !important;
  }
  .persons-list-toolbar-actions {
    width: 100%;
  }
  .persons-list-search-controls,
  .persons-list-filter-controls {
    width: 100%;
  }
  .persons-list-filter-controls {
    justify-content: flex-start !important;
  }
  .persons-list-toolbar-action-buttons .ant-btn {
    flex: 0 0 auto;
  }
  .persons-list-advanced-active-tag {
    flex-basis: 100%;
    justify-content: flex-end;
  }
  .persons-list-basic-search .ant-input {
    min-width: 0;
  }
}
@media (min-width: 576px) and (max-width: 767px) {
  .settings-list-toolbar-row {
    flex-direction: row !important;
    align-items: flex-end !important;
    flex-wrap: wrap !important;
  }
  .settings-list-toolbar-extra {
    width: auto;
    flex: 0 1 auto;
  }
  .settings-list-toolbar-extra > .ant-space {
    width: auto;
    flex-direction: row;
    align-items: center;
  }
  .settings-list-toolbar-extra > .ant-space > .ant-space-item {
    width: auto;
  }
  .settings-list-toolbar-extra > div {
    width: auto;
    flex-direction: row;
    align-items: center;
  }
  .settings-list-toolbar-extra .ant-select,
  .settings-list-toolbar-extra .ant-input,
  .settings-list-toolbar-extra .ant-input-affix-wrapper,
  .settings-list-toolbar-extra .ant-picker,
  .settings-list-toolbar-extra .ant-segmented {
    width: auto !important;
  }
  .settings-list-toolbar-right {
    width: auto !important;
  }
  .settings-list-toolbar-right > .ant-flex,
  .settings-list-toolbar-right > .ant-space {
    width: auto;
  }
  .persons-list-basic-search {
    width: auto !important;
  }
.persons-list-basic-search .ant-input {
    width: 240px !important;
    flex: 0 0 240px !important;
  }
}
.persons-list-photo-cell {
  display: inline-flex;
  justify-content: flex-end;
  max-width: 100%;
}
.settings-list-card-field-value .persons-list-photo-cell {
  width: 100%;
}
@media (max-width: 575px) {
  .persons-list-toolbar-action-buttons {
    width: 100%;
    justify-content: flex-end !important;
  }
  .leads-list-toolbar-actions {
    width: 100%;
    justify-content: flex-end !important;
  }
  .person-digital-file-mobile-actions {
    width: 100%;
    justify-content: flex-end !important;
  }
}
@media (min-width: 576px) {
  .person-digital-file-timeline-filters {
    justify-content: flex-start;
  }
  .person-digital-file-timeline-filters > .ant-flex {
    justify-content: flex-start;
  }
  .person-digital-file-timeline-filters .ant-tag {
    margin-inline-end: 0;
  }
  .settings-list-toolbar-row:has(.person-digital-file-timeline-filters) .settings-list-toolbar-extra {
    flex: 0 1 auto !important;
  }
  .settings-list-toolbar-row:has(.person-digital-file-timeline-filters) .settings-list-toolbar-right {
    flex: 0 0 auto !important;
    align-self: flex-end;
  }
}
.person-digital-file-filter-options > .ant-tag {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-width: 0;
  margin-inline-end: 0;
  white-space: normal;
}
.person-digital-file-filter-options > .ant-tag-checkable {
  border: 1px solid rgba(5, 5, 5, 0.16);
  border-radius: var(--m1-radius-6);
  background: rgba(255, 255, 255, 0.72);
}
.person-digital-file-filter-options > .ant-tag-checkable-checked {
  border-color: var(--ant-color-primary, #1677ff);
  background: var(--ant-color-primary, #1677ff);
}
.communication-composer {
  display: flex;
  flex-direction: column;
  gap: var(--m1-space-16);
  min-width: 0;
}
.communication-composer-settings-inline {
  order: 1;
  margin-top: 0 !important;
  min-width: 0;
}
.communication-composer-editor-card {
  order: 2;
  min-width: 0;
}
.communication-composer-preview-toggle {
  display: inline-flex;
  align-items: center;
  gap: var(--m1-space-6);
  color: var(--ant-color-text-secondary);
  font-size: var(--m1-font-size-13);
  white-space: nowrap;
}
.communication-composer-settings-trigger {
  order: 3;
}
.communication-composer-mobile-document-editor {
  min-width: 0;
}
.communication-composer-mobile-document-editor textarea.ant-input {
  resize: vertical;
  width: 100%;
}
@media (max-width: 767px) {
  .person-digital-file-filter-options {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }
}
:root[data-theme="dark"] .person-digital-file-filter-options > .ant-tag-checkable {
  border-color: rgba(255, 255, 255, 0.18);
  background: rgba(255, 255, 255, 0.08);
}
.close-contract-steps.ant-steps .ant-steps-item-wait > .ant-steps-item-container > .ant-steps-item-content > .ant-steps-item-title,
.close-contract-steps.ant-steps .ant-steps-item-wait > .ant-steps-item-container > .ant-steps-item-content > .ant-steps-item-title:hover,
.close-contract-steps.ant-steps .ant-steps-item-wait:hover .ant-steps-item-title {
  color: var(--ant-color-text-description, rgba(0, 0, 0, 0.45)) !important;
}
.checkin-toolbar-controls {
  row-gap: var(--m1-space-8);
}
.checkin-toolbar-segmented.ant-segmented {
  border: 1px solid var(--ant-color-border, rgba(5, 5, 5, 0.16));
  background: var(--ant-color-bg-container, #fff);
  overflow-x: visible;
}
.checkin-toolbar-segmented.ant-segmented .ant-segmented-group {
  flex-wrap: nowrap;
}
.checkin-toolbar-segmented.ant-segmented .ant-segmented-item {
  flex: 1 1 0;
  text-align: center;
}
.article-sales-draft-article {
  flex: 1 1 220px;
  min-width: 0;
}
.article-sales-draft-row {
  flex-wrap: nowrap;
}
.article-sales-draft-fields {
  flex: 1 1 auto;
  min-width: 0;
}
.article-sales-draft-quantity {
  flex: 0 0 140px;
  min-width: 88px;
}
.article-sales-draft-remove {
  flex: 0 0 auto;
}
@media (max-width: 767px) {
  .checkin-toolbar-controls {
    justify-content: flex-end;
  }
  .checkin-toolbar-segmented.ant-segmented {
    flex: 1 1 0;
    min-width: 0;
  }
  .article-sales-draft-fields {
    flex-direction: column;
  }
  .article-sales-draft-article,
  .article-sales-draft-quantity {
    flex: 0 0 auto;
    width: 100%;
  }
  .article-sales-draft-row-actions {
    justify-content: flex-end;
  }
  .article-sales-draft-actions {
    align-items: center;
  }
  .article-sales-draft-actions > .ant-btn:first-child {
    flex: 1 1 auto;
    min-width: 0;
  }
  .article-sales-draft-actions > .ant-btn:last-child {
    flex: 0 0 auto;
  }
}
:root[data-theme="dark"] .settings-list-card-children {
  border-left-color: rgba(64, 150, 255, 0.34);
}
:root[data-theme="dark"] .settings-list-card-child {
  background: rgba(64, 150, 255, 0.12);
}
/* Zahnrad-Spalte: keine linke Trennlinie zur Nachbarspalte */
.settings-list-table-wrap .ant-table-thead > tr > th.settings-list-gear-column,
.settings-list-table-wrap .ant-table-cell.settings-list-gear-column {
  border-left: none !important;
}
/* Aktionsspalte ohne fixed: keine linke Trennlinie */
.settings-list-table-wrap .ant-table-thead > tr > th.settings-list-actions-column-no-fix,
.settings-list-table-wrap .ant-table-cell.settings-list-actions-column-no-fix {
  border-left: none !important;
}
/* Aktionsspalten: Inhaltsbreite, keine Ellipsis/Clipping; die Umschaltung Full -> Icon passiert zentral per Messung. */
.settings-list-table-wrap .ant-table-cell.settings-list-actions-cell,
.settings-list-table-wrap .ant-table-thead > tr > th.settings-list-actions-cell {
  box-sizing: border-box;
  max-width: none !important;
  white-space: nowrap !important;
  overflow: visible !important;
  vertical-align: middle !important;
}
.settings-list-table-wrap .settings-list-actions-cell .ant-table-cell-content {
  overflow: visible !important;
}
.settings-list-table-wrap .settings-list-actions-cell .ant-space {
  flex-wrap: nowrap;
  justify-content: flex-end;
  gap: var(--m1-space-6) !important;
  width: max-content;
  min-width: max-content;
  margin-left: auto;
}
.settings-list-table-wrap .settings-list-actions-cell.settings-list-actions-cell-icon-only .ant-space {
  width: 100%;
  min-width: 0;
}
.settings-list-table-wrap .settings-list-actions-cell .ant-btn {
  flex: 0 0 auto;
  padding-inline: var(--m1-space-2);
  white-space: nowrap !important;
}
/* Daten-Spalten: keine pauschale Maximalbreite; die Tabelle darf freie Breite für lange Inhalte nutzen. */
.settings-list-table-wrap .ant-table-cell.settings-list-wrap-cell {
  min-width: 0;
}
.settings-list-table-wrap .ant-table-tbody > tr.settings-list-row-active > td {
  background: rgba(22, 119, 255, 0.12) !important;
}
:root[data-theme="dark"] .settings-list-table-wrap .ant-table-tbody > tr.settings-list-row-active > td {
  background: rgba(64, 150, 255, 0.2) !important;
}

/* Personen: Vertragspakete (Baum): Zeilen + Expand (+) + fixe Aktions-Spalte ausrichten */
.persons-contracts-table .ant-table-tbody > tr > td {
  vertical-align: middle;
}
.persons-contracts-table .ant-table-thead > tr > th {
  vertical-align: middle;
}
.persons-contracts-table .ant-table-cell.ant-table-row-expand-icon-cell {
  white-space: nowrap;
  vertical-align: middle;
  width: 48px;
  line-height: var(--m1-line-height-1);
}
/* Vertragsspalte: kein Umbruch mitten im Namen (neben Expand) */
.persons-contracts-table td.persons-contracts-col-contract {
  white-space: nowrap !important;
  overflow: hidden;
  text-overflow: ellipsis;
  vertical-align: middle;
}
.persons-contracts-table td.persons-contracts-col-contract .ant-table-cell-content,
.persons-contracts-table td.persons-contracts-col-contract .ant-typography {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap !important;
}
.settings-list-table-wrap td.persons-contracts-col-contract,
.settings-list-table-wrap td.persons-contracts-col-contract .ant-table-cell-content,
.settings-list-table-wrap td.persons-contracts-col-contract .ant-typography {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap !important;
}
.persons-contracts-table .persons-contracts-contract-cell-text {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  max-width: 100%;
}
.settings-list-table-wrap .persons-contracts-contract-cell-text {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  max-width: 100%;
}
/* Fixierte Aktionsspalte: vertikal mittig (Breite kommt aus ProTable column width/minWidth) */
.persons-contracts-table .ant-table-cell-fix-right.persons-contracts-actions-cell,
.persons-contracts-table .ant-table-thead > tr > th.ant-table-cell-fix-right.persons-contracts-actions-cell {
  vertical-align: middle !important;
  box-sizing: border-box;
  min-width: max-content;
  white-space: nowrap;
}
.persons-contracts-table .ant-table-tbody > tr > td.ant-table-cell-fix-right .ant-space {
  flex-wrap: nowrap;
  justify-content: flex-end;
  width: max-content;
  min-width: max-content;
  margin-left: auto;
}
.persons-contracts-table .persons-contracts-actions-cell .ant-btn {
  flex: 0 0 auto;
  white-space: nowrap !important;
}
/* Personen: Vertragspakete – Expand-Untertabelle soll ohne "Rahmen" und spaltengleich aussehen */
.persons-contracts-table .ant-table-expanded-row > td {
  padding: 0 !important;
  background: transparent !important;
}
.persons-contracts-table .ant-table-tbody > tr.ant-table-row-level-1 > td {
  background: rgba(22, 119, 255, 0.04);
  border-top: 1px solid rgba(22, 119, 255, 0.08);
}
:root[data-theme="dark"] .persons-contracts-table .ant-table-tbody > tr.ant-table-row-level-1 > td {
  background: rgba(64, 150, 255, 0.12);
  border-top-color: rgba(64, 150, 255, 0.18);
}
.settings-list-table-wrap .persons-contracts-child-row > td {
  background: rgba(22, 119, 255, 0.04);
  border-top: 1px solid rgba(22, 119, 255, 0.08);
}
:root[data-theme="dark"] .settings-list-table-wrap .persons-contracts-child-row > td {
  background: rgba(64, 150, 255, 0.12);
  border-top-color: rgba(64, 150, 255, 0.18);
}
.persons-contracts-card-children {
  display: grid;
  gap: var(--m1-space-8);
  margin-top: var(--m1-space-8);
  padding-left: var(--m1-space-12);
  border-left: 3px solid rgba(22, 119, 255, 0.22);
}
.persons-contracts-card-child {
  background: rgba(22, 119, 255, 0.04);
}
:root[data-theme="dark"] .persons-contracts-card-children {
  border-left-color: rgba(64, 150, 255, 0.34);
}
:root[data-theme="dark"] .persons-contracts-card-child {
  background: rgba(64, 150, 255, 0.12);
}
.persons-contracts-table .ant-table-expanded-row-fixed {
  margin: 0 !important;
  padding: 0 !important;
}
.persons-contracts-table .ant-table-expanded-row > td .ant-table-wrapper {
  margin: 0 !important;
}
.persons-contracts-subtable .ant-table,
.persons-contracts-subtable .ant-table-container,
.persons-contracts-subtable .ant-table-content {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
}
.persons-contracts-subtable .ant-table-tbody > tr > td {
  border-bottom: none !important;
}
.persons-contracts-subtable .ant-table-tbody > tr:hover > td {
  background: transparent !important;
}

/*
 * Vertikale Aktions-Spalte (SettingsListPage actionsCellLayout="vertical" oder gleiche Klasse manuell):
 * schmal (width 1%), jede Aktion einzeilig. Kein nowrap auf der td (Link-Buttons sonst Icon über Text).
 * Stack-Klasse: settings-list-actions-stack (renderSettingsListStyleActionCell, layout vertical).
 */
.settings-list-table-wrap .ant-table-thead > tr > th.settings-list-actions-vertical-cell,
.settings-list-table-wrap .ant-table-tbody > tr > td.settings-list-actions-vertical-cell {
  max-width: none !important;
  vertical-align: top;
}
/* Datenzelle: Platz für volle Button-Zeilen; Ellipsis/Overflow von Table/ProTable überschreiben. */
.settings-list-table-wrap .ant-table-tbody > tr > td.settings-list-actions-vertical-cell {
  overflow: visible !important;
  max-width: none !important;
  word-break: normal !important;
}
.settings-list-table-wrap .ant-table-tbody > tr > td.settings-list-actions-vertical-cell.ant-table-cell-ellipsis {
  overflow: visible !important;
}
.settings-list-table-wrap .ant-table-thead > tr > th.settings-list-actions-vertical-cell {
  white-space: nowrap;
}
.settings-list-table-wrap .ant-table-tbody > tr > td.settings-list-actions-vertical-cell .settings-list-actions-stack {
  display: inline-flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 0;
  width: max-content;
  min-width: max-content;
}
/* Pro Zeile: kein Umbruch (Icon+Text bleiben eine Zeile), unabhängig vom internen Button-Flex. */
.settings-list-table-wrap .ant-table-tbody > tr > td.settings-list-actions-vertical-cell .settings-list-actions-stack-row {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: flex-end;
  width: max-content;
  min-width: max-content;
  max-width: none;
  flex-shrink: 0;
}
.settings-list-table-wrap .ant-table-tbody > tr > td.settings-list-actions-vertical-cell .settings-list-actions-stack-row .ant-btn {
  flex: 0 0 auto;
  white-space: nowrap !important;
  flex-wrap: nowrap !important;
}
.settings-list-table-wrap .ant-table-tbody > tr > td.settings-list-actions-vertical-cell .settings-list-actions-stack-row .ant-btn .anticon + span {
  white-space: nowrap !important;
}

/* Finanzen: Lastschriften – ausgenommene Positionen (Listen- und Detailseite) */
.sepa-direct-debit-runs-table .sepa-direct-debit-item-excluded > td,
.sepa-direct-debit-run-detail .sepa-direct-debit-item-excluded > td {
  color: var(--ant-color-text-secondary) !important;
  background: var(--ant-color-fill-alter) !important;
}
.sepa-direct-debit-runs-table .sepa-direct-debit-item-excluded:hover > td,
.sepa-direct-debit-run-detail .sepa-direct-debit-item-excluded:hover > td {
  background: var(--ant-color-fill-alter) !important;
}
.sepa-direct-debit-run-detail .ant-tag {
  white-space: normal;
  line-height: var(--m1-line-height-1-2);
}

/* Rollen-Bearbeitung: Rechte-Checkliste immer klickbar (Drawer/Form-Overlays blockieren nicht) */
.user-roles-permission-checklist {
  pointer-events: auto;
}
.user-roles-permission-checklist .ant-collapse,
.user-roles-permission-checklist .ant-collapse-item,
.user-roles-permission-checklist .ant-collapse-content,
.user-roles-permission-checklist .ant-collapse-content-box {
  pointer-events: auto;
}

/* Digitale Akte: Kein Scrollbalken (horizontal + vertikal), kein Leuchteffekt bei Überlappung */
.files-doc-table-wrap {
  overflow: hidden;
}
.files-doc-table-wrap .ant-table-wrapper,
.files-doc-table-wrap .ant-table-content {
  overflow: hidden !important;
}
.files-doc-table-wrap .ant-table-cell,
.files-doc-table-wrap .ant-table-thead > tr > th {
  outline: none;
  box-shadow: none;
}
.files-doc-table-wrap .ant-table-cell-fix-left::after,
.files-doc-table-wrap .ant-table-cell-fix-right::after,
.files-doc-table-wrap .ant-table-cell-fix-left::before,
.files-doc-table-wrap .ant-table-cell-fix-right::before {
  box-shadow: none !important;
}

/* Kontoauszug: Zeilen mit potentiellem Beitrag (für uns) optisch hervorheben */
.ant-table .bank-statement-row-contribution > td {
  background-color: rgba(82, 196, 26, 0.08);
}
:root[data-theme="dark"] .ant-table .bank-statement-row-contribution > td {
  background-color: rgba(82, 196, 26, 0.15);
}


/* Import: Speichern mit animiertem Rahmen bei ungesicherten Änderungen */
.import-run-save-button-dirty {
  border-color: transparent !important;
  background-image:
    linear-gradient(var(--ant-colorPrimary), var(--ant-colorPrimary)),
    linear-gradient(90deg, var(--ant-colorPrimary), #36cfc9, #fadb14, var(--ant-colorPrimary));
  background-origin: border-box;
  background-clip: padding-box, border-box;
  background-size: 100% 100%, 200% 100%;
  animation: import-run-save-border-flow 2.1s linear infinite;
}

@keyframes import-run-save-border-flow {
  0% {
    background-position: 0 0, 200% 0;
  }
  100% {
    background-position: 0 0, 0 0;
  }
}

.import-run-wizard-shell {
  overflow: hidden;
}

.import-run-wizard-header-title {
  min-width: 0 !important;
}

.import-run-wizard-header-title .ant-typography {
  min-width: 0;
  overflow-wrap: anywhere;
}

.import-run-wizard-header-actions,
.import-run-wizard-footer-actions {
  flex-wrap: wrap;
  justify-content: flex-end;
  max-width: 100%;
}

.import-run-wizard-steps {
  margin-bottom: var(--m1-space-24);
  max-width: 100%;
  overflow-x: auto;
  padding-bottom: var(--m1-space-2);
}

.import-run-wizard-steps .ant-steps {
  min-width: 680px;
}

.import-run-wizard-steps .ant-steps-vertical {
  min-width: 0;
  width: 100%;
}

.import-run-wizard-content {
  min-width: 0;
}

.import-merge-run-page {
  min-width: 0;
}

.import-merge-run-page .ant-card,
.import-merge-run-page .ant-table-wrapper {
  max-width: 100%;
}

.import-merge-run-steps {
  max-width: 100%;
  overflow-x: auto;
  padding-bottom: var(--m1-space-2);
}

.import-merge-run-steps.ant-steps {
  min-width: 680px;
}

.import-merge-run-steps.ant-steps-vertical {
  min-width: 0;
  width: 100%;
}

@media (max-width: 575px) {
  .import-run-wizard-shell > .ant-card-body {
    padding: var(--m1-space-16);
  }

  .import-run-wizard-header {
    align-items: stretch !important;
    flex-direction: column;
  }

  .import-run-wizard-header-title {
    flex: 0 1 auto !important;
    width: 100%;
  }

  .import-run-wizard-header-actions {
    width: 100%;
  }

  .import-run-wizard-header-actions .ant-space-item {
    flex: 0 0 auto;
  }

  .import-run-wizard-steps .ant-steps:not(.ant-steps-vertical),
  .import-merge-run-steps.ant-steps:not(.ant-steps-vertical) {
    min-width: 560px;
  }

  .import-run-wizard-footer {
    justify-content: flex-end !important;
  }

  .import-run-wizard-footer-actions {
    width: 100%;
  }

  .import-merge-run-page > .ant-space-item {
    min-width: 0;
    width: 100%;
  }
}

/* CenterCom-Adapter-Import: einheitliche Workflow-Leiste und ruhigere Kartenabstände */
.centercom-import-run-page {
  width: 100%;
}

.centercom-import-section-card,
.centercom-workflow-strip {
  border-radius: var(--m1-radius-8);
}

.centercom-import-wizard {
  margin-inline: var(--m1-space-12);
  overflow-x: auto;
  padding: var(--m1-space-4) 0;
}

.centercom-import-wizard .ant-steps {
  min-width: 680px;
}

.centercom-workflow-strip {
  border-left-width: 4px;
}

.centercom-workflow-strip .ant-alert-message {
  width: 100%;
}

.centercom-workflow-strip-running .ant-alert-icon {
  align-self: flex-start;
  margin-top: var(--m1-space-2);
}

.centercom-import-section-card > .ant-card-head {
  min-height: 48px;
}

.centercom-import-section-card > .ant-card-head .ant-card-extra {
  padding: var(--m1-space-10) 0;
}

@media (max-width: 700px) {
  .centercom-import-wizard .ant-steps {
    min-width: 560px;
  }
}

.mu-calendar-completion-panel {
  max-width: 100%;
  overflow: hidden;
  background: transparent;
}

.mu-calendar-completion-person {
  display: flex;
  flex-direction: column;
  gap: var(--m1-space-12);
  min-width: 0;
}

.mu-calendar-completion-person-header {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  gap: var(--m1-space-12);
  min-width: 0;
}

.mu-calendar-completion-person-name {
  flex: 1 1 180px;
  min-width: 0;
  overflow-wrap: anywhere;
}

.mu-calendar-status-selector,
.mu-outcome-tile-grid {
  display: flex;
  flex-wrap: wrap;
  gap: var(--m1-space-8);
  max-width: 100%;
  min-width: 0;
}

.mu-calendar-status-option,
.mu-outcome-tile-card {
  min-width: 0;
  max-width: 100%;
  height: auto;
  min-height: 32px;
  white-space: normal;
  overflow-wrap: anywhere;
  text-align: left;
  line-height: var(--m1-line-height-1-2);
}

.mu-outcome-tile-card {
  flex: 1 1 150px;
  justify-content: flex-start;
  border-width: 1px;
  padding-block: var(--m1-space-8);
  font-weight: 600;
}

/* Tooltip-Wrapper deaktivierter Kacheln: übernimmt das Flex-Verhalten der Kachel im Grid. */
.mu-outcome-tile-tooltip-target {
  display: inline-flex;
  flex: 1 1 150px;
  min-width: 0;
  max-width: 100%;
}

.mu-outcome-tile-tooltip-target > .mu-outcome-tile-card {
  width: 100%;
}

.mu-outcome-tile-icon {
  display: inline-flex;
  align-items: center;
  flex: 0 0 auto;
  font-size: var(--m1-font-size-16);
  line-height: var(--m1-line-height-1);
}

.mu-outcome-tile-card-success.ant-btn-default {
  border-color: color-mix(in srgb, var(--ant-color-success) 42%, var(--ant-color-border));
  color: var(--ant-color-success);
}

.mu-outcome-tile-card-success.ant-btn-primary {
  background: var(--ant-color-success);
  border-color: var(--ant-color-success);
}

.mu-outcome-tile-card-warning.ant-btn-default {
  border-color: color-mix(in srgb, var(--ant-color-warning) 52%, var(--ant-color-border));
  color: var(--ant-color-warning);
}

.mu-outcome-tile-card-warning.ant-btn-primary {
  background: var(--ant-color-warning);
  border-color: var(--ant-color-warning);
  color: var(--ant-color-text-light-solid);
}

.mu-outcome-tile-card-danger.ant-btn-default {
  border-color: color-mix(in srgb, var(--ant-color-error) 42%, var(--ant-color-border));
  color: var(--ant-color-error);
}

.mu-outcome-tile-card-danger.ant-btn-primary {
  background: var(--ant-color-error);
  border-color: var(--ant-color-error);
}

/* Lead-Liste: abgeschlossene Kontakte optisch zurücknehmen */
.mu-lead-row-closed > td {
  opacity: 0.65;
}

/* ResponsiveFormGrid steuert den Zeilenabstand selbst. Der Ant-Standardabstand
   der direkten Form.Items würde sich sonst zusätzlich zum Grid-Gap addieren. */
.mu-responsive-form-grid > .ant-form-item,
.mu-person-form-fields > .ant-form-item {
  margin-bottom: 0;
}

/* Lead-Detail: Aktionsbuttons — farbiges Icon, ruhiger Rahmen; aktiv = zarte Tönung statt Vollfüllung */
.mu-lead-action {
  justify-content: flex-start;
  text-align: left;
  font-weight: 500;
}

.mu-lead-action .anticon {
  font-size: var(--m1-font-size-16);
}

.mu-lead-action-accent .anticon {
  color: var(--ant-color-info);
}

.mu-lead-action-success .anticon {
  color: var(--ant-color-success);
}

.mu-lead-action-neutral .anticon {
  color: var(--ant-color-text-tertiary);
}

.mu-lead-action-warning .anticon {
  color: var(--ant-color-warning);
}

.mu-lead-action-active.ant-btn-default {
  border-color: var(--ant-color-primary);
  background: color-mix(in srgb, var(--ant-color-primary) 8%, transparent);
  color: var(--ant-color-primary);
}

.mu-lead-action-active.mu-lead-action-success.ant-btn-default {
  border-color: var(--ant-color-success);
  background: color-mix(in srgb, var(--ant-color-success) 10%, transparent);
  color: var(--ant-color-success);
}

.mu-lead-action-active.mu-lead-action-neutral.ant-btn-default {
  border-color: var(--ant-color-text-secondary);
  background: color-mix(in srgb, var(--ant-color-text-secondary) 8%, transparent);
  color: var(--ant-color-text);
}

/* Systemdokumente: Das Dokument ist die Arbeitsfläche. Bearbeitbare Stellen sind dezent
   hervorgehoben — ohne Markierung rät der Nutzer, wo er hineinklicken kann, und hält die
   unveränderlichen Stellen für kaputt. Farben aus Theme-Tokens, damit der Dark Mode trägt. */
.mu-system-document {
  line-height: var(--m1-line-height-relaxed, 1.6);
}

.mu-system-document p {
  margin: 0 0 var(--m1-space-12) 0;
}

.mu-system-document [data-mq-field] {
  border-radius: var(--m1-space-4);
  padding: var(--m1-space-2) var(--m1-space-6);
  margin: 0 calc(-1 * var(--m1-space-6)) var(--m1-space-6) calc(-1 * var(--m1-space-6));
  outline: 1px dashed color-mix(in srgb, var(--ant-color-primary) 35%, transparent);
  background: color-mix(in srgb, var(--ant-color-primary) 4%, transparent);
  transition: background 0.15s ease, outline-color 0.15s ease;
}

.mu-system-document [data-mq-field]:hover {
  background: color-mix(in srgb, var(--ant-color-primary) 8%, transparent);
}

.mu-system-document [data-mq-field]:focus,
.mu-system-document [data-mq-field]:focus-visible {
  outline: 2px solid var(--ant-color-primary);
  background: transparent;
}

/* Der Datenteil entsteht aus dem Vorgang und ist deshalb nicht beschreibbar. */
.mu-system-document .mq-fields {
  width: 100%;
  border-collapse: collapse;
  margin: var(--m1-space-20) 0;
}

.mu-system-document .mq-fields td {
  padding: var(--m1-space-4) 0;
  vertical-align: top;
}

.mu-system-document .mq-fields td.mq-label {
  width: 38%;
  color: var(--ant-color-text-secondary);
}

.mu-system-document .mq-address {
  margin: 0 0 var(--m1-space-24) 0;
}

.mu-system-document .mq-subject {
  font-weight: 600;
  margin: 0 0 var(--m1-space-16) 0;
}
/* Kartenbild der m1-Produkte für geteilte Bausteine.
 *
 * Gegenstück zu `mq-card-system.css`: Dieselben Klassen, andere Ausprägung. Ein geteilter
 * `SectionCard`/`StatCard` sieht damit in m1member wie eine m1member-Karte aus, ohne dass die
 * Komponente eine Produktvariante kennen müsste.
 *
 * Bewusster Unterschied zum mQ-System: Hier greifen ausschließlich die Komponenten-Klassen, nicht
 * `.app-content .ant-card`. m1member hat eigene Karten mit eigenen Innenabständen (Listen 12 px,
 * Inhaltskarten 16 px) — eine Regel über alle Karten würde die bestehende Oberfläche umschreiben,
 * statt nur die geteilten Bausteine einzupassen.
 *
 * Die Maße stehen als eigene Variablen, damit sie an einer Stelle liegen und dieselbe Skala
 * spiegeln wie `m1member/frontend/ui/src/app/design-system.ts` (`spacing.cardPadding` = 16,
 * `spacing.md` = 12, `spacing.sm` = 8). Die Kopfzeile bleibt ohne Trennlinie — so wie es
 * `global.css` für alle m1member-Karten festlegt.
 */

:root {
  --m1-card-padding: 16px;
  --m1-card-head-min-height: 44px;
  --m1-card-title-padding-block: 12px;
  --m1-card-title-size: 16px;
  --m1-card-extra-padding-block: 8px;
}

.ant-card.mq-section-card,
.ant-card.mq-stat-card {
  overflow: hidden;
  background: var(--ant-color-bg-container);
  border: 1px solid var(--ant-color-border-secondary);
  border-radius: var(--ant-border-radius-lg, 8px);
  box-shadow: none;
}

.ant-card.mq-section-card > .ant-card-head,
.ant-card.mq-stat-card > .ant-card-head {
  min-height: var(--m1-card-head-min-height);
  padding-inline: var(--m1-card-padding);
  border-bottom: none;
}

.ant-card.mq-section-card > .ant-card-head .ant-card-head-title,
.ant-card.mq-stat-card > .ant-card-head .ant-card-head-title {
  min-width: 0;
  padding-block: var(--m1-card-title-padding-block);
  color: var(--ant-color-text);
  font-size: var(--m1-card-title-size);
  font-weight: 600;
}

.ant-card.mq-section-card > .ant-card-head .ant-card-extra,
.ant-card.mq-stat-card > .ant-card-head .ant-card-extra {
  min-width: 0;
  padding-block: var(--m1-card-extra-padding-block);
}

.ant-card.mq-section-card > .ant-card-body,
.ant-card.mq-stat-card > .ant-card-body {
  padding: var(--m1-card-padding);
}

/* Karten, deren Körper nur eine randlose Tabelle trägt. */
.ant-card.mq-section-card.mq-card-flush > .ant-card-body {
  padding: 0;
}
