/* M8 Backend ID Badges */
.m8-id-badge {
  display: inline-block;
  /* Wir setzen das Badge vor die Operationen (Stift) -> Abstand nach rechts */
  margin: 0 .45rem 0 0;
  padding: .08rem .35rem;
  border-radius: 999px;
  font-size: .75rem;
  line-height: 1.3;
  background: rgba(0, 0, 0, 0.08);
  color: #444;
  vertical-align: middle;
  white-space: nowrap;
}

/* Falls das Badge in Sonderfällen doch in der linken Spalte landet */
.tl_content_left .m8-id-badge,
.tl_left .m8-id-badge {
  margin: 0 0 0 .45rem;
}

/* In der rechten Spalte (Operationen) immer ohne linken Abstand */
.tl_right .m8-id-badge,
.tl_content_right .m8-id-badge {
  margin-left: 0;
}


/* Wenn Operationen als <li><a>…</a></li> gerendert werden und der Link block ist,
   sorgt das dafuer, dass Badge und Icon in einer Zeile bleiben. */
.m8-id-badge-wrap {
  white-space: nowrap;
}

.m8-id-badge-wrap > a {
  display: inline-block !important;
  vertical-align: middle;
}

/* Auch ohne <li>-Container: direktes Geschwister nach dem Badge immer inline */
.tl_right .m8-id-badge + a,
.tl_content_right .m8-id-badge + a {
  display: inline-block !important;
  vertical-align: middle;
}
/* ------------------------------------------------------------
   M8 Optimizer – BE: fixes & kleine QoL-Regeln
   ------------------------------------------------------------ */

/* Uppercase-Klasse im Backend deaktivieren */
body .upper{
  text-transform: none !important;
}

/* Fix: Dropdown-Listen dürfen über der sticky Submit-Bar liegen,
   aber NICHT über echten Dialogen/Popups (z.B. TinyMCE-Link-Popup, Dateiauswahl). */
body .choices,
body .ts-wrapper,
body .select2-container,
body .chosen-container{
  position: relative;
  z-index: auto !important;
}

body .choices__list--dropdown,
body .choices__list[aria-expanded],
body .ts-dropdown,
body .select2-dropdown,
body .select2-container--open,
body .chosen-container .chosen-drop,
body .select-wrapper .select-dropdown,
body .select .select-dropdown,
body .select-dropdown,
body .select-menu,
body .select-menu__list{
  z-index: 250 !important;
}

/* Echte Overlays/Dialoge/Pickers immer darüber halten */
body .tox-tinymce-aux,
body .tox-silver-sink,
body .tox-menu,
body .tox-collection,
body .tox-autocompleter,
body .tox-dialog-wrap,
body .tox-dialog,
body .modal,
body .modal__container,
body .modal-backdrop,
body .jconfirm,
body .jconfirm-bg,
body .jconfirm-box-container,
body .ui-dialog,
body .ui-widget-overlay,
body .simple-modal,
body .simple-modal-overlay,
body .tl_listing_container .selector_container .modal,
body .tl_filepicker,
body .picker,
body .picker__holder{
  z-index: 200000 !important;
}



/* Contao 5.6: simple-modal muss IMMER ueber seinem Overlay liegen.
   Die generische Regel oben gibt beiden denselben z-index; dadurch kann
   das Overlay je nach DOM-Reihenfolge ueber dem Modal landen. */
body #simple-modal-overlay,
body .simple-modal-overlay{
  z-index: 200000 !important;
}

body #simple-modal,
body .simple-modal{
  z-index: 200001 !important;
}