/* ------------------------------------------------------------------------------------------------- */
/* -------------------------------                   ----------------------------- */
/* -------------------------------    Basis Listen und Dialoge   ----------------------------- */
/* -------------------------------                   ----------------------------- */
/* ------------------------------------------------------------------------------------------------- */
/* ------------------------------------------------------------------------------------------------- */
/* -------------------------------   TEMPLATE            ----------------------------- */

body {
  background-color: var(--color-main-background);
}

.lodd {
  background-color: var(--color-tr-lodd, transparent);
}

fp-frame#tmplContent {
  flex:1;
   /* keinen z-index hier: aus diesem context kann dann keiner mehr ausbrechen z-index: 99;*/
  min-height: 1px; /* <- min-height, da sonst zu groß - JA ZU GROSS!*/
}

div.tmplContentTable {
  /* Zeile mit 2 Elementen (Leftarea und Hauptcontent).
     Die Zeile nimmt sich soviel Höhe wie der Container zulässt,
     die beiden Elemente strechen sich auf diese Höhe
  */
  display: flex;
  flex-direction: row;
  height: 100%;
  align-items: stretch;
}

div.boxarea div.box.entityActionBar {
  margin-bottom: 0;
  --color-button-raised-back: var(--color-toolbar-button-hover);
  --color-button-raised-font: currentColor;
}

  /* Hauptueberschrift und labels*/

.jmlListBody {
  overflow: auto;
  /* padding gegen unnötige scrollbalken!*/
  padding-top: 2px;
  padding-bottom: 8px;
}

.dialog td.label {
  color: var(--color-card-font);
}

fp-tab-container.subview {
  border: 1px solid var(--color-default-border);
}

fp-tab-container.subview fp-tab-page {
  border-top: 1px solid var(--color-default-border);
}

.tmplContentTable>.boxarea { scrollbar-width: thin; }
.tmplContentTable>.boxarea::-webkit-scrollbar { width: 8px; }
.tmplContentTable>.boxarea::-webkit-scrollbar-track {background-color: var(--color-scrollbar-track);}
.tmplContentTable>.boxarea::-webkit-scrollbar-track-piece {}
.tmplContentTable>.boxarea::-webkit-scrollbar-thumb {background-color: var(--color-scrollbar-handle); width: 12px; border: 2px solid var(--color-scrollbar-track); border-radius: 8px;}       /* 5 */


.tmplContentTable>.boxarea {
  /* etwas extraplatz für den scrollbalken*/
  min-width: calc(var(--width-leftarea) + 10px);
  margin-right: -10px;
  flex-grow: 0;
  flex-shrink: 0;
  padding: var(--width-componentspacing, 12px);
  padding-right: 0;
  padding-bottom: 64px;
  overflow-x: hidden;
  overflow-y: auto;
}

.tmplContentTable>.boxarea .box {
  width: var(--width-leftarea, 200px);
}
.tmplContentTable>.boxarea:last-child {
  /* der darf etwas wachsen wenn nötig (mein Tag)*/
  flex-grow: 2;
  /*padding: var(--width-componentspacing, 12px);*/
  padding-left: 0;
  padding-right: var(--width-componentspacing, 12px);
  margin-right: 0;
  flex-basis: 100px; /* klein ist besser als weißraum */
}

div.tmplWorkarea,
div.tmplWorkareaTestAccWiz {
  /* der darf echt richtig wachsen (ist ja der Haupt-Content)*/
  flex-grow: 3;
  overflow: hidden; /* wir scrollen immer noch nicht*/
  display: flex;
  flex-direction: column;
}

/* Minimum aspect ratio */
@media (min-aspect-ratio: 16/9) {
  div.tmplWorkarea {
    /*flex-wrap: wrap;*/
  }
}

/* Scrollverhalten auf desktop und tablets:
   Die view selbst scrollt nicht, sondern der Content
   (das Form in der Mitte etwa kümmert sich darum)
   So bleibt die Toolbar stehen und das Zeug um das Form herum auch (Buttons etc)
*/


/* VIEW-CONTAINER: kein scrollen. Aber height als Referenzwert für Kindelemente*/

div.tmplWorkarea .viewFrame {
  width: auto;
  flex-basis: auto;
  flex-shrink: 2;
  flex-grow: 0; /* über den inhalt hinaus möchten wir erstmal nicht wachsen*/
  max-height: calc(100% - 2 * var(--width-componentspacing, 12px) - 2px);
  --header-font: var(--font-normal);
  --header-background: var(--color-primary);
  --header-color: var(--color-primary-contrast);
  --header-height: var(--height-toolbar);
  background: var(--color-card-background);
  overflow: auto;
  margin: var(--width-componentspacing, 12px);
  margin-left: 12px; /* fest, wegen scrollbarer leftarea*/
  margin-bottom: 0;
}

/* Wenn das mit der maximal benötigten höhe passt, können wir als Flexbasis auch "soviel wie geht" nehmen*/
@supports (max-height: min(1px,2px)) {
  div.tmplWorkarea .viewFrame:not([fullscreen]) {
    /* je nachdem was zuerst eintritt (min)
    a) benötigte höhe
    b) Zur Verfügung stehende Höhe minus abstand minus 2px extra
    */
    max-height: min(var(--content-height, 9999px), calc(100% - 2 * var(--width-componentspacing, 12px) - 2px));
    flex-basis: 100%;
  }
  /* Listen bekommen etwas extra-Raum für etwaige Scrollbars (horizontale Scrollbars gibts hier häufiger) */
  div.tmplWorkarea .viewFrame.list-frame:last-of-type:first-of-type {
    max-height: min(calc(var(--content-height, 9999px) + 20px), calc(100% - 2 * var(--width-componentspacing, 12px) - 2px));
    flex-basis: 100%;
  }
}

div.tmplWorkarea .viewFrame:last-of-type{
  margin-bottom: var(--width-componentspacing, 12px);
}

div.tmplWorkarea .viewFrame:not([minimized]) {
  min-height: 140px;
}

.viewFrame > button[slot=header-buttons-right] {
  border: none;
  box-shadow: none;
}

/* Wenn nur eine einzige Komponente vorhanden ist, macht es keinen Sinn diese zu minimieren*/
div.tmplWorkarea .viewFrame:first-of-type:last-of-type .button-minimize {
  display: none;
}

div.tmplWorkarea fp-tab-container.boxsegment {
  flex-basis: auto;
  flex-shrink: 2;
  flex-grow: 0; /* über den inhalt hinaus möchten wir erstmal nicht wachsen*/
  margin: var(--width-componentspacing, 12px);
  margin-bottom: 0;
  background: var(--color-card-background);
  box-shadow: var(--shadow-cards);
}

div.tmplWorkarea .right-col .viewFrame{
  margin-left: 0;
}

/** quickCreate sind bereits optimiert, sie dürfen nicht weiter shrinken*/
div.tmplWorkarea fp-view-wrapper.quickCreate {
  flex-shrink: 0;
}

/** Infodialoge könnten auch mal länger sein, sie shrinken mit 1 und sind limitiert*/
div.tmplWorkarea fp-view-wrapper.info-dialog {
  flex-shrink: 1;
  max-height: 300px;
}

.infodialog-content {
  padding: var(--width-componentspacing);
  min-height: 100%;
}

div.tmplWorkarea .viewFrame.list-frame {
  flex-shrink: 1; /* die hauptkomponente soll langsamer shrinken als der rest*/
}

div.tmplWorkarea .viewFrame.message-preview {
  min-height: 50%;
  flex-basis: 50%;
  flex-grow: 1;
}

.boxsegment.ticket-summary fp-tab-page {
  max-height: 20vh;
}

div.ticket-sideview {
  display: flex;
  flex-direction: row;
  height: 100%;
  width: 100%;
}

div.ticket-sideview > div{
  display: flex;
  flex-direction: column;
}

div.ticket-sideview .left-col{
  flex-basis: 35%;
}
div.ticket-sideview .right-col{
  flex-basis: 65%;
  flex-shrink: 1;
}

div.tmplWorkarea .viewFrame[fullscreen] {
  position: fixed;
  top:0;left:0;right:0;bottom:0;margin:0;
  z-index: 999;
}

div.tmplWorkarea .viewFrame[minimized] {
  height: 32px;
  min-height: 32px;
  flex-grow: 0;
  flex-basis: 32px;
  overflow:hidden;
}

div.tmplWorkarea .viewFrame > button {
  --color-button-font: currentColor;
  --color-button-back: transparent;
  --color-button-raised-back: transparent;
  --color-button-raised-font: currentColor;
}

/* VIEW: */
div.tmplWorkarea .viewFrame > pf-dialog-view,
div.tmplWorkarea .viewFrame > pf-list-view {
  height: 100%;
  display: contents; /*  flexen können wir leider nicht, dann geht das scrollen nicht mehr richtig*/
}

  /* INHALT der View in der Höhe beschränken*/
div.tmplWorkarea .viewFrame > pf-dialog-view .jml_formDialog,
div.tmplWorkarea .viewFrame > pf-list-view .jml_formList,
div.tmplWorkarea .viewFrame > pf-list-view .jml_formCalendar,
div.tmplWorkarea .viewFrame > pf-list-view .jml_formTiles {
  height: auto;
  /*min-height: 100%; <- dann können wir immer scrollen :(  und flexen können wir leider auch nicht, dann geht das scrollen nicht mehr richtig */
  display: flex;
  flex-direction: column;
  /* alle Elemente in diesem Stapel sollten gleich breit sein -> strech*/
  align-items: stretch;
}

div.tmplWorkarea .viewFrame > pf-list-view .jml_formCalendar{
  min-height: unset;
}

div.tmplWorkarea .viewFrame > pf-dialog-view .groups,
div.tmplWorkarea .viewFrame > pf-list-view .bmlf_calendar_month,
div.tmplWorkarea .viewFrame > pf-list-view .bmlf_calendar_team,
div.tmplWorkarea .viewFrame > pf-list-view .bmlf_calendar_team_rotated,
div.tmplWorkarea .viewFrame > pf-list-view .jmlListBody {
  overflow: initial; /*viewFrame soll scrollen - nicht wir!*/
  /*flex-shrink: 1;*/
  /*flex-grow: 3; !* mehr gewicht auf den Hauptcontent*!*/
  /*min-height:10px;*/
  /*max-height: 100%;*/
  /*max-width: 100%;*/
  padding-top: 8px;
  padding-bottom: 8px;
  flex-grow: 1; /* damit die Buttons nicht "in der mitte des Dialogs" schweben*/
  /*border-top: 1px solid rgba(0,0,0,0.25);*/
  /*border-bottom: 1px solid rgba(0,0,0,0.25);*/
/*  box-shadow: 0  6px 4px -5px inset rgba(0,0,0,0.25)
            , 0 -5px 4px -5px inset rgba(0,0,0,0.25);*/
}

.dmContent  > div.tmplWorkarea {
  /*padding-left: 0;*/
  /*margin-left: var(--width-componentspacing, 12px);*/
}

/* Sticky toolbars ab 600 px*/
@media (min-height: 600px) {

  /* Sonderregel, falls nur ein eintiges View-Frame in der Workarea steckt
    (die komplizierte Regel verhindert, dass auch forms in einem Modal erwischt werden)
   */
  fp-frame#tmplContent div.tmplWorkarea .viewFrame:first-of-type:last-of-type > pf-list-view form.jml_formList,
  fp-frame#tmplContent div.tmplWorkarea .viewFrame:first-of-type:last-of-type > pf-dialog-view form.jml_formDialog {
    min-height: 50vh; /* wir machen uns mal etwa halb so groß, wie platz da ist. */
  }



  div.tmplDialogControlButtons,
  div.tmplControlBarNotEmpty {
    position: sticky; /* sticky geht nicht mit x/y gleichzeitig */
    top: 0;
    left: 0;
    z-index: 10; /* Bild-Overlays gehen bis zu 3*/
    backdrop-filter: blur(4px);
  }

  .page-actions,
  .jml_formDialog .buttonarea,
  fp-dialog .filterbutton,
  table.navigator {
    position: sticky;
    bottom: 0;
    left: 0;
    z-index: 1;
    background: var(--color-quickfilter-back);
    color: var(--color-quickfilter-font);
    backdrop-filter: blur(4px);
  }
}

/* Scrollverhalten auf screens mit kleinerer Breite:
  Leftarea kann nach links herausgeschoben werden (inklusive snapping)
*/
@media screen and (max-width: 760px) {
  div.tmplCenter.leftarea-open {
    scroll-snap-type: x mandatory;
    overflow-x: scroll;
  }

  div.tmplCenter > div.boxarea  {
    scroll-snap-align: start;
  }

  div.tmplWorkarea {
    min-width: calc(100vw - 2 * var(--width-componentspacing) - var(--width-sidebar));
    scroll-snap-align: start;
  }
}

/* Scrollverhalten auf screens mit kleinerer Höhe
   Die view selbst scrollt!!!
   (das Form in der Mitte darf so groß werden wie es möchte)
   So scrollt alles: die Toolbar und das Zeug um das Form herum auch (Buttons etc)
*/
@media screen and (max-height: 899px), screen and (max-width: 499px), print {
  /* Mobile
  tmplCenter scrollt horz, wg leftarea
  WORKAREA: darf scrollen - View-Frames dagegen nicht*/

  div.tmplWorkarea {
    overflow: auto; /* ab dieser größe scrollt die Workarea*/
    display: block;
  }

  div.tmplWorkarea .portal-menu {
    overflow: initial;
    height: auto;
  }

  div.tmplWorkarea .viewFrame {
    overflow: initial;
    max-height: none;
  }

  div.tmplWorkarea .viewFrame:first-of-type:last-of-type {
    overflow: auto;
    max-height: calc(100% - 2 * var(--width-componentspacing, 12px) - 2px);
  }

  /* View sollte sich am Inhalt Orientieren (der Container scrollt ja nun)*/
  div.tmplWorkarea .viewFrame > pf-dialog-view,
  div.tmplWorkarea .viewFrame > pf-list-view{
    min-width: fit-content;
    height: auto;
  }

  /* INHALT der View nicht in der Höhe beschränken*/
  div.tmplWorkarea .viewFrame > pf-dialog-view .jml_formDialog,
  div.tmplWorkarea .viewFrame > pf-list-view .jml_formList,
  div.tmplWorkarea .viewFrame > pf-list-view .jml_formTiles {
    height: auto;
    overflow: initial;
  }

    /* Bereich im Inhalt muss NICHT mehr scrollen
    und darf sich ungehindert ausbreiten */
  div.tmplWorkarea .viewFrame > pf-dialog-view .groups,
  div.tmplWorkarea .viewFrame > pf-list-view .bmlf_calendar_month,
  div.tmplWorkarea .viewFrame > pf-list-view .bmlf_calendar_team,
  div.tmplWorkarea .viewFrame > pf-list-view .bmlf_calendar_team_rotated,
  div.tmplWorkarea .viewFrame > pf-list-view .jmlListBody {
    overflow: initial;
    flex-shrink: 0;
    min-height: unset;
    max-height: unset;
    max-width: unset;
    box-shadow: none;
  }
}

td.l h1 {
  margin-top: 0;
}


/*
    ------------------ Listen und dialoge -------------
*/

.viewFrame {
  border-top-width: 0;
}

.boxsegmentcontent .viewFrame {
  border: 0 none;
}

.nodatafound {
  padding: 20px;
  text-align: center;
}

.jml_formTiles .jmlListBody .nodatafound {
  padding-top: 20px;
  padding-bottom: 0;
  height: 20px;
  margin-bottom: -40px;
  font: var(--font-large);
  opacity: 0.25;
}

  /* Sortierlinks in Spaltenueberschriften */

table.listbody .jmlColumnCaptions,
table.listbody .jmlColumnCaptions a,
table.listbody .jmlColumnCaptions a:active,
table.listbody .jmlColumnCaptions a:visited,
table.listbody .jmlColumnCaptions label {
  color: inherit;
  text-decoration: none;
  font: var(--font-normal);
  font-weight: var(--font-weight-column-captions, bold);
}

table.listbody .jmlColumnCaptions label {
  background-repeat: no-repeat;
  background-position: center right;
  white-space: nowrap;
}

table.listbody .jmlColumnCaptions label.sort {
  cursor: pointer;
}

table.listbody .jmlColumnCaptions label.sortAsc {
  padding-right: 12px;
  background-image: url(ascending.svg);
  font-weight: bold;
}

table.listbody .jmlColumnCaptions label.sortDesc {
  padding-right: 12px;
  background-image: url(descending.svg);
  font-weight: bold;
}


/* Farben für Spaltenüberschriften, Spacer */

div.jmlListheader,
.jmlListheader th,
div.bmdf_dialogHeader,

/*.bmlf_calendar .bmlf_calendarDateHeader,*/


/*.bmlf_calendar .bmlf_upperleft,*/


/*.bmlf_calendar .bmlf_calendarhour,*/

.tundra div.boxarea div.box_dialog div.box_header,
.tundra .dijitDialog .dijitDialogTitleBar,
form.jml_formList .jmlColumnCaptions tr,
form.jml_formList table.listbody td.spacer,
div.jml_formList .jmlColumnCaptions tr,
div.jml_formList table.listbody td.spacer,
.tundra .wiki div.dijitTitlePaneTitle,
#ticketprocesspreshow,
/*.jml_formDialog .jml_dialogChangeInfo,*/
/*.jml_formDialog .buttonarea,*/
/*.jml_formList .buttonarea,*/
.tundra .dijitTabContainerTop-tabs,
.relationBoxAdder,
.floating-action-buttons-container,
.boxsegment .page-actions,
.jml_formList .nodatafound {
  background-color: var(--color-card-background);
}

/* form.jml_formList table.listbody td.rowSelectorCell,
div.jml_formList table.listbody td.rowSelectorCell {
  background-color: var(--color-toolbar-back);
  border-bottom-color: transparent;
  border-right: 1px solid #c5c5c5;
} */

form.jml_formList table.listbody .jmlColumnCaptions tr:last-child th.rowSelectorCell,
div.jml_formList table.listbody .jmlColumnCaptions tr:last-child th.rowSelectorCell {
  border-bottom: var(--color-toolbar-back);
}


/* Abgrenzung des Headers zum Payload */

.tundra .jml_formDialog div.dijitTitlePaneTitle,
.tundra .jml_formList div.dijitTitlePaneTitle,
.relationBoxAdder
/*.boxsegmentcontent .globalActions,*/


/*.jml_formList .buttonarea{*/

{
  border-top: 1px solid var(--color-default-border);
}


/* Trenner und Grouping*/

table.listbody td.trenner.grouped,
table.listbody th.trenner,
table.listbody th.groupheader,
table.listbody tr.bmlf_sumrow {
  color: var(--color-main-header);
}


/** Trenner, die nicht zu einer Gruppe gehoeren */

/** Gruppe, Trenner der Gruppe und Fusszeile*/

table.listbody td.trenner.grouped,
table.listbody th.trenner.grouped,
table.listbody th.groupheader.aktiv {
  background-color: var(--color-table-separator);
}

table.listbody th.groupheader {
  border-bottom: none;
  padding:1px;
  font: var(--font-normal);
  font-weight: var(--font-weight-column-captions, bold);
}

table.listbody tr.bmlf_sumrow {
  background-color: var(--color-table-back);
  font-weight: bold;
}

table.bmlf_calendar .bmlf_onDateClickcatcher:hover {
  background: rgba(255, 183, 0, 0.40);
  cursor: pointer;
  color: #000;
  font-weight: normal;
}

.bmlf_calendar th.today {
  background: var(--color-current-item);
  /* Old browsers */
}

.bmlf_calendar th.bmlf_calendarDayInTeam:hover,
.bmlf_calendar th.bmlf_calendarDayInTeam:hover span {
  background: #FFD690;
  /* Old browsers */
}

.bmlf_calendar td.bmlf_calendarday {
  background-image: url(../css/embed/base_calday.png);
  /*alter Farbcode:  #D9ECFF*/
}

.bmlf_calendar tr.bmlf_calendarDateSubHeader th.today {
  background: rgba(255, 183, 0, 0.40);
  color: #000;
}

.bmlf_calendar tr.bmlf_calendarDayInMonth td.weekend .bmlf_onDateClickcatcher:hover {
  background: #ffdc80;
  /* Old browsers */
  cursor: pointer;
  color: #000;
  font-weight: normal;
}
.pf_formNavigationList .jmlListBody {
  padding: 0;
  overflow: visible;
}
.pf_formNavigationList .jmlTableRows>tr:first-child>td.l,
.pf_formNavigationList .jmlTableRows>tr:last-child>td.l,
div.box .boxsegmentcontent .jmlTableRows>tr:first-child>td.l,
div.box .boxsegmentcontent .jmlTableRows>tr:last-child>td.l,
.boxsegment .jml_formDialog .dijitContentPane.jml_dialogTbodyStandard,
.dijitTooltipContainer .jml_formDialog .dijitContentPane.jml_dialogTbodyStandard,
.boxsegmentcontent .jml_dialogTbodyStandard {
  box-shadow: none;
}

.viewFrame,
div.tmplControlBar,
div.bigpreshow,
div.boxarea div.box {
  box-shadow: var(--shadow-cards);
}

div.boxarea div.box {
  background-color: transparent;
}

div.boxarea div.box div.tmplControlBar,
div.boxarea div.box .viewFrame {
  box-shadow: none;
}

.bmlf_calendarDateHeader .bmlf_calendarSeveralDays {
  border-bottom: 1px solid var(--color-default-border);
}

form.jml_formList td.rowSelectorCell a,
div.jml_formList td.rowSelectorCell a {
  display: inline-block;
  height: 16px;
  width: 16px;
  padding: 8px 0;
}

form.jml_formList td.rowSelectorCell a img.on,
div.jml_formList td.rowSelectorCell a img.on {
  margin-left: 2px;
  /*height:24px;
  width:24px;*/
}

.jml_formTiles .jml-tile.selectmeDisabled .tile-click,
table.listbody tr.selectmeDisabled {
  cursor: not-allowed;
  background: rgba(238, 238, 238, 0.52);
  /* Old browsers */
  background: linear-gradient(to bottom, rgba(240, 240, 240, 0.5) 0%, rgba(220, 220, 220, 0.5) 100%);
  /* W3C */
  color: #666;
  filter: grayscale(90%);
}

.jml_formTiles .jml-tile.selectmeDisabled,
table.listbody tr.selectmeDisabled img {
  filter: grayscale(50%);
  box-shadow: none;
}

.jml_formTiles .jml-tile.selected .tile-click,
.bmlf_calendar div.bmlf_calendarEntry.selected,
.bmlf_calendar div.bmlf_calendarBigEntry.selected,
table.listbody tr.selectme.selected {
  background-color: var(--color-selected-item);
}

.jml_formTiles .jml-tile.selectme:hover .tile-click,
.bmlf_calendar div.bmlf_calendarBigEntry.selectme:hover,
.bmlf_calendar div.bmlf_calendarEntry.selectme:hover,
table.listbody tr.selectme:hover {
  cursor: pointer;
  background-color: var(--color-selected-item-hover);
}

td.l.nopaddingright {
  text-align: right;
}

.jml_formList table.listbody .jmlTableRows td.l.nopadding,
.jml_formList table.listbody .jmlTableRows td.l.nopaddingright {
  padding: 0;
  /* no means NO. Nothing. Zero */
}

form.jml_formList table.listbody .jmlTableRows td.l.rowSelectorCell,
div.jml_formList table.listbody .jmlTableRows td.l.rowSelectorCell {
  width: 16px;
}

form.jml_formList table.listbody .jmlTableRows td.l.ganttchart,
div.jml_formList table.listbody .jmlTableRows td.l.ganttchart {
  padding: 0 5px;
  overflow: hidden;
  text-align: center;
}

form.jml_formList table.listbody .jmlColumnCaptions th.ganttchart,
div.jml_formList table.listbody .jmlColumnCaptions th.ganttchart {
  padding: 8px 5px 0 5px;
  overflow: hidden;
  text-align: center;
}

form.jml_formList table.listbody .jmlColumnCaptions .ganttchart .chartheaderbox,
div.jml_formList table.listbody .jmlColumnCaptions .ganttchart .chartheaderbox {
  height: 24px;
  padding-top: 4px;
}

form.jml_formList table.listbody .jmlTableRows td.l.ganttchart .chartbox,
div.jml_formList table.listbody .jmlTableRows td.l.ganttchart .chartbox {
  height: 64px;
  margin-top: -6px;
  margin-bottom: -6px;
}

form.jml_formList table.listbody .jmlTableRows td.l.ganttchart .chartheaderbox,
div.jml_formList table.listbody .jmlTableRows td.l.ganttchart .chartheaderbox {
  height: 40px;
  /* Damit sich die grossen und kleinen Meilensteine nicht ber�hren*/
}

form.jml_formList table.listbody .jmlListheader th.groupheader,
form.jml_formList table.listbody .jmlColumnCaptions th.groupheader,
form.jml_formList table.listbody .jmlTableRows td.trenner,
form.jml_formList table.listbody .jmlTableRows th.trenner,
div.jml_formList table.listbody .jmlListheader th.groupheader,
div.jml_formList table.listbody .jmlColumnCaptions th.groupheader,
div.jml_formList table.listbody .jmlTableRows td.trenner,
div.jml_formList table.listbody .jmlTableRows th.trenner {
  padding: 1px;
  text-align: center;
}

form.jml_formList table.listbody td.spacer,
div.jml_formList table.listbody td.spacer {
  padding: 10px 0 2px 0;
}

.tundra td.spacer .jmlTableSpaceCaption>h1,
.tundra td.spacer .jml_formDialog div.dijitTitlePaneTitle h1 {
  font-size: 16px;
  font-weight: bold;
  margin-bottom: 10px;
}

.tundra td.spacer .jmlTableSpaceCaption .valuefield,
.tundra td.spacer .jml_formDialog div.dijitTitlePaneTitle .valuefield {
  padding-left: 20px !important;
}

.jmlTableSpacer .jmlTableSpaceCaption {
  line-height: 20px;
  font-style: normal;
  font-weight: 400;
  font-size: 18px;
  margin: 2px 15px;
}

.jmlTableSpacer .jmlTableSpaceCaption .jmlAction img {
  height: 24px;
  width: 24px;
}

td.spacer .repActDetListHead {
  padding: 2px 15px 5px;
  font-size: 14px;
}

td.spacer .clusterHead {
  font-size: 14px;
}

td.spacer .clusterHead:last-child {
  padding-bottom: 16px;
}

td.spacer .repActDetListHeadSub {
  padding: 2px 0 5px 30px;
}

td.spacer .repActDetListHead h2 {
  margin: 2px 0 2px 0;
  padding-left: 40px;
  background-repeat: no-repeat;
  background-position: left center;
  background-size: 32px;
}

td.spacer .clusterHead h2 {
  margin: 2px 0 2px 0;
  padding-left: 36px;
  background-repeat: no-repeat;
  background-position: left center;
  background-size: 24px;
}

td.spacer .repActDetListHead h2 span {
  float: right;
  font-size: 14px;
}

td.spacer .clusterHead div.clusterHeadRight {
  float: right;
}

td.spacer .clusterHeadMain h2 div.clusterHeadRight {
  font-size: 18px;
}

td.spacer .clusterHeadSub h2 div.clusterHeadRight {
  margin-bottom: 10px;
}

td.spacer .clusterHeadMain h2 {
  font-size: 22px;
}

td.spacer .clusterHeadMain h2.planItem {
  line-height: 33px;
}

td.spacer .clusterHeadSub h2 {
  font-size: 16px;
}

div.clusterHead div.entityTitle {
  display: flex;
  flex-direction: row;
}

div.clusterHead span.entityTitleImage img {
  width: 18px;
  height: 18px;
}

div.clusterHead td:last-child {
  text-align: right;
  padding: 0 2px 0 8px;
}

div.clusterHead td:first-child {
  text-align: left;
  padding-right: 8px;
}

div.clusterHead td,
div.clusterHead h1.entityTitleLabel {
  font-size: 12px !important;
  line-height: 18px;
  /*margin-bottom: 0 !important;*/
  margin: 0 0 0 4px;
  /*justify-content: center;*/
  /*display: flex;*/
}

div.clusterHead tr:not(.current),
div.clusterHead tr:not(.current).current h1.entityTitleLabel {
  opacity: 0.8;
}

.planItem_general {
  background-image: url(../entity/expenseplanitem.svg);
}

.planItem_car {
  background-image: url(../entity/expenseplanitem_car.svg);
}

.planItem_carrent {
  background-image: url(../entity/expenseplanitem_carrent.svg);
}

.planItem_flight {
  background-image: url(../entity/expenseplanitem_flight.svg);
}

.planItem_hotel {
  background-image: url(../entity/expenseplanitem_hotel.svg);
}

.planItem_train {
  background-image: url(../entity/expenseplanitem_train.svg);
}

td.spacer .mainproject h2 {
  font-size: 22px;
  background-image: url(../entity/project_blue_structure.svg);
}

td.spacer .subproject h2 {
  font-size: 16px;
  background-image: url(../entity/project_sub.svg);
}

td.spacer .repActDetListHead .descriptionfield,
td.spacer .repActDetListHead .valuefield {
  text-align: right;
}

td.spacer .repActDetListHead .descriptionfield {
  text-align: right;
}

form.jml_formList table.listbody thead.jmlColumnCaptions th,
form.jml_formList table.listbody tbody.jmlColumnCaptions td,
div.jml_formList table.listbody thead.jmlColumnCaptions th,
div.jml_formList table.listbody tbody.jmlColumnCaptions td,
table.listbody .bmlf_sumrow td.trenner {
  border: none;
}


/* Listen und Dialogtitel */

.tundra .jml_formDialog div.jml_dialogTbodyHeaderOverlay {
  height: 0;
  position: relative;
  text-align: right;
  overflow: visible;
}

.tundra .jml_formDialog div.jml_dialogTbodyHeaderOverlay>div {
  height: 40px;
  font-style: normal;
  font-weight: 300;
  font-size: 21px;
  color: #666;
  display: inline-block;
  margin: 0 8px 0 8px;
  line-height: 40px;
  white-space: nowrap;
  text-overflow: ellipsis;
  max-width: 50%;
  overflow: hidden;
  cursor: default;
}

.tundra .jml_formDialog div.jml_dialogTbodyHeaderOverlay>div img {
  vertical-align: middle;
  /* height:24px; <- nicht gut. trifft zu viele elemente*/
  width: auto;
}

.tundra .jml_formDialog div.jml_dialogTbodyHeaderOverlay>div img.imgDialogHeader {
  margin: 5px 0 0 5px;
}

table.jmlListheader,
table.jmlDialogheader {
  table-layout: fixed;
  width: 100%;
}

div.jmlListheadertitle,
div.jmlDialogheadertitle,
th.jmlListheader,
.tundra div.boxarea div.box_dialog div.box_header {
  line-height: 40px;
  font: var(--font-header);
}

.bmlf_calendarDateHeader,
.bmlf_calendar tr.bmlf_calendarDateSubHeader th,
table.listbody th.jmlListheader {
  background: var(--color-card-background);
  color: var(--color-card-font);
}
table.listbody th.jmlListheader {
  border-bottom: 0 none;
  text-align: left;
  padding: 10px 15px;
  font: var(--font-large);
}

table.bmdf_dialogHeader {
  width: 100%;
}

div.jmlListheadertitle,
div.jmlDialogheadertitle{
  padding: 8px 0 2px 0;
  margin-bottom: var(--form-padding);
  border-bottom: 2px solid var(--color-primary);
  /*text-decoration: underline;*/
  /*text-decoration-color: var(--color-primary);*/
}

.tundra .jml_formDialog div.dijitTitlePaneTitle,
.tundra .jml_formList div.dijitTitlePaneTitle,
.tundra .jml_formList div.dijitTitlePaneTitle {
  border: 0 none;
  font-size: 21px;
  min-height: 29px;
  line-height: 28px;
  padding: 5px 10px 5px 10px;
  margin: 0;
  font-style: normal;
  font-weight: 300;
}

.tundra .jml_formDialog div.dijitTitlePaneTitleHover,
.tundra .jml_formList div.dijitTitlePaneTitleHover {
  background-color: #EEE;
}

.dijitTitlePaneTextNode {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

form.jml_formList table.listbody .last,
div.jml_formList table.listbody .last {
  padding-right: 15px!important;
}

table.listbody {
  border-spacing: 0;
  border-collapse: separate;
  empty-cells: show;
  width: 100%;
  font: var(--font-normal);
}


table.listbody td.l,
table.listbody th {
  padding: 6px 2px; /* horizontales padding nur als minimalwert falls der bildschirm mal zu klein für die Tabelle ist*/
  border-bottom: solid var(--width-tr-border, 1px) var(--color-default-border);
}

table.listbody td.l.nobr {
  white-space: nowrap;
}

table.listbody td.ignoreclick {
  cursor: default;
}

/* Ausnahmen Listenzelle*/

table.listbody td.iavis {
  padding-left: 3px;
  padding-right: 0;
  white-space: nowrap;
  text-align: right;
}

table.listbody td.iahid {
  padding-left: 0;
  padding-right: 2px;
  white-space: nowrap;
  text-align: right;
}

table.listbody td.iaall {
  padding-left: 2px;
  padding-right: 1px;
  white-space: nowrap;
}

table.listbody td.jmlMiCol {
  text-align: center;
}

.mi-selectall-button,
.mi-selection-status {
  margin: 0;
  padding: 0;
  border: 0;
  display: inline-block;
  height: 16px;
  width: 16px;
  font-size: 12px;
  background-color: white;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.5);
  transition: transform 250ms;
  transform: rotateY(180deg);
  cursor: pointer;
}

.mi-selectall-button::after,
.mi-selection-status::after {
  display: inline-block;
  content: '✓';
  color: #666;
  opacity: 0;
  transition: opacity 0ms;
  transition-delay: 100ms;
}

th:hover .mi-selectall-button,
.selected .mi-selection-status {
  transform: rotateY(0deg);
}

th:hover .mi-selectall-button::after,
.selected .mi-selection-status::after {
  opacity: 1;
}

.jml-tile .mi-selection-status {
  margin-top: 2px;
  height: 20px;
  width: 20px;
  font-size: 15px;
}

.listarea td.nbsp {
  white-space: nowrap;
  padding-top: 0;
  padding-left: 2px;
  padding-right: 2px;
}

table.listbody td.treestructure {
  padding: 0 1px;
}

table.listbody td.treestructureroot,
table.listbody td.treestructurenode,
table.listbody td.treestructurechild,
table.listbody td.treestructureempty,
table.listbody td.treestructurelastChild,
table.listbody td.treestructureline,
table.listbody td.treestructureleaf,
table.listbody td.treestructureorphanleaf,
table.listbody td.treestructureorphannode,
table.listbody td.treestructurecaption {
  border-left: 0 none;
  border-right: 0 none;
}

tr.mailunread {
  font-weight: bold;
}


/*Listen-NAVIGATION*/

table.navigator {
  border: 0 none;
  width: 100%;
  padding: 5px 0;
  font: var(--font-small);
  line-height: 1.2;
}

table.navigator td {
  padding: 6px 15px;
}

table.navigator td:first-child {
  width: 30%;
}

table.navigator td:last-child {
  width: 40%;
}

table.navigator .pageswitcher {
  text-align: left;
}

table.navigator .totalsize {
  text-align: center;
}

table.navigator .pagesizeswitcher {
  text-align: right;
}

.pagesizeswitcher {
  padding-right: 8px;
}

a.nav {
  display: inline-block;
  cursor: pointer;
}

a.nav:hover {
  font-weight: bold;
}

a.nav.aktuell {
  font-weight: bold;
  color: var(--color-main-header);
}


/* DialogBody als QuickCreate*/

.quickCreate .jml_formDialog,
.subdialog .jml_formDialog {
  border: 0 none;
  background-color: transparent;
  padding: 0 0 0 0;
}


/* Dialog "dickes" label */

.dialog td.label.areaheader {
  font-weight: bold;
  text-align: left;
  font-size: 13px;
}


/* Dialog "dickes" label */

.dialog td.label.areaheaderbig {
  font-weight: bold;
  text-align: left;
  font-size: 14px;
  padding-top: 20px;
}

.dialog tr:first-child td.label.areaheaderbig {
  padding-top: 8px;
}


/*
  ------------------------------ Listenansicht "Kalender" ------------------
*/

.subPixelCursor {
  position: absolute;
  top: 0;
  border: 1px solid green;
  width: 100%;
  text-align: center;
  z-index: 10000;
  font-size: 20px;
  line-height: 24px;
  overflow: hidden;
  font-weight: bold;
}

.bmlf_calendar .subPixelCursor {
  border-width: 3px 0 0 0;
  width: 100%;
  padding-right: 60px;
  left: auto;
  right: 0;
  text-align: left;
}

.bmlf_calendar .subPixelCursor label {}

.bmlf_calendar td.bmlf_calcontroller,
.bmlf_calendar th.bmlf_calcontroller {
  white-space: normal;
  text-align: center;
}

.bmlf_calendar .calcontroller {
  vertical-align: top;
  padding: 4px 0 2px 0;
  text-align: right;
  white-space: nowrap;
}
.bmlf_month-nav {
  display: flex;
  align-items: center;
  padding-left: var(--width-componentspacing);
  font: var(--font-large);
}

.bmlf_month-nav > div.header{
  text-align: center;
  width: 100%;
}

.bmlf_calendar .calcontroller button {
  margin:1px;
  padding-left: 4px;
  padding-right: 4px;
}
.bmlf_calendar .bmlf_calcontroller .calcontroller {
  display: inline-block;
  padding: 4px 2px 2px 2px;
}

.bmlf_calendarWholeDay .bmlf_upperleft {
  vertical-align: top;
  text-align: center;
}

.bmlf_calendar .bmlf_calendarDateNav .calcontroller {
  display: flex;
}


.bmlf_calendar .bmlf_calendarDateNav .calcontroller button {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.bmlf_calendar .bmlf_calendarDateNav .calcontroller button.range-start {
  flex-basis: content;
}

.bmlf_calendar .bmlf_calendarDateNav .calcontroller button.range-start::after {
  content: ' ›'
}


.bmlf_calendar .bmlf_calendarDateNav .calcontroller button:last-child {
  flex: 1;
}

.calcontroller button fp-inline-svg {
  height: 18px;
  width: 18px;
}

.bmlf_calendar .calcontroller-viewmode {
  width: 52px;
}

.bmlf_calendar table.bmlf_calendar {
  /*border-spacing: 1px;*/
  table-layout: fixed;
  border-bottom: 1px solid #EEE;
  width: 100%;
  /* Damit die Spalten gleich groß sind*/
}

.dj_trident table.bmlf_calendar {
  max-width: 80vw;
  /* hallo ie11 */
}

.bmlf_calendar div.timeScrollerDummy table.bmlf_calendar {
  border-bottom: 0;
}

.bmlf_calendar table.bmlf_calendarhour {}

.bmlf_calendar div.timeScrollerDummy {
  overflow-y: scroll;
  overflow-x: hidden;
}

.bmlf_calendar div.scrolldummy {
  overflow-y: scroll;
  overflow-x: hidden;
  height: 20px;
  float: right;
}

.bmlf_calendar div.timeScroller {
  height: 500px;
  overflow: scroll;
  overflow-y: scroll;
  overflow-x: hidden;
  position: relative;
  /* Damit die Termine im ie7 mitscrollen */
  border-bottom: 1px solid #ccc;
}

.bmlf_calendar col.bmlf_calendarhour.left {
  width: 64px;
}

.bmlf_calendar col.bmlf_calendarhour.left1 {
  width: 20px;
}

.bmlf_calendar col.bmlf_calendarhour.left2 {
  width: 36px;
  vertical-align: middle;
}

.bmlf_calendar .bmlf_calendarhour.left1 .calcontroller,
.bmlf_calendar .bmlf_calendarhour.left2 .calcontroller {
  height: 100%;
  padding: 0 1px 1px 0;
  white-space: normal;
  text-align: left;
}

.bmlf_calendar .bmlf_calendarhour.left1 .calcontroller button {
  white-space: normal;
  height: 40px;
  margin-top: 16px;
  width: 22px;
}

.bmlf_calendar .bmlf_calendarhour.left2 .calcontroller button {
  white-space: normal;
  height: 100%;
  min-height: 56px;
  /* firefox */
  width: 22px;
}

.bmlf_calendar .bmlf_calendarhour.left1 .calcontroller button img,
.bmlf_calendar .bmlf_calendarhour.left2 .calcontroller button label {
  transform: rotate(-90deg);
  display: inline-block;
  margin-left: -20px;
  margin-right: -20px;
  cursor: inherit;
}

.bmlf_calendar col.bmlf_calendernav {
  width: 26px;
}

.bmlf_calendar div.bmlf_calendarhour {
  height: 64px;
  line-height: 18px;
  padding: 0 10px 0 0;
  text-align: right;
  display: inline-block;
  width: 45px;
  color: #999;
  font-weight: bold;
}

.bmlf_calendar div.bmlf_calendarhour:last-child {
  height: 61px;
  /*pf 4.x: 37px; */
}

.bmlf_calendar tr.bmlf_calendarDateHeader th.bmlf_calendarSeveralDays,
.bmlf_calendar tr.bmlf_calendarDateHeader th.bmlf_calendarDateNav {
  height: 22px;
  padding-right: 0;
  white-space: nowrap;
}

td.bmlf_calendarDateHeader {
  text-align: right;
  padding-right: 8px;
}

.bmlf_calendar tr.bmlf_calendarDateSubHeader th {
  height: 18px;
  line-height: 14px;
  padding-left: 5px;
  padding-right: 0;
  white-space: nowrap;
}

.bmlf_calendar tr.bmlf_calendarday td.bmlf_calendarhour {
  padding: 0;
  text-align: right;
}

.bmlf_calendar tr.bmlf_calendarDateSubHeader th.bmlf_calendarhour {
  padding: 0;
}

.bmlf_calendar .bmlf_calendarDateSubHeader th.bmlf_calendarDayInMonth {
  border-bottom: 1px solid #EEE;
  border-top: 1px solid #FFF;
  padding-top: 3px;
  padding-left: 0;
  vertical-align: bottom;
  line-height: 12px;
  font-size: 10px;
  text-align: left;
}

.bmlf_calendar .bmlf_calendarDateSubHeader th.bmlf_calendarDayInMonth.daterow0 {
  border-top: 0 none;
  padding-top: 0;
}

.bmlf_calendar td.bmlf_calendarDayInMonth {
  padding: 4px 0 4px 0;
  height: 80px;
  vertical-align: top;
  position: relative;
  border-bottom: 1px solid #DDD;
}

.bmlf_calendar td.bmlf_calendarDayInTeam {
  padding: 0;
  padding-bottom: 16px;
  /*height: 60px;*/
  vertical-align: top;
  border-top: 1px solid #DDD;
}

.bmlf_calendar td.bmlf_calendarParticipant {}

.bmlf_calendar td.bmlf_calendarday {
  height: 1533px;
  margin: 0;
  /*padding: 0;*/
  padding: 0 1px 0 0;
  box-shadow: inset -1px 0 0 rgba(0, 0, 0, 0.125);
}

.bmlf_calendar td.bmlf_calendarSeveralDays {
  /*border-left: 1px solid #DDD;*/
  box-shadow: inset -1px 0 0 rgba(0, 0, 0, 0.125);
}

.bmlf_calendar th.bmlf_calcontroller {
  overflow: hidden;
  vertical-align: top;
}

.bmlf_calendar .bmlf_calendarDateHeader th,
th.bmlf_calendarDayInMonth {
  text-align: center;
  vertical-align: middle;
}

.bmlf_calendar .bmlf_calendarDateHeader th.rc,
.bmlf_calendar .bmlf_calendarDateHeader th.lc {
  vertical-align: bottom; /* die Spaltenüberschriften sind unten ausgerichtet (da steckt oft ein rowspan drin) */
  padding-bottom: 5px;
  overflow: hidden;
}

.bmlf_calendar th:hover {
  overflow: visible !important;
}

.bmlf_calendar th>span:first-child {
  /*position:absolute;*/
  /*margin-top:-11px;*/
  padding-left: 4px;
  margin-left: 0;
  display: inline-block;
  line-height: 22px;
}

.bmlf_calendar th:hover span {
  position: relative;
}

.bmlf_calendar .today {
  font-weight: bold;
}

.bmlf_calendar tr.bmlf_calendarDateSubHeader th.today {
  background-color: #B7D4EB;
  color: var(--color-main-font);
}

.bmlf_calendar td.bmlf_onDateClickanchor {
  position: relative;
  width: 100%;
  min-height: 80px;
  padding-bottom: 26px;
}

.bmlf_calendar .bmlf_calendarTeam .bmlf_onDateClickanchor {
  min-height: 0;
}

.bmlf_calendar tr.bmlf_calendarWholeDay .bmlf_onDateClickanchor {
  min-height: 0;
  padding: 0;
}

.bmlf_calendar td.bmlf_onDateClickanchor {
  border-left: 1px solid #CCC;
}

.bmlf_calendar div.bmlf_dndCatcher,
.bmlf_calendar div.bmlf_onDateClickcatcher {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  /*z-index: 1;*/
}

.bmlf_calendar td.bmlf_calendarSeveralDays {
  position: relative;
  vertical-align: top;
  padding: 0;
  padding-bottom: 16px;
}

.bmlf_calendar div.bmlf_calendarSeveralDays {
  /* Bezugsdiv fuer die tagesuebergreifenden Termine */
  position: relative;
  height: 16px;
  width: calc(100% + 1px); /* 1px mehr, um den Tabellenborder zu überlagern, wir dienen als Referenzrahmen! */
  left: 0;
  z-index: 2;
}

.bmlf_calendar div.bmlf_calendarDay {
  /* Bezugsdiv fuer die einzelnen Termine */
  height: 100%;
  position: relative;
  width: 100%;
}

.hiddenEventHandle {
  display: inline-block;
  /*border:1px solid #ccc;*/
  width: 20px;
  height: 20px;
  margin: 2px;
  border-radius: 50%;
  background-color: black;
  position: absolute;
  /*display: none;*/
  cursor: pointer;
  z-index: 50;
  transform: scale(0);
  transition: transform 1s;
}

.hiddenEventHandleActiveTop,
.hiddenEventHandleActiveBottom {
  display: inline-block;
  box-shadow: 1px 1px 3px #666;
  transform: scale(1);
  transition: transform 0.25s;
}

.hiddenEventHandle span.arrow {
  display: inline-block;
  margin: 2px;
  height: 16px;
  width: 16px;
  background-position: center center;
  background-repeat: no-repeat;
  background-image: url(hiddenEventHandleNeutral.svg);
}

.hiddenEventHandleActiveTop span.arrow {
  background-image: url(hiddenEventHandleTop.svg);
}

.hiddenEventHandleActiveBottom span.arrow {
  background-image: url(hiddenEventHandleBottom.svg);
}

.tundra .bmlf_calendar .bmlf_calendarTeam .cap-summary {
  border-top: 5px solid var(--color-primary);
}

.tundra .bmlf_calendar .bmlf_calendarTeam .cap-relday {
  border-left: 5px solid var(--color-primary);
}

.tundra .bmlf_calendar .bmlf_calendarTeam .cap-free {
  background-color: var(--color-worker-cap-free);
}

.tundra .bmlf_calendar .bmlf_calendarTeam .cap-error {
  background-color: var(--color-worker-cap-error);
}

.tundra .bmlf_calendar .bmlf_calendarTeam .cap-time {
  background-color: var(--color-worker-cap-time);
}


/* gross und klein*/

.bmlf_calendar div.bmlf_calendarBigEntry,
.bmlf_calendar div.bmlf_calendarEntry {
  padding: 0;
  box-shadow: 0 0.5px 2px 0 rgba(0, 0, 0, 0.4);
  border-radius: 2px;
  overflow: hidden;
  position: absolute;
  transition: all 0.25s ease-in-out;
}

.bmlf_calendar div.bmlf_calendarBigEntry.tile-being-dragged,
.bmlf_calendar div.bmlf_calendarEntry.tile-being-dragged {
  transform: rotateZ(2deg);
}

.bmlf_calendar div.bmlf_calendarEntry {
  /*overflow :hidden;*/
  cursor: default;
  background-color: var(--color-shade-none);
  /*background-image: linear-gradient(to bottom right, rgba(0,128,255, 0.02) 0%, rgba(255,128,0, 0.03)  100%);*/
}

.bmlf_calendar div.bmlf_calendarBigEntry[draggable]:hover,
.bmlf_calendar div.bmlf_calendarEntry:hover {
  z-index: 10;
  box-shadow: 2px 2px 4px #333;
}

.bmlf_calendar div.bmlf_calendarEntry.clickable {
  cursor: pointer;
}

.bmlf_calendar div.bmlf_calendarEntry.selected {
  z-index: 99999;
  overflow: visible;
  outline: 2px solid var(--color-selected-item-hover);
}
.bmlf_calendar div.bmlf_calendarEntry.selected::before {
  content: '';
  position: absolute;
  height: 200vh;
  width: 200vw;
  top: -100vh;
  left: -100vw;
  margin-left: 50%;
  margin-top: 20px;
  background-image: radial-gradient(circle, rgba(0,0,0,0) 80px, rgba(0,0,0,0.25) 100px);
  background-size: cover;
  background-position: center;
  transform: scale(0);
  animation: spotlightFadeOut;
  animation-delay: 0ms;
  animation-duration: 2000ms;
}

@keyframes spotlightFadeOut {
  0% {transform: scale(0.1); opacity: 0;  }
  20% {transform: scale(1); opacity: 1;  }
  70% {transform: scale(1); opacity: 1; }
  80% {transform: scale(4); opacity: 0; }
  100% {transform: scale(0); opacity: 0; }
}

.bmlf_calendar div.bmlf_calendarBigEntry {
  background-color: var(--color-shade-none);
  border-left: 0;
  height: 15px;
  line-height: 15px;
  padding: 0;
  left: 0;
  width: calc(100% - 1px); /* -1px um gerade so zu shrinken, um den Zellrahmen rechts sichtbar werden zu lassen*/
}

.bmlf_calendar .bmlf_cE_content>h1 {
  margin: 0;
  font-size: 11px;
  line-height: 15px;
  padding-left: 1px;
  font-family: "Roboto", Arial, sans-serif;
}

.bmlf_calendar div.bmlf_calendarBigEntry .bmlf_cE_content>h1 {
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}

.bmlf_calendar .bmlf_cE_content>h1 img.intextline {
  margin-bottom: -1px;
}

.bmlf_calendar div.bmlf_cE_colorbar {
  position: relative;
  width: 12px;
  left: 0;
  background-repeat: no-repeat;
  background-size: 12px 12px;
  background-position: 0 1px;
  /* Standardwerte bei Terminen die zur vollen/halben Stunde beginnen*/
  top: 0;
  height: 100%;
}

p.bmlf_cE_location,
p.bmlf_cE_parti {
  margin: 2px 0 0 0;
  padding-left: 12px;
  background-size: 12px;
  background-repeat: no-repeat;
  background-position: left center;
  font-size: 11px;
  line-height: 11px;
  color: #000;
  opacity: 0.5;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

p.bmlf_cE_location {
  background-image: url(../css/embed/base_ce_location.svg);
}

p.bmlf_cE_parti {
  background-image: url(../css/embed/base_ce_participant.svg);
}

p.bmlf_cE_fromdate {
  text-align: right;
  padding: 0;
  margin: 0;
}

p.bmlf_cE_todate,
p.bmlf_cE_type {
  padding: 0;
  margin: 0;
  text-align: right;
  height: 11px;
  line-height: 11px;
  font-size: 10px;
  color: #888;
}

table.listbody td.trenner,
table.listbody th.trenner {
  border-bottom: 0 none;
  background-color: var(--color-default-border);
}

table.bmlf_calendar td.bmlf_calendarParticipant,
table.bmlf_calendar td.bmlf_calendarDayInTeam,
table.bmlf_calendar td.bmlf_calendarDayInMonth {}

.bmlf_calendar .bmlf_cE_content p.bmlf_cE_description {
  margin: 2px 0 0 0;
  font: var(--font-small);
  line-height: 11px;
  color: var(--color-main-font);
  opacity: 0.5;
  overflow: hidden;
  text-overflow: ellipsis;
}

.bmlf_calendar div.ce_deleted {
  opacity: 0.5;
  background: none;
  /* firefox */
  filter: none;
  background-color: #DDD;
}

.bmlf_calendar div.ce_deleted h1 {
  text-decoration: line-through;
}

.bmlf_calendar div.ce_poll div.bmlf_cE_colorbar {
  background-image: url(../css/embed/base_ce_poll.svg);
}

.bmlf_calendar div.ce_vacation div.bmlf_cE_colorbar {
  background-image: url(../css/embed/base_ce_vacation.svg);
}

.bmlf_calendar div.ce_abs div.bmlf_cE_colorbar {
  background-image: url(../css/embed/base_ce_abs.svg);
}

.bmlf_calendar div.ce_sick div.bmlf_cE_colorbar {
  background-image: url(../css/embed/base_ce_sick.svg);
}

.bmlf_calendar div.ce_extern div.bmlf_cE_colorbar {
  background-image: url(../css/embed/base_ce_extern.svg);
}

.bmlf_calendar div.ce_resource div.bmlf_cE_colorbar {
  background-image: url(../css/embed/base_ce_resource.svg);
}

.bmlf_calendar div.ce_series div.bmlf_cE_colorbar {
  background-image: url(../css/embed/base_ce_master.svg);
}

.bmlf_calendar div.ce_fix div.bmlf_cE_colorbar {
  background-image: url(../css/embed/base_ce_fix.svg);
}

.bmlf_calendar div.ce_capfix div.bmlf_cE_colorbar {
  background-image: url(../css/embed/base_ce_capfix.svg);
}

.bmlf_calendar div.ce_capm div.bmlf_cE_colorbar {
  background-image: url(../css/embed/base_ce_capm.svg);
}

.bmlf_calendar div.ce_time div.bmlf_cE_colorbar {
  background-image: url(../css/embed/base_ce_time.svg);
}

.bmlf_calendar div.ce_cap div.bmlf_cE_colorbar {
  background-image: url(../css/embed/base_ce_cap.svg);
}

.bmlf_calendar div.ce_cal div.bmlf_cE_colorbar {
  background-image: url(../css/embed/base_ce_cal.svg);
}

.bmlf_calendar div.ce_exception div.bmlf_cE_colorbar {
  background-image: url(../css/embed/base_ce_exception.svg);
}

.bmlf_calendar div.ce_poll div.bmlf_cE_colorbar.dark {
  background-image: url(../css/embed/base_ce_poll_white.svg);
}

.bmlf_calendar div.ce_vacation div.bmlf_cE_colorbar.dark {
  background-image: url(../css/embed/base_ce_vacation_white.svg);
}

.bmlf_calendar div.ce_abs div.bmlf_cE_colorbar.dark {
  background-image: url(../css/embed/base_ce_abs_white.svg);
}

.bmlf_calendar div.ce_sick div.bmlf_cE_colorbar.dark {
  background-image: url(../css/embed/base_ce_sick_white.svg);
}

.bmlf_calendar div.ce_extern div.bmlf_cE_colorbar.dark {
  background-image: url(../css/embed/base_ce_extern_white.svg);
}

.bmlf_calendar div.ce_resource div.bmlf_cE_colorbar.dark {
  background-image: url(../css/embed/base_ce_resource_white.svg);
}

.bmlf_calendar div.ce_series div.bmlf_cE_colorbar.dark {
  background-image: url(../css/embed/base_ce_master_white.svg);
}

.bmlf_calendar div.ce_fix div.bmlf_cE_colorbar.dark {
  background-image: url(../css/embed/base_ce_fix_white.svg);
}

.bmlf_calendar div.ce_capfix div.bmlf_cE_colorbar.dark {
  background-image: url(../css/embed/base_ce_capfix_white.svg);
}

.bmlf_calendar div.ce_capm div.bmlf_cE_colorbar.dark {
  background-image: url(../css/embed/base_ce_capm_white.svg);
}

.bmlf_calendar div.ce_time div.bmlf_cE_colorbar.dark {
  background-image: url(../css/embed/base_ce_time_white.svg);
}

.bmlf_calendar div.ce_cap div.bmlf_cE_colorbar.dark {
  background-image: url(../css/embed/base_ce_cap_white.svg);
}

.bmlf_calendar div.ce_cal div.bmlf_cE_colorbar.dark {
  background-image: url(../css/embed/base_ce_cal_white.svg);
}

.bmlf_calendar div.ce_exception div.bmlf_cE_colorbar.dark {
  background-image: url(../css/embed/base_ce_exception_white.svg);
}

.bmlf_calendar div.bmlf_cE_content {
  left: 12px;
  /* weg von der colorbar */
  overflow: hidden;
  text-overflow: ellipsis;
  position: absolute;
  right: 0;
  top: 0;
  bottom: 0;
}

.bmlf_calendar div.bmlf_calendarBigEntry div.bmlf_cE_content {
  height: 15px;
}

.bmlf_calendar div.bmlf_calendarActions {
  bottom: -1px;
  position: absolute;
  right: 1px;
  /* weg von der colorbar */
  text-align: right;
}

.bmlf_calendar div.bmlf_calendarActions .jmlActionIcon img {
  max-height: 16px;
}

.bmlf_calendar img.bmlf_cE_iconRight {
  position: absolute;
  right: 0;
  top: 0;
}

.bmlf_calendar img.bmlf_cE_iconLeft {
  left: -3px;
  position: relative;
  top: -3px;
}

.bmlf_calendar div.bmlf_vCaptionAnchor {
  /*Dreh und Angelpunkt unserer Rotation*/
  left: 30px;
  top: 480px;
  width: 0;
  height: 0;
  position: relative;
  -webkit-transform: rotate(90deg);
  -moz-transform: rotate(90deg);
  transform: rotate(90deg);
}

.bmlf_calendar span.bmlf_vCaption {
  /*zu Rotierendes Element*/
  position: absolute;
  left: -30px;
  top: -30px;
  font-size: 45px;
  line-height: 60px;
  font-weight: bold;
  opacity: 0.10;
  white-space: nowrap;
}

.bmlf_calendar div.bmlf_hCaptionAnchor {
  height: 0;
}

.bmlf_calendar .bmlf_hCaption {
  font-size: 17px;
  line-height: 25px;
  font-weight: bold;
  color: var(--color-main-font);
  padding-top: 30%;
  text-align: center;
}

.bmlf_calenderteamnav-sep {
  width: 6px;
}

.bmlf_calendarTeam div.bmlf_hCaptionAnchor,
.bmlf_calendarTeamRotated div.bmlf_hCaptionAnchor {
  position: absolute;
  height: auto;
  bottom: 0;
  left: 0;
  right: 0;
}

.bmlf_calendarTeam .bmlf_hCaption,
.bmlf_calendarTeamRotated .bmlf_hCaption {
  padding: 0;
  font-size: 10px;
  line-height: 12px;
}

.bmlf_calendar tr.bmlf_calendarDateSubHeader th.ltFilter,
.bmlf_calendar tr.bmlf_calendarDateSubHeader th.gtFilter,
.bmlf_calendar tr.bmlf_calendarDateSubHeader th.firstGtFilter {
  /*background-color: #e0e0e0 !important;*/
}

.bmlf_calendar td.ltFilter::before,
.bmlf_calendar td.gtFilter::before,
.bmlf_calendar td.firstGtFilter::before {
  position: absolute;
  content: '';
  display: block;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(128, 128, 128, 0.33);
}

.bmlf_calendar td.bmlf_calendarParticipant {
  border-top: 1px solid #DDD;
  vertical-align: middle;
}

.bmlf_calendar td.bmlf_calendarParticipant>img {
  height: 48px;
  width: 48px;
  object-fit: cover;
  border-radius: 50%;
  vertical-align: middle;
}

.bmlf_calendar tr.bmlf_calendarDayInMonth td.weekend,
.bmlf_calendar tr.bmlf_calendarTeam td.weekend,
.bmlf_calendar tr.bmlf_calendarday td.weekend {
  background-color: var(--color-tint-weekend);
}

.bmlf_calendar tr.bmlf_calendarWholeDay td.holiday,
.bmlf_calendar tr.bmlf_calendarday td.holiday,
.bmlf_calendar tr.bmlf_calendarTeam td.holiday,
.bmlf_calendar tr.bmlf_calendarDayInMonth td.holiday {
  background-color: var(--color-tint-holiday);
}

.jml_formCalendar > .bmlf_calendar {
  display: flex;
  flex-direction: column;
}

.popupPrint .jml_formCalendar > .bmlf_calendar {
  display: block;
}

.bmlf_calendar div.timeScroller {
  border-top: 1px solid #CCC;
  flex: 1;
}

.bmlf_calendar div.timeScrollerDummy {
  border-bottom: 3px solid var(--color-toolbar-button);
}


/* ----------- Ende BaseMetaListForm.Calendar ---------------*/


/*
  ------------------------------ Boxarea & -segmente -----------------------
*/

div.boxarea {
  background-color: transparent;
  padding: 0 0 0 0;
  /*width:260px; /* + padding = 260px */
  min-height: 110px;
}

.tmplLeftarea .boxarea {
  /*position: relative;*/
  /*z-index: 99;*/
}

#jasperHtmlShow.boxarea,
div#tmplRightarea.boxarea {
  width: auto;
}

div.tmplRightarea>div.boxarea {
  padding-left: 16px;
}

div.boxarea div.box {
  margin: 0 0 10px 0;
}

.tmplLeftarea div.boxarea div.box {
  width: 300px;
  border: 1px solid #e4e4e4;
}

div.boxarea div.box:first-child {
  margin-top: 0;
}

.tundra div.boxarea div.box .dijitTabContainerTop-tabs,
div.boxarea div.box div.box_header {
  /*font-family: 'Source Sans Pro', 'Verdana', sans-serif;*/
  /*font-weight: 400;*/
  background: var(--color-toolbar-back);
}

.tundra div.boxarea div.box.headless .dijitTabContainerTop-tabs {
  padding-top: 9px;
}

div.boxarea div.box div.box_header {
  padding: 0 0 0 13px;
  color: var(--color-toolbar-font);
  font: var(--font-normal);
  height: var(--height-toolbar);
  line-height: 32px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  display: flex;
  align-items: center;
}

div.boxarea div.box div.box_header_clickable:hover {
  cursor: pointer;
}

.tundra div.boxarea div.box_dialog div.box_header {
  border: 0;
}

div.boxarea {
  /* position: relative; <- verhindert Popups außerhalb der Boxarea! */
  transition: margin 0ms;
  transition-delay: 0ms;
}

div.boxarea.switchable > .box {
  transition: transform 250ms ease-in-out;
  /* transform: translateX(0); <- erzeugt einen neuen Stacking-context :( */
}

.leftarea-closed div.boxarea:first-child {
  margin-left: calc(-1 * var(--width-leftarea));
  transition-delay: 0ms;
  /*overflow-x: visible;*/
  /*overflow-y: visible;*/
}

.leftarea-closed div.boxarea:first-child >.box{
  position: relative;
  z-index: 1;
  left: var(--width-leftarea);
  transform: translateX(calc(-1 * var(--width-leftarea) - 20px));
}



.leftarea-closed div.boxarea:first-child:hover > .box {
  transform: translateX(calc(-1 * var(--width-leftarea)));
}

.boxareaswitcher {
  cursor: pointer;
  display: block;
  position: absolute;
  width: 32px;
  height: 32px;
  line-height: 32px;
  text-align: center;
  border: 1px solid var(--color-card-font);
  border-radius: 50%;
  bottom: 0;
  font-size: 24px;
  opacity: 0.5;
  margin-left: 0;
  transform: translate3d(8px, -56px, 0);
  background-color: var(--color-card-background);
  transition: transform 200ms;
  /*background-image: radial-gradient(var(--color-main-font) 20%, transparent 21%),*/
  /*radial-gradient(var(--color-main-font) 20%, transparent 21%);*/
  /*background-size: 8px 8px;*/
  /*background-position: 2px 2px, 6px 6px;*/
}

.leftarea-closed .boxareaswitcher {
  /*transform: translateX(10px);*/
  opacity: 1;
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
  box-shadow: 2px 0px 4px rgba(0,0,0,0.25);
  margin-left: auto;
  z-index: 1000;
  background-color: var(--color-primary);
  border-color: transparent;
  color: var(--color-primary-contrast);
  transform: translate3d(0, -50vh, 0);
}

.boxareaswitcher::after {
  content: '‹';
  display: inline;
}

.leftarea-closed > .boxareaswitcher::after {
  content: '›';
}

#tmplWorkarea > .boxarea:first-child {height: 100%; }
#tmplWorkarea > .boxarea:first-child > .box {height: 100%; }
#tmplWorkarea > .boxarea:first-child > .box > fp-tab-container{height: 100%; overflow: auto; }

/* --- Boxen --------------------------------- */

.box.headless .boxsegment.tabbed:not(.dijitTabContainer) {
  padding-top: 32px;
  /* so lange custom nicht fertig ist, reservieren wir Platz für die Tabs*/
}

span.boxsegmentcloser {
  text-align: right;
  cursor: pointer;
  float: right;
  display: inline-block;
  width: 20px;
  height: 100%;
  vertical-align: middle;
  background-image: url(closer.svg);
  background-repeat: no-repeat;
  background-position: center;
  transition: all 0.25s ease-in-out;
  transform: rotate(0deg);
}

.boxsegmentcloseropen span.boxsegmentcloser {
  transform: rotate(90deg);
}

div.box .dijitTabContainerTop-tabs {
  border-bottom: 0 none;
}

div.box_uploader {
  padding: 5px 1px 3px 1px;
  /* o r u l */
  margin: 0 auto 0 auto;
  color: #000;
  font-size: 11px;
  /*height:200px;*/
}

div.box_myday {
  min-width: 280px;
  width: 100% !important;
}

div.box .boxsegmentcontent {
  /*border-top:1px solid #CCC;*/
  border-top: 0 none;
  /*box-shadow: inset 0px 2px 0px -1px #CCC;*/
  /*padding-top: 2px;*/
}

.jmlViewcontroller {
  overflow: visible;
  /*background-color: var(--color-main-background);*/
  }

.jmlViewcontroller .listcontrol {
  transform: none; /* Vorsicht: Transforms erzeugen einen neuen Stacking-Context! */
  transition: transform 300ms;
  transform-origin: top;
  padding-top: var(--width-componentspacing);
  padding-bottom: var(--width-componentspacing);
}

pf-parent-css-toggle.listheader-switcher > svg,
pf-parent-css-toggle.listheader-switcher fp-inline-svg{
  height: 24px;
  width: 24px;
  transition: all 300ms;
}

pf-list-view.compact .jmlViewcontroller {
  height: 0;
}

pf-list-view.compact .jmlViewcontroller .listcontrol {
  transform: scaleY(0);
}

pf-list-view.fullscreen {
  position: fixed;
  z-index: 9999;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
}

pf-parent-css-toggle.listheader-switcher > svg .switch,
pf-parent-css-toggle.listheader-switcher fp-inline-svg .switch,
button fp-inline-svg .switch,
pf-parent-css-toggle fp-inline-svg .switch{
  transition: transform 400ms;
  transition-delay: 100ms;
}


pf-parent-css-toggle.listheader-switcher.compact > svg .switch-a{ transform: translateX(+2px);}
pf-parent-css-toggle.listheader-switcher.compact > svg .switch-b{ transform: translateX(-10px);}
pf-parent-css-toggle.listheader-switcher.compact > svg .switch-c{ transform: translateX(+6px);}
pf-parent-css-toggle.listheader-switcher.compact fp-inline-svg .switch-a{ transform: translateX(+2px);}
pf-parent-css-toggle.listheader-switcher.compact fp-inline-svg .switch-b{ transform: translateX(-10px);}
pf-parent-css-toggle.listheader-switcher.compact fp-inline-svg .switch-c{ transform: translateX(+6px);}

pf-parent-css-toggle.fullscreen-switcher.fullscreen fp-inline-svg .tdown{ transform: translateY(-4px);}
pf-parent-css-toggle.fullscreen-switcher.fullscreen fp-inline-svg .tup{ transform: translateY(4px);}
pf-parent-css-toggle.fullscreen-switcher.fullscreen fp-inline-svg .tleft{ transform: translateX(-4px);}
pf-parent-css-toggle.fullscreen-switcher.fullscreen fp-inline-svg .tright{ transform: translateX(4px);}

[fullscreen] fp-inline-svg.fullscreen-switcher  .tdown{ transform: translateY(-4px);}
[fullscreen] fp-inline-svg.fullscreen-switcher  .tup{ transform: translateY(4px);}
[fullscreen] fp-inline-svg.fullscreen-switcher  .tleft{ transform: translateX(-4px);}
[fullscreen] fp-inline-svg.fullscreen-switcher  .tright{ transform: translateX(4px);}

[minimized] fp-inline-svg.minimized-switcher  .tdown{ transform: translateY(-14px);}
[minimized] fp-inline-svg.minimized-switcher  .tup{ transform: translateY(16px);}

.tmplListControlAreaPageContent > table {
  width: 100%;
}

.tmplListControlAreaPageContent .boxsegment .boxsegmentcontent {
  padding: 4px 8px;
}

div.box.calendarBox .boxsegmentcontent,
div.box.entityActionBar .boxsegmentcontent {
  border-top: 0 none;
  box-shadow: none;
  padding-top: 0;
}

div.box_info .boxsegmentcontent {
  padding: 5px;
  font: var(--font-normal);
  line-height: 1.2;
  color: var(--color-card-font);
  hyphens: auto;
}


/** Eine einfaches Boxsegment um reinen Text anzuzeigen **/

div.box_hint .boxsegmentcontent {
  padding: 10px 13px;
  font-size: 11px;
  line-height: 15px;
  hyphens: auto;
}

div.box_info ul,
div.box_hint ul,
ul.serviceElements {
  list-style: none;
  padding: 0;
  margin-bottom: 0;
  margin-top: 4px;
}

ul.serviceElements img {
  max-height: 16px;
  width: auto;
}

.jasperdummy {
  cursor: default;
}

div.box_hint li {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  line-height: 16px;
}

div.box_hint li a .jmlImageContainer {
  padding: 1px 0 0 0;
}

div.box_hint li a {
  line-height: 20px;
  padding: 4px 0 4px 0;
}

div.box_hint li img {
  margin-right: 2px;
}

div.box_info .boxsegmentcontent hr {
  border: 0;
  color: #DDD;
  background-color: #DDD;
  height: 1px;
}

div.box_info .jmlAction img {
  width: 16px;
  height: 16px;
}

div.box_info .boxsegmentcontent code {
  font-size: 11px;
  line-height: 15px;
}

div.box_info .boxsegmentcontent h1 {
  margin: 5px 0 3px 0;
  color: var(--color-card-font);
  font: var(--font-medium);
}

div.box_info .boxsegmentcontent a {
  color: #239;
  text-decoration: underline
}

div.box_info .boxsegmentcontent a.vacdetrep img {
  height: 12px;
  width: 12px;
  margin-bottom: 3px;
}
div.badbrowserwarn .boxsegmentcontent {
  background-color: #EEDD00;
}

div.badbrowseralert .boxsegmentcontent {
  color: #FFF;
  background-color: var(--color-admin-red);
  font-size: 13px;
}

div.badbrowseralert .boxsegmentcontent a,
div.badbrowseralert .boxsegmentcontent a:visited {
  color: #FFF;
}


div.boxarea .box > .dijitContentPane,
.boxsegment > .dijitContentPane
{
  overflow: visible;
  padding: 0;
}

div.boxarea .box .boxsegment {
  background: var(--color-card-background);
}

.preshow-card {
  box-shadow: var(--shadow-cards);
  max-width: 300px;
  min-width: var(--width-leftarea, 200px);
  background-color: var(--color-card-background);
}

.preshow-card.clickable:hover {
  background-color: var(--color-default-hover);
  cursor: pointer;
}

.preshow-card.page-background,
div.boxarea .box .boxsegment .page-background {
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
  /* Damit helle flächen im hintergrund nicht die Lesbarkeit stören
   multiplizieren wir mit einem hellen grau */
  background-color: #CCC;
  background-blend-mode: multiply;
}

.preshow-card.page-background > .pf-ps{
  color: #FFF;
  text-shadow: 0 0 1px rgba(0, 0, 0, 1), 0 0 5px rgba(0, 0, 0, 0.4);
}

div.boxarea .box .boxsegment .page-background .page-content {
  color: #FFF;
  text-shadow: 0 0 1px rgba(0, 0, 0, 1), 0 0 5px rgba(0, 0, 0, 0.4);
  background: linear-gradient( rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0.5))
}

div.boxarea .box.scrollx .dijitContentPane form {
  overflow-x: auto;
}

div.rightboxfooterlink {
  text-align: right;
  padding: 5px 0 0;
  background: var(--color-toolbar-back);
}

div.rightboxfooterlink a.rightboxfooterlink {
  color: var(--color-main-font);
}


/* --- Meine Kollegen heute --------------------------------------------- */

.mycollegues .pf_formNavigationList table.listbody {
  table-layout: unset;
}

.mycollegues .pf_formNavigationList table.listbody td.l {
  height: 28px;
  padding: 6px 0;
  vertical-align: middle;
}

.mycollegues .pf_formNavigationList table.listbody td.l:first-child {
  padding: 6px 6px 6px 15px;
}

.mycollegues .pf_formNavigationList table.listbody td.l:last-child {
  padding: 6px 15px 6px 6px;
}


/* --- Navigationsliste (in Boxareas etwa) --------------------------------------------- */

.pf_formNavigationList .leven,
.pf_formNavigationList .lodd {
  background: transparent;
}

.pf_formNavigationList tr[onclick]:hover,
table.listbody tr.LActive,
.hoverme:hover {
  background: var(--color-default-hover);
}

.pf_formNavigationList table.listbody {
  table-layout: fixed;
}

.nobrellipsis {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.pf_formNavigationList table.listbody th,
.pf_formNavigationList table.listbody td.l {
  height: var(--height-toolbar);
  padding: 1px 4px 1px 4px;
  vertical-align: middle;
}
.pf_formNavigationList col.actionColumn {
  width: 20px;
}
.pf_formNavigationList table.listbody .jmlTableRows td.treestructure {
  padding: 1px 1px 1px 2px;
}

.pf_formNavigationList table.listbody .jmlTableRows td.iaall {
  padding-left: 0;
  padding-right: 0;
}

.pf_formNavigationList .jmlTableRows {
  border: none;
}

.pf_formNavigationList table.listbody td.l {
  border: none;
  box-shadow: none;
}

.pf_formNavigationList table.listbody td.smallinputright {
  text-align: right;
  font: var(--font-small);
  white-space: nowrap;
}

.pf_formNavigationList .small {
  line-height: 9px;
  font: var(--font-small);
}

.pf_formNavigationList td:first-child fp-inline-svg,
.pf_formNavigationList td:first-child img,
.pf_formNavigationList .treestructureIcon .treeNodeImage {
  vertical-align: middle;
  --icon-size: 20px;
  height: var(--icon-size);
  width: var(--icon-size);
}

.pf_formNavigationListBig td:first-child fp-inline-svg,
.pf_formNavigationListBig .treestructureIcon .treeNodeImage {
  --icon-size: 32px;
}

.pf_formNavigationList h1 {
  font-size: 12px;
  font-weight: bold;
  margin: 2px 0 2px 0;
  /*line-height: 10px;*/
}
.pf_formNavigationList .listbody col.jmlTreeCol {
  width: 16px;
}

.pf_formNavigationList .listbody .jmlTableRows td.l.treestructurecaption {
  padding-left: 16px;
}


/* --- Ende Navigationsliste --------------------------------------------- */


/* --------------- Dialogkomponenten ---------- */

div.jml_dialogButtons {flex: 1;}

div.jml_dialogChangeInfo {
  text-align: right;
  font: var(--font-small);
  color: currentColor;
  overflow: visible;
  opacity: 0.75;
  transition: opacity 200ms;
}

div.jml_dialogChangeInfo:hover {
  opacity: 1;
}

.buttonarea div.jml_dialogChangeInfo{
  display: inline-block;
  padding: 2px 0 2px 8px;
}


div.jml_dialogChangeInfo fp-inline-svg{
  --icon-size: 20px;
  height: 20px;
  width: 20px;
}

.ajaxfieldeditor div.jml_dialogChangeInfo {
  position: absolute;
  right: 0;
  bottom: 0;
}

div.jml_dialogChangeInfo img {
  margin: 0 1px -1px 1px;
}

.td_head_center {
  width: 204px;
  font-size: 14px;
  font-weight: bold;
  color: #AB3A44;
}

.space_vertical {
  width: 17px;
}

li {
  text-align: left;
  padding: 0;
  margin: 0;
}

span.errorhint {
  color: #C00000;
  font-size: 10px;
  font-style: normal;
}

#dialog div.globalerrorhint,
#report div.globalerrorhint,
#dialogForm div.globalerrorhint {
  color: #C00000;
  font-size: 12px;
  font-style: italic;
  padding: 4px 0;
}

div.erroricon {
  position: relative;
  width: 0;
  height: 0;
}

span.error,
span.smallerror {
  color: #C00000;
}

div.error {
  color: #C00000;
  background-color: #EFD6C6;
}

span.small,
p.small {
  font: var(--font-small);
  font-style: normal;
}

span.smallhint,
p.smallhint {
  font: var(--font-small);
  font-style: normal;
  color: var(--color-shade-none-contrast); /* eine leicht abgeschwächte textfarbe */
}

span.big,
p.big {
  font: var(--font-medium);
  line-height: 1.1;
}

span.bighint,
p.bighint {
  font: var(--font-medium);
  line-height: 1.1;
  font-weight: bold;
  color: var(--color-primary);
}

p.smallhint,
p.small {
  margin: 0;
  padding: 0;
  --icon-size: 12px;
}
.smallhint fp-inline-svg,
.smallhint > svg,
.smallhint > img,
p.small fp-inline-svg,
p.small > img {
  max-height: 12px;
  max-width: 16px;
  width: auto;
}

p.smallhint.img {
  padding-left: 18px;
}

p.smallhint.img>img {
  width: 16px;
  height: 16px;
  max-height: 16px;
  object-fit: contain;
  margin-left: -17px;
}

span.normal {
  font-size: 11px;
  font-style: normal;
  font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
  font-weight: normal;
  color: #000;
}

span.contentassistcode {
  font-size: 10px;
  font-style: normal;
  font-family: monospace;
}

span.ticketInfo {
  font-size: 11px;
  font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
  color: var(--color-main-font);
}


/* --- Finanzartikel Preshow ------------------------ */

.card_financearticle .header {
  display: inline-block;
}


/* --- Projekt Preshow ------------------------ */

.visitenkarte img.ps_entityicon {
  width: 16px;
  height: 16px;
}


/* --- CRM Preshow ------------------------ */

.visitenkarte span.ps_crmpos {
  font: var(--font-small);
  font-style: normal;
  line-height: 10px;
  white-space: nowrap;
  overflow: hidden;
  width: 236px;
  display: inline-block;
}


/* --- Filter --------------------------------- */

#filter input.dateswitcher {
  width: 60px;
  font-size: 8pt;
  font-weight: normal;
  text-align: left;
  padding-left: 6px;
  padding-right: 6px;
  margin-right: 10px;
  height: 16px;
  color: #003366;
  border-style: solid;
  border-width: 1px;
  border-top-color: #D0DCEA;
  border-left-color: #D0DCEA;
  border-bottom-color: #DEE6F0;
  border-right-color: #DEE6F0;
  background-color: white;
}


/* --- Liste --------------------------------- */



/*zieht imgs kuenstlich nach unten, damit diese innerhalb der textzeile bleiben*/

img.intextline {
  margin-bottom: -4px;
  max-height: 16px;
  max-width: 16px;
}

img.valignmiddle {
  vertical-align: middle;
}

table.listbody a:hover {
  cursor: pointer;
}

div.listheadertitle img {
  vertical-align: text-top;
}

div.listheaderquickfilter {
  /* In diesem Div befindet sich die QF-Tabelle und der ClickCatcher*/
  float: right;
  position: relative;
}



table.listbody td.iaall {
  padding-left: 2px;
  padding-right: 15px;
  white-space: nowrap;
  text-align: right;
  --icon-size: 20px;
}

tr.hoverme {
  cursor: pointer;
}

table.listbody td.treestructureroot,
table.listbody td.treestructurenode,
table.listbody td.treestructureorphannode,
table.listbody td.treestructureleaf,
table.listbody td.treestructurechild,
table.listbody td.treestructureorphanleaf,
table.listbody td.treestructurelastChild,
table.listbody td.treestructurelastChild2,
table.listbody td.treestructurecollapsed,
table.listbody td.treestructureline,
table.listbody td.treestructureempty {
  text-align: center;
  vertical-align: middle;
  border-right: 0 none;
  width: 20px;
}

table.listbody td.l.treestructure,
.jml_formList table.listbody td.l.treestructure {
  background: no-repeat center center;
  padding: 0 0 0 4px;
  /* abgelehnt padding: 5px 0 5px 5px; */
}

.listbody col.jmlTreeCol {
  width: 24px;
}

.jml_formList table.listbody td.l.treestructurecaption {
  padding-left: 6px;
  padding-top: 2px;
  padding-bottom: 2px;
}


table.listbody td.treestructureroot {}

table.listbody td.treestructurenode {}

table.listbody td.treestructureleaf {
  width: 32px;
}

table.listbody td.treestructureorphannode {
  width: 25px;
  padding-left: 4px;
}

table.listbody td.treestructureorphanleaf {
  width: 25px;
  padding-left: 4px;
}

table.listbody td.treestructurechild {}

table.listbody td.treestructurelastChild {}

table.listbody td.treestructurelastChild2 {}

table.listbody td.treestructurecollapsed {}

table.listbody td.treestructureline {}

.jmlTreeExpander {
  height: 32px;
  width: 14px;
  margin-right: 2px;
  display: inline-block;
  line-height: 32px;
  text-align: center;
  font-size: 30px;
  color: rgba(0, 0, 0, 0.5);
  font-weight: bold;
  position: relative;
}

.pageReady .jmlTreeExpander .arrow,
.pageReady .jmlTreeExpander .number {
  opacity: 0.5;
  transition: opacity 200ms;
}

.jmlTreeExpander .number {
  opacity: 0;
  transition-delay: 1000ms;
  font-size: 12px;
  line-height: 14px;
  display: inline-block;
  padding: 2px;
  border-radius: 3px;
  position: absolute;
  right: 16px;
  background-color: var(--color-card-background);
  text-shadow: 0 0 2px #FFF;
}

table.listbody td.treestructureExpander:hover .jmlTreeExpander .arrow,
table.listbody td.treestructureExpander:hover .jmlTreeExpander .number {
  opacity: 1;
}

.jmlTreeExpander .arrow {
  display: inline-block;
  width: 16px;
  height: 16px;
  transition: transform 250ms;
  background: no-repeat center center;
  background-image: url(../css/embed/treeexpander.svg);
  background-size: 12px;
}

table.listbody td.treestructureExpander:hover .jmlTreeExpanderCollapsed .arrow {
  transform: rotate(15deg);
}

.jmlTreeExpanderExpanded .arrow {
  transform: rotate(90deg);
}

table.listbody td.treestructureExpander:hover .jmlTreeExpanderExpanded .arrow {
  transform: rotate(75deg);
}

.treestructure img.treeNodeImage {
  vertical-align: middle;
}

.jml_formList table.listbody td.l.treestructureIcon,
table.listbody td.l.treestructureIcon {
  overflow: visible;
  text-align: right;
  padding-top: 4px;
  padding-bottom: 4px;
}

.pf_formNavigationList table.listbody td.l.treestructureIcon {
  padding-top: 2px;
  padding-bottom: 2px;
}

table.listbody td.treestructureExpander {
  text-align: right;
}

table.listbody td.treestructureIcon>.jmlImageContainer {
  margin-left: 0;
}

table.listbody td.treestructurecaption {
  text-overflow: ellipsis;
  overflow: hidden;
}


/* ----------- QuickSearch ---------------------*/

.searching {
  background: url(../form/base/loading18.gif) no-repeat left center;
}


/* -----------   multiitemactionarea  ---------------*/

div.buttonarea {
  padding: var(--width-componentspacing);
  text-align: left;
  display: flex;
  flex-direction: row;
  justify-content: stretch;
}

div.multiitemactionarea {
  margin-left: -1px;
  margin-right: -1px;
  margin-bottom: -1px;
  position: relative;
  background-color: var(--color-card-background);
}

div.multiitemactionarea {
  position: relative;
  text-align: left;
  background-color: var(--color-card-background);
  width: 360px;
}

.miController {
  background-color: var(--color-card-background);
}

.miControllerHidden {
  display: none;
}

div.multiitemactionarea.elevated {
  z-index: 1000;
  box-shadow: 0 1px 6px 1px rgba(0, 0, 0, 0.25);
  border: 0 none;
}

div.multiitemactionarea .miController h1 {
  line-height: 30px;
  color: white;
  margin: 0 0 10px 0;
  padding-left: 8px;
  cursor: move;
}

div.multiitemactionarea .miController .jml_miAdditionalFieldsPopup {
  margin-left: auto;
  margin-right: 50px;
}

div.multiitemactionarea .miController .jml_miAdditionalFieldsPopup,
div.multiitemactionarea .miController .miButtons {
  padding: 8px;
  text-align: right;
}

.miControllerCounterText {
  font-weight: bold;
  color: var(--color-main-font);
}

div.multiitemactionarea select {
  width: auto;
}

div.multiitemactionarea .jml_miAdditionalFieldsPopup {
  white-space: normal;
}

div.multiitemboxanchor {
  z-index: 998;
  overflow: visible;
  width: 100%;
  height: 1px;
  position: absolute;
  top: 0;
  left: 0;
}

div.hiddenmultiitembox {
  position: absolute;
  z-index: 1000;
  width: 100%;
  text-align: justify;
  white-space: normal;
  background-color: white;
  border: 1px solid black;
  padding: 4px;
  left: -2px;
  bottom: -30px;
}

.jml_miAdditionalFieldsPopup {
  margin-top: 3px;
  max-width: 300px;
  min-width: 200px;
}

.jml_miAdditionalFieldsPopup label {
  margin-right: 3px;
}

.jml_miAdditionalFieldsPopup td {
  padding-bottom: 2px;
}

.jml_miAdditionalFieldsPopup fp-field.comboboxplus {
  width: 160px;
}

/* Drag&Drop Datei-Upload */

div#dndUploadDivBAS div.outerDropArea {
  opacity: 0;
  position: fixed;
  top: 50%;
  left: 50%;
  height: 0;
  width: 0;
  transition: all 0.25s ease-in-out;
  z-index: 5;
}

.dj_ie div#dndUploadDivBAS div.outerDropArea {
  opacity: 1;
  position: relative;
  top: 0;
  left: 0;
  height: auto;
  width: auto;
}

div#dndUploadDivBAS div.outerDropArea div.loader {
  display: none;
  position: absolute;
  height: 128px;
  width: 128px;
  background-image: url(../detailmanager/config/back.svg);
  background-size: 128px;
  top: 50%;
  left: 50%;
  margin-top: -64px;
  margin-left: -64px;
}

div#dndUploadDivBAS div.outerDropArea div.loader.show {
  display: block;
}

div#dndUploadDivBAS div.dropArea {
  background-color: #FEFEFE;
  height: 100%;
  border: 4px lightgrey dashed;
}

.dj_ie div#dndUploadDivBAS div.dropArea {
  height: 140px;
  width: 240px;
}

div.fileUploadWindow div.dropArea {
  margin-top: 10px;
  height: 160px;
  border: 4px lightgrey dashed;
}

div#dndUploadDivBAS div.outerDropArea.dragging,
div#dndUploadDivBAS div.outerDropArea.over {
  top: 10%;
  left: 10%;
  height: 80%;
  width: 80%;
  opacity: 0.8;
}

body.fileupload .dijitTabContainer {
  z-index: 1000 !important;
}

.dj_ie div#dndUploadDivBAS div.outerDropArea.dragging,
.dj_ie div#dndUploadDivBAS div.outerDropArea.over {
  top: 0;
  left: 0;
  height: auto;
  width: auto;
  opacity: 1;
}

.dj_ie div#dndUploadDivBAS div.outerDropArea.dragging div.dropArea {
  border: 4px darkgrey dashed;
}

div.fileUploadWindow div.outerDropArea.dragging div.dropArea {
  border: 4px darkgrey dashed;
}

.dj_ie div#dndUploadDivBAS div.outerDropArea.over div.dropArea.over,
div#dndUploadDivBAS div.dropArea.over,
div.fileUploadWindow div.dropArea.over {
  border: 4px grey dashed;
}

div#manualUploadDiv,
div#manualUploadDivBAS {
  text-align: center;
  vertical-align: text-bottom;
}

div#dndUploadDivBAS div.dojoxUploaderFileList,
div.fileUploadWindow div.dojoxUploaderFileList {
  height: 18px;
}

div#dndUploadDivBAS div.dojoxUploaderFileListProgressBar,
div.fileUploadWindow div.dojoxUploaderFileListProgressBar {
  margin-top: 2px;
  height: 5px;
  background-color: var(--color-primary);
}

div#dndUploadDivBAS table.dojoxUploaderFileListTable,
div.fileUploadWindow table.dojoxUploaderFileListTable {
  display: none;
}

div#manualUploadDiv form,
div#manualUploadDivBAS form {
  vertical-align: middle;
  margin-top: 10px;
}

.filepathnavi {
  display: block;
  padding-right: 32px;
  position: relative;
  line-height: 24px;
  height: 24px;
  overflow: hidden;
  text-overflow: ellipsis;
}

.listcontrol.jmlListLocation {
  display: inline-block;
}

.jmlListLocation .filepathnavi {
  font: var(--font-medium);
}
.jmlListLocation .filepathnavi fp-inline-svg{
  height: 24px; width: 24px;
  vertical-align: text-bottom;
}

.filepathnavi .jmlImageContainer {
  vertical-align: text-top;
}

.jmlListheadertitle .actioneaoverview {
  position: absolute;
  top: -2px;
  right: 0;
}


/* Dialogzelle Header */

.dialog td.label.areaheader {
  color: var(--color-card-header);
}

.jml_formDialog .buttonarea .jml_dialogButtons .jml_formList .buttonarea .buttons,
.jml_formList .buttonarea .buttons {
  height: 25px;
}

.quickCreate .jml_dialogButtons {
  background: transparent;
  border: 0 none;
}


/* ------------------- Q U I C K F I L T E R -------------------  */

div.tmplControlBar {
  background: var(--color-quickfilter-back);
  color: var(--color-quickfilter-font);
  display: flex;
  align-items: center;
}

div.tmplControlBarNotEmpty {
  padding: 12px 10px;
  height: var(--height-toolbar);
  box-sizing: border-box;
  /* Mindestgroeße, falls nicht leer - achtung, kannauch mal in der Sidebar erscheinen */
  min-width: 300px;
  display: flex;
  flex: 0;
  align-items: center;
  justify-content: space-between;
  --icon-size: 16px;
}

.boxarea div.tmplControlBarNotEmpty {
  min-width: 100px;
}

.qfbuttonline {
  display: flex;
  align-items: center;
  height: 24px;
  text-align: left;
  border: none;
  overflow: hidden;
  flex-shrink: 0;
}
.qfbuttonline.search {
  flex-grow: 1;
  flex-shrink: 1;
  justify-content: flex-end;
}



fp-inline-svg.qfbuttonlineextender {
  width: var(--icon-size, 32px);
  height: var(--icon-size, 32px);
  cursor: pointer;
}

/* span.qfbuttonlineextender::before {
  content: '▼';
  color: currentColor;
} */

.tmplControlBar .actions {
  margin: 0;
  padding-left: 0;
  height: 24px;
  text-align: right;
  overflow: visible;
  justify-content: flex-end;
}

.tmplControlBar .actions > svg,
.tmplControlBar .qfbuttonline > pf-parent-css-toggle,
.tmplControlBar .search > fp-inline-svg,
.tmplControlBar .actions > fp-inline-svg {
  cursor: pointer;
  height: var(--icon-size, 32px);
  width: var(--icon-size, 32px);
  padding: 0 3px;
}

.tmplControlBar .actions > pf-parent-css-toggle fp-inline-svg{
  height: var(--icon-size, 32px);
  width: var(--icon-size, 32px);
}

.qfbuttonline a.qfbuttonlinebuttonactive,
.tmplControlBar .qfbuttonline > .active,
.tmplControlBar .qfbuttonline > pf-parent-css-toggle.listheader-switcher.normal,
.tmplControlBar .qfbuttonline > pf-parent-css-toggle.fullscreen-switcher.fullscreen{
  color: var(--color-accent);
  /*filter: drop-shadow(0 0 6px var(--color-accent-contrast));*/
}

.qfbuttonline fp-inline-svg, .QFDropdown fp-inline-svg,
.qfbuttonline svg, .QFDropdown svg{
}

.bmlfQuickSearch {
  padding: 0 0 0 12px;
}
.bmlfQuickSearch fp-field{
  min-width:100px;
}

.qfbuttonline a.qfbuttonlinebutton {
  cursor: pointer;
  padding: 4px;
}

ul.QFDropdown {
  padding: 10px 0;
  margin: 0;
}

.tundra .qfpopup .dijitTooltipContainer {
  background: #FFF;
  /* Old browsers */
}

ul.QFDropdown li.emptyseparator,
ul.QFDropdown li.separator {
  font-weight: bold;
  opacity: 1;
}

ul.QFDropdown li {
  list-style: none;
  width: 100%;
}

ul.QFDropdown li a,
ul.QFDropdown li>span {
  padding: 4px 8px;
  font-size: 13px;
  display: inline-block;
  width: 100%;
  box-sizing: border-box;
}

ul.QFDropdown li.selectable:hover {
  background-color: var(--color-default-hover);
  opacity: 1;
}

ul.QFDropdown li.selectable.selected {
  opacity: 1;
}

ul.QFDropdown li .jmlImageContainer img,
ul.QFDropdown li fp-inline-svg.jmlImageContainer {
  vertical-align: middle;
  width:24px;
  height:24px;
}

ul.QFDropdown li .jmlImageContainer {
  padding: 0px 5px 0px 0px;
  line-height: 24px;
}

ul.QFDropdown li.emptyseparator {
  min-height: 4px;
  line-height: 4px;
  font-size: 4px;
  opacity: 1;
}

ul.QFDropdown li.separator {
  padding-top: 2px;
  white-space: nowrap;
  width: auto;
}

ul.QFDropdown li.separator:first-child {
  padding-top: 0px;
}

ul.QFDropdown a,
ul.QFDropdown span.nav {
  white-space: nowrap;
  cursor: pointer;
}

.qfbuttonline .qfbuttonlinebar,
.qfbuttonline .qfbuttonlineseparator,
.tmplListControlButtons .controlButtonSeparator {
  font-size: 6px;
  background-color: currentColor;
  width: 1px;
}

.qfbuttonline .jmlImageContainer {
  --icon-size: 16px;
  width: var(--icon-size);
  height: var(--icon-size);
}
.qfbuttonline.quickfilter .jmlImageContainer {
  --icon-size: 16px;
  width: var(--icon-size);
  height: var(--icon-size);
}
.qfbuttonline.search > .jmlImageContainer {
  --icon-size: 24px;
  width: var(--icon-size);
  height: var(--icon-size);
}
.qfbuttonline.actions pf-parent-css-toggle,
.qfbuttonline.actions .jmlImageContainer {
  --icon-size: 24px;
  width: var(--icon-size);
  height: var(--icon-size);
}

.qfbuttonline.actions .primary-actions {
  color: var(--color-accent);
}

.tmplListControlAreaPageContent .content .filterarea .filterbutton,
.tmplListControlAreaPageContent .content .filterarea .filterfields {
  padding: 10px 10px 10px 10px;
}
.filterbutton{
  border-top: solid 1px var(--color-default-border);
  box-sizing: border-box;
  height: 50px;
}

.filterbutton > button, .filterbutton > input{
  margin-right: var(--width-componentspacing);
}

.tmplListControlAreaPageContent .content .filterarea .filterfields {
  max-height: 50vh;
  overflow: auto;
}

fp-dialog .filterarea {
  height: 100%;
}

fp-dialog fp-tab-container.filtertabs {
  min-height: calc(100% - 50px);
}

fp-dialog {
  max-height: 100vh;
  max-width: 100vh;
}

fp-dialog pf-dialog-view {
  height: 100%;
  width: 100%;
}

fp-dialog fp-parent-resizeable {
  position: absolute;
  right: 0px;
  bottom: 0px;
  z-index: 100;
}

fp-dialog fp-parent-resizeable button {
  display: none;
}

body.mouse-user fp-dialog:not([mode=fullscreen]) fp-parent-resizeable button {
  display: inline-block;
  background: transparent;
  height: 16px;
  width: 16px;
  transform: translate3d(8px, 8px, 0);
}

@media (min-width: 600px) {
  fp-dialog {
    max-width: 80vw;
    max-height: 80vh;
  }
  fp-dialog.filterarea {
    max-width: 50vw;
    max-height: 50vh;
  }

  fp-dialog[fullscreen] {
    max-height: 100vh;
    max-width: 100vh;
  }

  fp-dialog .jml_formDialog {
    min-width: 400px;
  }

  fp-dialog .jml_formDialog > .groups {
    min-height: 120px;
  }
}

.jml_formFilter > fp-tab-container {
  --bar-color: var(--color-toolbar-font);
  --bar-background: var(--color-toolbar-back);
}

fp-modal .tmplListControlAreaPageContent .content .filterarea .filterfields{
  max-height:320px;
}

.tundra .dijitContentPane {
  overflow: visible;
}

fp-dialog .filterfields {
  padding: var(--width-componentspacing);
  /*max-width: 90vw;*/
  /*max-height: 90vh;*/
  /*overflow: auto;*/
}

fp-dialog .filterbutton {
  padding: var(--width-componentspacing);
  white-space: nowrap;
}

.jmlFilterGroupHeader {
  height: 25px;
  vertical-align: top;
  text-align: left;
}

.jmlFilterGroup,
.legendgroup {
  display: inline-block;
  margin: 5px 30px 20px 0;
  vertical-align: top;
}

.jmlFilterGroup .jmlFilterGroupHeader th,
.legendgroup h1 {
  font-size: 13px;
  font-weight: bold;
  margin: 0;
}

.jmlFilterGroupHeader th:not(:empty):after {content: "";border-bottom: solid 1px var(--color-default-border);display: block; margin: 4px 0 2px 0;}

.jmlFilterGroup td.f {
  width: 130px;
  padding: 2px 0;
}

.jmlFilterGroup td.f.label {
  width: 110px;
  padding: 0 8px 0 0;
  font: var(--font-input-label);
  text-align: right;
}

.jmlFilterGroup td.f2 {
  width: 200px;
  padding: 2px;
}

.zu-allgemeine-regel .jmlFilterGroup td.f img,
.jmlFilterGroup td.f2 img {
  vertical-align: bottom;
  margin-left: 2px;
}

.jmlFilterGroup td.label {
  text-align: left;
  min-width: 60px;
}


.tmplListControlArea {
  overflow: hidden;
  margin-left: -4px;
  padding-left: 4px;
  margin-right: -4px;
  padding-right: 4px;
  border: 0px;
  border-top: 0px;
}

.tmplListControlArea {
}

.tmplListControlAreaPage {
  background: var(--color-card-background);
  color: var(--color-card-font);
  padding: 10px 0 0;
}

.tmplListControlArea .tmplListControlAreaPage {
  position: relative;
  margin-bottom: 8px;
  box-shadow: var(--shadow-cards);
}

.tmplListControlArea .controlTitle {
}

.tmplListControlArea .controlTitle .title {
  color: var(--color-card-header);
  font: var(--font-large);
  line-height: 1.2;
  margin: 10px;
}

.jml-tree-navigator {
  display: inline-flex;
  flex-direction: row;
  /*align-items: baseline;*/
  /*border: var(--border-input);*/
  font: var(--font-small);
  line-height: 16px;
}

.jml-tree-navigator .path-item {
  padding: 1px 6px;
  margin: 0 2px;
  flex-shrink: 2;
  overflow: hidden;
}
.jml-tree-navigator .path-item.current-item {
  font-weight: bold;
}
.jml-tree-navigator .path-item:first-child{
  flex-shrink: 1;
}
.jml-tree-navigator .path-item.current-item,
.jml-tree-navigator .path-item:last-child{
  flex-shrink: 0;
}

.jml-tree-navigator .child-selector {
  font: var(--font-large);
  padding-top: 0;
  margin: 0;
  line-height: 16px;
}

.jml-tree-navigator .sibling-item {
  padding: 2px;
  cursor: pointer;
}
.jml-tree-navigator .sibling-item:hover {
  background: var(--color-default-hover);
}

.jml-tree-navigator .sibling-item.selected {
  font-weight: bold;
}

.jml-tree-navigator .child-selector:hover,
.jml-tree-navigator .path-item[onclick]:hover {
  cursor: pointer;
  box-shadow: var(--shadow-button-raised);
}

.jml-tree-navigator .path-item:not([disabled]) {
  cursor: pointer;
}