/* --- REGEL 1 --- */
body.layout-compact,
body.layout-compact .layout-wrapper .ui-widget-content,
body.layout-compact .layout-wrapper .ui-inputfield,
body.layout-compact .layout-wrapper .ultima-menu li ul li a,
body.layout-compact .layout-wrapper .ui-paginator-current,
body.layout-compact .layout-wrapper .ui-paginator-current:after,
body.layout-compact .layout-wrapper .ui-button,
body.layout-compact .ui-widget-header,
.twoLineTabsExcludeFirst > .ui-tabs-nav > .ui-tabs-header:not(:first-child) > a::first-line,
.twoLineTabsExcludeFirst > .ui-tabs-nav > .ui-tabs-header:first-child > a,
.twoLineTabs > .ui-tabs-nav > .ui-tabs-header > a::first-line {
    /* Skaliert von 11px (bei 320px Breite) bis 13.5px (bei 1600px Breite) */
    font-size: clamp(11px, calc(11px + 2.5 * ((100vw - 320px) / 1280)), 13.5px) !important;
}

/* --- REGEL 2 --- */
body.layout-compact .layout-wrapper .layout-rightpanel .layout-rightpanel-header .layout-rightpanel-header-title {
    /* Skaliert von 20px (bei 320px Breite) bis 23.5px (bei 1600px Breite) */
    font-size: clamp(20px, calc(20px + 3.5 * ((100vw - 320px) / 1280)), 23.5px) !important;
}

/* --- REGEL 3 --- */
body.layout-compact .layout-wrapper .vertragSelectTopbar .ui-selectonemenu .ui-selectonemenu-label {
    /* Skaliert von 11px (bei 320px Breite) bis 15.5px (bei 1600px Breite) */
    font-size: clamp(11px, calc(11px + 4.5 * ((100vw - 320px) / 1280)), 15.5px) !important;
}

/* --- REGEL 4 --- */
body.layout-compact .layout-wrapper .ui-dialog .ui-dialog-titlebar {
    /* Skaliert von 14px (bei 320px Breite) bis 17.5px (bei 1600px Breite) */
    font-size: clamp(14px, calc(14px + 3.5 * ((100vw - 320px) / 1280)), 17.5px) !important;
}

/* --- REGEL 5 --- */
body.layout-compact .layout-wrapper .ui-outputlabel,
body.layout-compact .ui-selectonemenu-panel .ui-selectonemenu-item {
    /* Skaliert von 10px (bei 320px Breite) bis 12.5px (bei 1600px Breite) */
    font-size: clamp(10px, calc(10px + 2.5 * ((100vw - 320px) / 1280)), 12.5px) !important;
}

/* --- REGEL 6 (Padding) --- */
.smallLineFieldset {
    /* Skaliert von 0px (bei 320px Breite) bis 10px (bei 1600px Breite) */
    padding-left: clamp(0px, calc(10 * ((100vw - 320px) / 1280)), 10px) !important;
}

/* --- REGEL 7 --- */
body.layout-compact .layout-wrapper .card h1 {
    /* Skaliert von 18px (bei 320px Breite) bis 21.5px (bei 1600px Breite) */
    font-size: clamp(18px, calc(18px + 3.5 * ((100vw - 320px) / 1280)), 21.5px) !important;
}

body.layout-compact .ui-dialog-content {
    padding-top: 0;
    padding-bottom: 0;
}

body.layout-compact .layout-wrapper .ui-dialog.ui-shadow {
    box-shadow: 1.4px 1.4px 2.2px rgba(0, 0, 0, 0.056),
    3.3px 3.3px 5.3px rgba(0, 0, 0, 0.081),
    6.3px 6.3px 10px rgba(0, 0, 0, 0.1),
    11.2px 11.2px 17.9px rgba(0, 0, 0, 0.119),
    20.9px 20.9px 33.4px rgba(0, 0, 0, 0.144),
    50px 50px 80px rgba(0, 0, 0, 0.2);

    -webkit-box-shadow: 1.4px 1.4px 2.2px rgba(0, 0, 0, 0.056),
    3.3px 3.3px 5.3px rgba(0, 0, 0, 0.081),
    6.3px 6.3px 10px rgba(0, 0, 0, 0.1),
    11.2px 11.2px 17.9px rgba(0, 0, 0, 0.119),
    20.9px 20.9px 33.4px rgba(0, 0, 0, 0.144),
    50px 50px 80px rgba(0, 0, 0, 0.2);
    /*https://shadows.brumm.af/*/
}

* {
    -moz-box-sizing: revert;
    -webkit-box-sizing: revert;
    box-sizing: revert;
}

.layout-compact .layout-wrapper .ui-state-active {
    outline: none;
}

.layout-rightpanel-header {
    position: sticky;
    top: 0px;
    z-index: 2;
}

.layout-rightpanel .layout-rightpanel-header {
    background-image: none;
    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.2), 0 1px 1px 0 rgba(0, 0, 0, 0.14), 0 2px 1px -1px rgba(0, 0, 0, 0.12);
    -webkit-box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.2), 0 1px 1px 0 rgba(0, 0, 0, 0.14), 0 2px 1px -1px rgba(0, 0, 0, 0.12);
    -moz-box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.2), 0 1px 1px 0 rgba(0, 0, 0, 0.14), 0 2px 1px -1px rgba(0, 0, 0, 0.12);
    -moz-border-radius: 2px;
    -webkit-border-radius: 2px;
    border-radius: 2px;
    background-color: #424242;
    height: 50px;
    color: white;
}

.layout-wrapper .layout-rightpanel {
    position: fixed;
    top: 75px;
    height: 100%;
    right: calc((100% - 250px) * -1);
    width: calc(100% - 250px);
    z-index: 10;
    background-color: #ffffff;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    -moz-transition: right 1.0s;
    -o-transition: right 1.0s;
    -webkit-transition: right 1.0s;
    transition: right 1.0s;
}

body .layout-wrapper .layout-rightpanel.layout-rightpanel-active {
    -webkit-box-shadow: 0 2px 20px 2px rgba(0, 0, 0, 0.8);
    -moz-box-shadow: 0 2px 20px 2px rgba(0, 0, 0, 0.8);
    box-shadow: 0 2px 20px 2px rgba(0, 0, 0, 0.8);
}

.runningJobSidebarBtn {
    position: absolute;
    right: 60px;
    top: 21px;
    z-index: 100;
}

.ui-sidebar-right {
    width: calc(100vw - 250px);
    min-width: 600px;
}

@media only screen and (max-width: 1024px) {

    .ui-sidebar-right {
        width: calc(100vw);
        min-width: 600px;
    }

    .runningJobSidebarBtn {
        position: absolute;
        right: 30px;
        top: 21px;
        z-index: 100;
    }

    .layout-wrapper .layout-rightpanel {
        right: -100%;
        width: 100%;
    }


}

body .layout-wrapper .btnCol {
    width: 30px;
    text-overflow: unset !important;
    text-align: center;
}

body .layout-wrapper th.btnCol {
    text-align: center;
}

body .layout-wrapper .iconCol {
    width: 25px;
    text-overflow: unset !important;
    text-align: center;
}

body .layout-wrapper .p20Col {
    width: 40px;
    text-overflow: unset !important;
    text-align: center;
    margin: 0;
}

body .layout-wrapper .p40Col {
    width: 40px;
    text-overflow: unset !important;
    text-align: center;
}

body .layout-wrapper .p45Col {
    width: 45px;
    text-overflow: unset !important;
    text-align: center;
}

body .layout-wrapper .p50Col {
    width: 50px;
    text-overflow: unset !important;
    text-align: center;
}

body .layout-wrapper .p60Col {
    width: 60px;
    text-overflow: unset !important;
    text-align: center;
}

body .layout-wrapper .p60ColRight {
    width: 60px;
    text-overflow: unset !important;
}

body .layout-wrapper .ui-datatable-data .p60ColRight {
    text-align: right;
}

body .layout-wrapper .p70Col {
    width: 70px;
    text-overflow: unset !important;
    text-align: center;
    margin: 0;
}

body .layout-wrapper .p80Col {
    width: 80px;
    text-overflow: unset !important;
    text-align: center;
}

body .layout-wrapper .centerCol {
    text-align: center;
}

body .layout-wrapper .p80ColLeft, body .layout-wrapper .p80ColRight {
    width: 80px;
    text-overflow: unset !important;
}

body .layout-wrapper .ui-datatable-data .p80ColLeft {
    text-align: left;
}

body .layout-wrapper .ui-datatable-data .p80ColRight {
    text-align: right;
}

body .layout-wrapper .p90ColLeft, body .layout-wrapper .p90ColRight {
    width: 90px;
    text-overflow: unset !important;
}

body .layout-wrapper .ui-datatable-data .p90ColLeft {
    text-align: left;
}

body .layout-wrapper .ui-datatable-data .p90ColRight {
    text-align: right;
}

body .layout-wrapper .p100ColLeft, body .layout-wrapper .p100ColRight {
    width: calc(70px + (100 - 80) * ((100vw - 320px) / (1600 - 320))) !important;
    /*width         : 100px;*/
    text-overflow: unset !important;
}

body .layout-wrapper .ui-datatable-data .p100ColLeft {
    text-align: left;
}

body .layout-wrapper .ui-datatable-data .p100ColRight {
    text-align: right;
}

body .layout-wrapper .p100Col, body .layout-wrapper .dateCol {
    width: calc(70px + (100 - 70) * ((100vw - 320px) / (1600 - 320))) !important;
    text-overflow: unset !important;
    text-align: center;
}

body .layout-wrapper .p110Col {
    width: calc(80px + (110 - 80) * ((100vw - 320px) / (1600 - 320))) !important;
    text-overflow: unset !important;
    text-align: center;
}

body .layout-wrapper .ui-datatable-data .p80MinColLeft {
    text-align: left;
}

body .layout-wrapper .p110ColLeft, body .layout-wrapper .p110ColRight {
    width: calc(80px + (110 - 80) * ((100vw - 320px) / (1600 - 320))) !important;
    text-overflow: unset !important;
}

body .layout-wrapper .ui-datatable-data .p110ColLeft {
    text-align: left;
}

body .layout-wrapper .ui-datatable-data .p110ColRight {
    text-align: right;
}

body .layout-wrapper .p120Col {
    width: calc(90px + (120 - 90) * ((100vw - 320px) / (1600 - 320))) !important;
    text-overflow: unset !important;
    text-align: center;
}

body .layout-wrapper .p130Col {
    width: calc(100px + (130 - 100) * ((100vw - 320px) / (1600 - 320))) !important;
    text-overflow: unset !important;
    text-align: center;
}

body .layout-wrapper .p130ColLeft {
    width: calc(100px + (130 - 100) * ((100vw - 320px) / (1600 - 320))) !important;
    text-overflow: unset !important;
}

body .layout-wrapper .ui-datatable-data .p130ColLeft {
    text-align: left;
}

body .layout-wrapper .p130ColRight {
    width: calc(100px + (130 - 100) * ((100vw - 320px) / (1600 - 320))) !important;
    text-overflow: unset !important;
}

body .layout-wrapper .ui-datatable-data .p130ColRight {
    text-align: right;
}

body .layout-wrapper .p140ColLeft {
    width: calc(110px + (140 - 110) * ((100vw - 320px) / (1600 - 320))) !important;
    text-overflow: unset !important;
}

body .layout-wrapper .ui-datatable-data .p140ColLeft {
    text-align: left;
}

body .layout-wrapper .p150Col {
    width: calc(120px + (150 - 120) * ((100vw - 320px) / (1600 - 320))) !important;
    text-overflow: unset !important;
    text-align: center;
}

body .layout-wrapper .p150ColRight {
    width: calc(120px + (150 - 120) * ((100vw - 320px) / (1600 - 320))) !important;
    text-overflow: unset !important;
}

body .layout-wrapper .ui-datatable-data .p150ColRight {
    text-align: right;
}

body .layout-wrapper .p150Col .ui-toggleswitch {
    text-align: initial
}

body .layout-wrapper .p180ColLeft {
    width: calc(150px + (180 - 150) * ((100vw - 320px) / (1600 - 320))) !important;
    text-overflow: unset !important;
}

body .layout-wrapper .ui-datatable-data .p180ColLeft {
    text-align: left;
}

body.layout-compact .layout-wrapper .ui-toggleswitch.ui-state-disabled .ui-toggleswitch-slider {
    border: 1px solid lightgray;
    background-color: transparent;
}

body.layout-compact .layout-wrapper .ui-toggleswitch:not(.ui-toggleswitch-checked) .ui-toggleswitch-slider:before {
    border-color: #bd0000;
    background-color: #bd0000;
}

body.layout-compact .layout-wrapper .p250Col {
    width: 250px;
}

body.layout-compact .layout-wrapper .percent20Col {
    width: 20%;
    text-overflow: unset !important;
    text-align: center;
}

body.layout-compact .layout-wrapper .ui-datalist .ui-datalist-nobullets {
    border: none;
    padding: 0;
    margin: 0;
}

body.layout-compact .layout-wrapper .ui-datalist.noMarginDatalist .ui-datalist-data {
    margin: 0;
}

body.layout-compact .layout-wrapper .ui-datalist.dotDatalist .ui-datalist-data {
    list-style-type: disc;
    padding-inline-start: 20px;
}

body.layout-compact .layout-wrapper .ui-inputfield {
    padding-left: 5px;
}

body.layout-compact .ui-widget-content .ui-datalist-content {
    border: none;
}

.itemStyleClass {
    font-size: 2em;
}

.liefernachweisTabView {
    border: none;
}

.addRollenGrid .ui-widget-content td {
    padding: 2px;
}

.addRollenGrid td .ui-message {
    min-width: 54px;
}

.ui-selectonemenu-filter-container {
    width: 97%;
}

.ui-selectonemenu-panel .ui-selectonemenu-items-wrapper {
    overflow-x: hidden;
}

body.layout-compact .layout-wrapper .ui-spinner .ui-spinner-input {
    text-align: left;
    padding-left: 10px;
}

body.layout-compact .layout-wrapper .ui-spinner {
    padding-top: 2px !important;
}

body.layout-compact .layout-wrapper .ui-spinner.ui-state-disabled > .ui-spinner-button {
    display: none;
}

@media (min-width: 1025px) {
    .logoutBtnSmallResolution {
        display: none !important;
    }

    .bereitstellervertragText {
        color: white !important;
    }
}

@media (max-width: 1024px) {
    .bereitstellervertragText {
        color: #757575 !important;
    }

    .logoutBtn {
        display: none !important;
    }

    .logoutBtnSmallResolution {
        display: block !important;
    }
}

@media only screen and (max-width: 640px) {
    .logoutBtnSmallResolution {
        display: block !important;
    }

    body.layout-compact .layout-wrapper .ui-datatable-reflow .ui-datatable-data td[role="gridcell"]:not(.ui-helper-hidden) {
        white-space: pre-line;
    }

    body .layout-wrapper .btnCol {
        width: 100% !important;
        text-align: right !important;;
        white-space: normal !important;
    }

    body .layout-wrapper .btnCol .ui-column-title {
        display: none !important;
    }

    body .layout-wrapper .btnCol > span {
        display: none !important;
    }

    body .layout-wrapper .btnCol > button {
        float: right;
    }
}

body .layout-wrapper .layout-rightpanel .nano > .nano-pane > .nano-slider {
    background-color: #757575;
    opacity: 0.60;
    filter: alpha(opacity=60);
}

body .layout-wrapper .layout-rightpanel .nano .right-panel-scroll-content {
    background-color: #d0d0d0;
}

body .layout-wrapper .layout-rightpanel-content .card:hover {
    -webkit-box-shadow: 0 0 4px 1px #008000;
    box-shadow: 0 0 4px 1px #008000;
}

body .layout-wrapper .layout-rightpanel-content h1 {
    width: 33%;
    border-bottom: 1px solid #424242;
    padding-bottom: 10px;
    color: #424242;
}

body .layout-wrapper .ui-panelgrid, body .layout-wrapper .ui-panelgrid-cell, body .layout-wrapper .ui-panelgrid tr {
    border: none;
}

body.layout-compact .layout-wrapper .ui-radiobutton .ui-radiobutton-box {
    width: 16px !important;
    height: 16px !important;
}

body.layout-compact .layout-wrapper .ui-radiobutton .ui-radiobutton-box .ui-radiobutton-icon {
    top: 1px;
    left: 0;
}

body.layout-compact .layout-wrapper .infoIcon {
    font-family: "Times", "Times New Roman", "serif", "sans-serif", "EmojiSymbols", "apple color emoji";
}

.ui-panelgrid tr {
    border: medium none !important;
    vertical-align: top;
}

body.layout-compact .layout-wrapper .ui-inputtextarea {
    border-left: 1px solid #bdbdbd;
}

body .layout-wrapper .ui-panelgrid-content.ui-widget-content.ui-grid.ui-grid-responsive {
    border: none;
}

body .layout-wrapper .layout-rightpanel-content .ui-panelgrid .ui-panelgrid-cell {
    padding: 6px 20px 6px 6px;
}

body .layout-wrapper .ui-datatable thead th.ui-state-active {
    background-color: #757575;
}

body.layout-compact .layout-wrapper .ui-datatable-data .ui-state-hover td:not(.btnCol) span,
body.layout-compact .layout-wrapper .ui-datatable-data .ui-state-hover td:not(.btnCol) .ui-calendar input,
body.layout-compact .layout-wrapper .ui-datatable-data .ui-state-highlight td:not(.btnCol) span,
body.layout-compact .layout-wrapper .ui-datatable-data .ui-state-highlight td:not(.btnCol) .ui-calendar input {
    color: white !important;
}

body .layout-wrapper .ui-datatable thead th.hideHeaderCheckbox .ui-chkbox-all {
    display: none;
}

body .layout-wrapper .ui-tabs .ui-tabs-nav > li.ui-state-active a {
    font-weight: bold;
}

body .layout-wrapper .ui-tabs .ui-tabs-nav > li.ui-state-active {
    border-color: green;
}

body.layout-compact .layout-wrapper .noPaddingTabView.ui-tabs .ui-tabs-panel {
    padding-left: 0;
    padding-right: 0;
}

body.layout-compact .layout-wrapper .noPaddingTabViewPlusBottom.ui-tabs .ui-tabs-panel {
    padding-left: 0;
    padding-right: 0;
    padding-bottom: 0;
}

body .ui-tabs.noPaddingTabView {
    border: none;
    padding-left: 0;
    padding-right: 0;
    padding-bottom: 0;
}

body .layout-wrapper .ui-datatable-empty-message td {
    padding: 11px !important;
}

body .layout-wrapper .ui-datatable-empty-message {
    font-weight: bold;
    text-align: center;
}

body .layout-wrapper .ui-datatable .ui-paginator {
    height: 25px;
}

.ui-paginator .ui-state-hover {
    color: #424242 !important;
}

body.layout-compact .layout-wrapper .globalFilterField {
    color: white;
    height: 20px;
    vertical-align: top;
}

body.layout-compact .layout-wrapper .ui-button.ui-state-focus {
    -webkit-box-shadow: 0 0 2px 1px green;
    box-shadow: 0 0 2px 1px green;
    border: 1px solid green;
    /*background-color   : #015201;*/
}

body.layout-compact .layout-wrapper .ui-button {
    user-select: none; /* supported by Chrome and Opera */
    -webkit-user-select: none; /* Safari */
    -khtml-user-select: none; /* Konqueror HTML */
    -moz-user-select: none; /* Firefox */
    -ms-user-select: none; /* Internet Explorer/Edge */
}

body.layout-compact .layout-wrapper .deleteBtn:hover {
    background-color: orangered !important;
}

body.layout-compact .layout-wrapper .ui-selectonemenu:hover,
body.layout-compact .layout-wrapper .ui-inputfield:hover,
body.layout-wrapper .globalFilterField:hover,
body.layout-compact .layout-wrapper .ui-inputfield.ui-state-focus,
body.layout-compact .layout-wrapper .ui-selectonemenu.ui-state-focus,
body.layout-compact .layout-wrapper .ui-selectcheckboxmenu.ui-state-focus {
    border-bottom-color: #008000 !important;
}

body .layout-wrapper .globalFilterInputDiv label {
    padding-top: 5px;
}

body .layout-wrapper .addElementBtn,
body .layout-wrapper .tblHeaderBtnRight {
    margin-left: 10px;
}

body .layout-wrapper .clearFilterBtn,
body .layout-wrapper .clearTblFilterBtn,
body .layout-wrapper .tblHeaderBtnLeft {
    margin-left: -10px;
}

body .layout-wrapper .clearFilterBtn,
body .layout-wrapper .addElementBtn,
body .layout-wrapper .clearTblFilterBtn,
body .layout-wrapper .tblHeaderBtnRight,
body .layout-wrapper .tblHeaderBtnLeft {
    background-color: #424242 !important;
    border: 1px solid #757575;
    margin-right: 0;
    margin-top: -4px;
    display: block;
    -moz-box-shadow: none;
    -webkit-box-shadow: none;
    box-shadow: none;
}

body .layout-wrapper .clearFilterBtn:hover,
body .layout-wrapper .addElementBtn:hover,
body .layout-wrapper .clearTblFilterBtn:hover,
body .layout-wrapper .tblHeaderBtnRight:hover,
body .layout-wrapper .tblHeaderBtnLeft:hover {
    background-color: #757575 !important;
    -moz-box-shadow: 0 1px 2.5px 0 rgba(0, 0, 0, 0.26), 0 1px 5px 0 rgba(0, 0, 0, 0.16);
    -webkit-box-shadow: 0 1px 2.5px 0 rgba(0, 0, 0, 0.26), 0 1px 5px 0 rgba(0, 0, 0, 0.16);
    box-shadow: 0 1px 2.5px 0 rgba(0, 0, 0, 0.26), 0 1px 5px 0 rgba(0, 0, 0, 0.16);
}

body .layout-wrapper .ui-datatable .ui-paginator-pages .ui-paginator-page {
    min-width: 20px;
}

@media only screen and (max-width: 750px) {
    body .layout-wrapper .globalFilterDiv {
        display: none;
    }
}

body.layout-compact .layout-wrapper .ultima-menu li a:hover i:first-child {
    color: #424242;
}

body.layout-compact .layout-wrapper .ultima-menu li ul li a {
    padding: 4px 16px 4px 32px;
}

body .layout-wrapper .topbar .topbar-right #menu-button {
    background-color: green;
}

body .layout-wrapper .topbar .logo {
    background: url("/javax.faces.resource/quma-logo-40-left4.jpg.xhtml?ln=images") top left no-repeat;
}

body .layout-wrapper .topbar .logoKvb {
    background: url("/javax.faces.resource/quma-logo-kvb.jpg.xhtml?ln=images") top left no-repeat !important;
}

body .layout-wrapper .topbar .logoNWL {
    background: url("/javax.faces.resource/quma-logo-nwl.png.xhtml?ln=images") top left no-repeat !important;
}

body .layout-wrapper .topbar .logoNVR {
    background: url("/javax.faces.resource/quma-logo-nvr.png.xhtml?ln=images") top left no-repeat !important;
}

body .layout-wrapper .topbar .logoDB {
    background: url("/javax.faces.resource/quma-logo-db.png.xhtml?ln=images") top left no-repeat !important;
}

body .layout-wrapper .topbar .logoABR {
    background: url("/javax.faces.resource/quma-logo-abr.png.xhtml?ln=images") top left no-repeat !important;
}

body .layout-wrapper .topbar .logoZSPNVSued {
    background: url("/javax.faces.resource/quma-logo-zspv-sued.png.xhtml?ln=images") top left no-repeat !important;
}

body .layout-wrapper .topbar .logoCFL {
    background: url("/javax.faces.resource/quma-logo-cfl.png.xhtml?ln=images") top left no-repeat !important;
}

body .layout-wrapper .topbar .logoerb {
    background: url("/javax.faces.resource/quma-logo-erb.png.xhtml?ln=images") top left no-repeat !important;
}

body .layout-wrapper .topbar .logoHLB {
    background: url("/javax.faces.resource/quma-logo-hlb.png.xhtml?ln=images") top left no-repeat !important;
}

body .layout-wrapper .topbar .logoNWB {
    background: url("/javax.faces.resource/quma-logo-nwb.png.xhtml?ln=images") top left no-repeat !important;
}

body .layout-wrapper .topbar .logoNX {
    background: url("/javax.faces.resource/quma-logo-nx.png.xhtml?ln=images") top left no-repeat !important;
}

body .layout-wrapper .topbar .logoREGIO {
    background: url("/javax.faces.resource/quma-logo-regio.png.xhtml?ln=images") top left no-repeat !important;
}

body .layout-wrapper .topbar .logoRTB {
    background: url("/javax.faces.resource/quma-logo-rtb.png.xhtml?ln=images") top left no-repeat !important;
}

body .layout-wrapper .topbar .logoTDV {
    background: url("/javax.faces.resource/quma-logo-tdv.png.xhtml?ln=images") top left no-repeat !important;
}

body .layout-wrapper .topbar .logoSPNV-Nord {
    background: url("/javax.faces.resource/quma-logo-spnv-nord.png.xhtml?ln=images") top left no-repeat !important;
}

body .layout-wrapper .topbar .logoVIAS {
    background: url("/javax.faces.resource/quma-logo-vias.png.xhtml?ln=images") top left no-repeat !important;
}

body .layout-wrapper .topbar .logoVlexx {
    background: url("/javax.faces.resource/quma-logo-vlexx.png.xhtml?ln=images") top left no-repeat !important;
}

body .layout-wrapper .topbar .logoWEBA {
    background: url("/javax.faces.resource/quma-logo-weba.png.xhtml?ln=images") top left no-repeat !important;
}

body .layout-wrapper .topbar .logoBelgien {
    background: url("/javax.faces.resource/quma-logo-belgien.png.xhtml?ln=images") top left no-repeat !important;
}

body .layout-wrapper .topbar .logoFrankreich {
    background: url("/javax.faces.resource/quma-logo-frankreich.png.xhtml?ln=images") top left no-repeat !important;
}

body .layout-wrapper .topbar .logoNiederlande {
    background: url("/javax.faces.resource/quma-logo-niederlande.png.xhtml?ln=images") top left no-repeat !important;
}

body .layout-wrapper .topbar .logoHessen {
    background: url("/javax.faces.resource/quma-logo-hessen.png.xhtml?ln=images") top left no-repeat !important;
}

body .layout-wrapper .topbar .logoKCTIF {
    background: url("") top left no-repeat !important;
}

body .layout-wrapper .topbar .logoLNVG {
    background: url("/javax.faces.resource/quma-logo-lnvg.png.xhtml?ln=images") top left no-repeat !important;
}

body .layout-wrapper .topbar .logoLuxemburg {
    background: url("/javax.faces.resource/quma-logo-luxemburg.png.xhtml?ln=images") top left no-repeat !important;
}

body .layout-wrapper .topbar .logoNVV {
    background: url("") top left no-repeat !important;
}

body .layout-wrapper .topbar .logoVRN {
    background: url("/javax.faces.resource/quma-logo-vrn.png.xhtml?ln=images") top left no-repeat !important;
}

body .layout-wrapper .topbar .logoZPS {
    background: url("/javax.faces.resource/quma-logo-zps.png.xhtml?ln=images") top left no-repeat !important;
}

body .layout-wrapper .topbar .topbar-left {
    padding: 15px 20px;
}

body .layout-wrapper .topbar .logo {
    width: 200px;
    height: 40px;
}

body .layout-wrapper .layout-rightpanel .ui-tabs {
    border: none;
}

.vertragSelectTopbar {
    margin-right: 10px;
    margin-top: 8px;
}

.vertragSelectTopbar .ui-selectonemenu {
    border-bottom: 1px solid white;
}

body.layout-compact .layout-wrapper .ui-selectonemenu .ui-selectonemenu-label {
    padding-left: 5px;
}

/*body.layout-compact .ui-calendar .ui-inputfield {*/
/*    padding-left: 10px*/
/*}*/

body.layout-compact .layout-wrapper .ui-outputlabel {
    left: 0 !important;
    margin-left: 5px;
    color: #757575;
}

.vertragSelectTopbar:hover, .vertragSelectTopbar:hover .ui-selectonemenu {
    border-bottom-color: #008000 !important;
}

.layout-wrapper .topbar .topbar-right .topbar-items .vertragSelectTopbar label {
    padding-bottom: 5px;
    padding-left: 5px;
}

body .vertragSelectTopbarMenuPanel {
    width: auto !important;
    height: auto !important;
    max-width: 500px !important;
    max-height: 500px !important;
    overflow-y: auto;
    overflow-x: hidden;
}

body .vertragSelectTopbarMenuPanel .ui-selectonemenu-items-wrapper {
    max-height: 500px !important;
}

body .vertragSelectTopbarMenuPanel .ui-state-disabled {
    opacity: 1 !important;
    filter: alpha(opacity=100) !important;
}

body.layout-compact .ui-selectonemenu-panel .ui-selectonemenu-item.ui-state-hover {
    background-color: #5a5a5a;
    color: white;
}

body .layout-wrapper .ui-selectonemenu-items-wrapper, .ui-selectonemenu-item span {
    display: inline-block;
}

body .layout-wrapper .ui-state-disabled,
body .layout-wrapper .transparentBtn.ui-state-disabled,
body .layout-wrapper .ui-inputfield.ui-state-disabled,
body .layout-wrapper .ui-selectonemenu.ui-state-disabled .ui-selectonemenu-label,
body .layout-wrapper .ui-selectonemenu.ui-state-disabled,
body .layout-wrapper .ui-spinner.ui-state-disabled {
    opacity: 0.8 !important;
    filter: alpha(opacity=80) !important;
}

body .layout-wrapper .ui-inputfield.ui-state-disabled, body .layout-wrapper .ui-selectonemenu.ui-state-disabled {
    background-image: linear-gradient(to bottom, #ececec, #ececec), linear-gradient(to bottom, #ececec, #ececec);
    border-bottom: none;
}

body .layout-wrapper .ui-selectonemenu.ui-state-disabled {
    padding-left: 5px;
}

body .layout-wrapper .ui-selectonemenu.ui-state-disabled .ui-selectonemenu-trigger {
    display: none;
}

body .layout-wrapper .ui-picklist.ui-picklist-responsive .ui-picklist-list .ui-picklist-item .ui-chkbox {
    margin-right: 4px;
}

body.layout-compact .layout-wrapper .noWrapPickList.ui-picklist .ui-picklist-list li {
    white-space: nowrap;
}

body.layout-compact .layout-wrapper .nowrapItemSelectMany .ui-selectlistbox-item {
    white-space: nowrap;
}

body.layout-compact .layout-wrapper .selectBooleanCheckboxAutoWidth {
    width: auto;
}

body.layout-compact .layout-wrapper .noneBorderBtn, body.layout-compact .layout-wrapper .iconOnHoverBtn {
    background-color: #ffffff !important;
    color: #212121 !important;
    box-shadow: none;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
}

body.layout-compact .layout-wrapper .noneBorderBtn .ui-icon {
    color: #757575 !important;
}

body.layout-compact .layout-wrapper .iconOnHoverBtn .ui-icon {
    display: none;
}

body.layout-compact .layout-wrapper .iconOnHoverBtn.ui-state-focus {
    box-shadow: none;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
}

body.layout-compact .layout-wrapper .ui-button.iconOnHoverBtn.ui-state-hover .ui-icon {
    display: inline-block;
    background-color: #e8e8e8 !important;
    color: #000000 !important;
}

body.layout-compact .layout-wrapper .ui-button.noneBorderBtn.ui-state-hover,
body.layout-compact .layout-wrapper .ui-button.iconOnHoverBtn.ui-state-hover {
    background-color: #e8e8e8 !important;
    color: #000000 !important;
}

body span > .ui-chkbox {
    margin-left: 4px;
}

.ui-selectonemenu-item span {
    width: 100%;
}

td.tableCellTextRight {
    text-align: right !important;
}

td.tableCellTextLeft {
    text-align: left !important;
}

td.tableCellTextCenter {
    text-align: center !important;
}

.noCellPaddingTabDash {
    margin-left: -1px !important;
    margin-top: -1px !important;
}

body .layout-wrapper .footer-text-right .ui-clock {
    background: none;
    color: #757575;
    border: none;
    padding: 0;
}

body.layout-compact .layout-wrapper .uploadFilename {
    margin-left: 70px !important;
}

body.layout-compact .layout-wrapper .ui-fileupload .ui-fileupload-buttonbar .ui-button {
    background-color: #757575;
}

body.layout-compact .layout-wrapper .ui-fileupload .ui-fileupload-buttonbar .ui-button.ui-state-hover {
    background-color: green;
}

.ui-button-icon-only-small {
    width: 28px !important;
    height: 28px !important;
    font-size: 16px !important;
}

.ui-button-icon-only-small > .ui-icon {
    font-size: 16px !important;
    margin-top: -8px !important;
}

.ui-datatable-tablewrapper .ui-button-icon-only {
    font-size: 0px !important;
    margin-left: -10px !important;
    margin-top: -8px !important;
}

.ui-datatable-tablewrapper .ui-button-icon-only .ui-icon {
    font-size: 16px !important;
    margin-top: -8px !important;
    margin-left: -10px !important;
    transition: color 0.3s;
}

.ui-datatable-tablewrapper .ui-button.ui-button-icon-only {
    height: 30px !important;
    margin: 0 !important;
}

.ui-datatable-scrollable-body .ui-button.ui-button-icon-only {
    height: 30px !important;
    margin: 0 !important;
}

body.layout-compact .layout-wrapper .ui-datatable tbody tr.ui-widget-content td {
    padding: 6px 10px 4px 10px;
}

.tableCellIcon {
    padding-top: 8px !important;
}

body.layout-compact .layout-wrapper .ui-datatable tbody tr.ui-widget-content td {
    white-space: nowrap;
    text-overflow: ellipsis;
}

body.layout-compact .layout-wrapper .ui-datatable thead th.ui-state-active.ui-state-hover,
body.layout-compact .layout-wrapper .ui-datatable thead th.ui-state-active.ui-state-hover .ui-sortable-column-icon {
    color: white;
}

body.layout-compact .layout-wrapper .ui-datatable tbody tr.ui-state-hover .ui-button-icon-only {
    -webkit-box-shadow: 0 0 1px 1px #E6E6E6;
    box-shadow: 0 0 1px 1px #E6E6E6;
}

body.layout-compact .layout-wrapper .ui-datatable tbody tr.ui-state-hover .dotInline,
body.layout-compact .layout-wrapper .ui-datatable tbody tr.ui-state-highlight .dotInline {
    background: -moz-radial-gradient(center, ellipse cover, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 1) 45%, rgba(255, 255, 255, 0) 48%, rgba(255, 255, 255, 0) 100%); /* FF3.6-15 */
    background: -webkit-radial-gradient(center, ellipse cover, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 1) 45%, rgba(255, 255, 255, 0) 48%, rgba(255, 255, 255, 0) 100%); /* Chrome10-25,Safari5.1-6 */
    background: radial-gradient(ellipse at center, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 1) 45%, rgba(255, 255, 255, 0) 48%, rgba(255, 255, 255, 0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#00ffffff', GradientType=1); /* IE6-9 fallback on horizontal gradient */
}

.dotInline {
    height: 24px !important;
    width: 24px !important;
}

body.layout-compact .ui-state-active, body .ui-state-highlight .dotInline {
    color: #5a5a5a;
}

body.layout-compact .layout-wrapper .ui-datatable .noWrapHeader thead th {
    white-space: nowrap;
}

body.layout-compact .layout-wrapper .ui-button-icon-left.ui-icon.ui-c.ui-icon-warning {
    margin-top: -11px;
}

body.layout-compact .layout-wrapper .deleteForeverBtn {
    margin-right: -6px;
    margin-top: -6px;
    margin-bottom: 0;
    margin-left: -26px;
    float: right;
}

.markedForDeleteBtn span.ui-icon, .markedForExportBtn span.ui-icon {
    color: #008000;
}

body .layout-wrapper .markedForDeleteBtn, body .layout-wrapper .markedForExportBtn {
    background-color: #f1f1f1 !important;
    border: 1px solid #757575;
    margin-right: 0;
    margin-top: -4px;
    margin-left: -10px;
    -moz-box-shadow: none;
    -webkit-box-shadow: none;
    box-shadow: none;
    transition: background-color 0.5s;
    display: inline-block;
}

body.layout-compact .layout-wrapper .deleteForeverBtn:hover .ui-icon {
    color: orangered;
}

.markedForDeleteBtn:hover .ui-icon, .markedForExportBtn:hover .ui-icon {
    color: lightgreen
}

body .layout-wrapper .markedForDeleteBtn:hover, body .layout-wrapper .markedForExportBtn:hover {
    background-color: #424242 !important;
    -moz-box-shadow: 0 1px 2.5px 0 rgba(0, 0, 0, 0.26), 0 1px 5px 0 rgba(0, 0, 0, 0.16);
    -webkit-box-shadow: 0 1px 2.5px 0 rgba(0, 0, 0, 0.26), 0 1px 5px 0 rgba(0, 0, 0, 0.16);
    box-shadow: 0 1px 2.5px 0 rgba(0, 0, 0, 0.26), 0 1px 5px 0 rgba(0, 0, 0, 0.16);
}

body.layout-compact .layout-wrapper .inUseBtn {
    background-color: #9b9b9b;
    border: 1px solid #b5b5b5;
    margin-right: 0;
    margin-top: -4px;
    margin-left: -10px;
    display: block;
    -moz-box-shadow: none;
    -webkit-box-shadow: none;
    box-shadow: none;
    transition: background-color 0.5s;
    cursor: not-allowed;
}

body.layout-compact .layout-wrapper .inUseBtn span.ui-icon {
    color: white;
}

body .layout-wrapper .inUseBtn:hover {
    background-color: #434343 !important;
    -moz-box-shadow: none;
    -webkit-box-shadow: none;
    box-shadow: none;
}

.ui-columntoggler {
    height: auto !important;
    max-height: 400px;
    overflow-x: hidden !important;
    overflow-y: auto !important;
}

.ui-datatable-data tr {
    height: 36px !important;
}

.input-wrapper {
    min-width: 150px;
}

body.layout-compact .layout-wrapper .layout-rightpanel-content .card {
    margin-bottom: 16px;
}

body.layout-compact .layout-wrapper .card, body .layout-wrapper .footer .card {
    margin-bottom: 0px;
}

body.layout-compact .layout-wrapper .layout-main {
    padding-top: 90px;
    height: calc(100vh - 90px);
}

body.layout-compact .layout-wrapper .ui-dialog .ui-dialog-content .ui-dialog-footer {
    background-color: white;
}

body.layout-compact .layout-wrapper .ui-dialog .ui-dialog-footer {
    text-align: left;
    background-color: #efefef;
    padding-right: 0;
}

.evenClass {
    background-color: #008000;
}

.oddClass {
}

body.layout-compact .layout-wrapper .ui-datatable tbody tr.ui-datatable-even.ui-state-highlight,
body.layout-compact .layout-wrapper .ui-datatable tbody tr.ui-datatable-odd.ui-state-highlight {
    background: rgb(0, 170, 48); /* Old browsers */
    background: -moz-linear-gradient(top, rgba(0, 170, 48, 1) 1%, rgba(0, 110, 46, 1) 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top, rgba(0, 170, 48, 1) 1%, rgba(0, 110, 46, 1) 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom, rgba(0, 170, 48, 1) 1%, rgba(0, 110, 46, 1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#00aa30', endColorstr='#006e2e', GradientType=0); /* IE6-9 */
}

body.layout-compact .layout-wrapper .ui-treetable .ui-treetable-data .ui-state-disabled .ui-chkbox-icon {
    color: grey !important;
}

body.layout-compact .layout-wrapper .ui-treetable tbody tr.ui-state-highlight .ui-chkbox-box {
    border-color: #016101;
    background-color: white !important;
}

body.layout-compact .layout-wrapper .ui-treetable .ui-treetable-data tr.ui-state-highlight,
body.layout-compact .layout-wrapper .ui-treetable tbody tr.ui-state-highlight .ui-chkbox-box,
body.layout-compact .layout-wrapper .ui-treetable tbody tr.ui-state-highlight .ui-chkbox .ui-chkbox-box .ui-chkbox-icon {
    color: #016101;
}


body.layout-compact .layout-wrapper .ui-treetable .ui-treetable-data tr.ui-state-highlight {
    font-weight: bold;
}

body.layout-compact .layout-wrapper .ui-treetable .ui-column-title {
    color: grey;
}

body.layout-compact .layout-wrapper .ui-treetable .ui-treetable-toggler {
    color: grey;
}

body.layout-compact .layout-wrapper .ui-treetable,
body.layout-compact .layout-wrapper .ui-treetable tr,
body.layout-compact .layout-wrapper .ui-treetable .ui-treetable-scrollable-header .ui-treetable-scrollable-header-box,
body.layout-compact .layout-wrapper .ui-treetable thead {
    border: none;
}

body.layout-compact .layout-wrapper .ui-treetable thead th {
    border-bottom: none;
}

body.layout-compact .layout-wrapper .ui-treetable .ui-treetable-data tr.ui-state-highlight,
body.layout-compact .layout-wrapper .ui-treetable tbody tr.ui-state-highlight .ui-chkbox .ui-chkbox-box .ui-chkbox-icon {
    color: #016101;
}

body.layout-compact .layout-wrapper .ui-treetable .ui-treetable-data tr.ui-state-highlight:nth-child(even) {
    background-color: #cbe7cf;
}

body.layout-compact .layout-wrapper .ui-treetable .ui-treetable-data tr.ui-state-highlight:nth-child(odd) {
    background-color: #e2ffe6;
}

body.layout-compact .layout-wrapper .ui-treetable .ui-treetable-data tr.ui-state-highlight:hover {
    background-color: lightgray !important;
}

body.layout-compact .layout-wrapper .ui-treetable tbody tr.treeTableChild:nth-child(even) {
    background-color: #f4f4f4;
}

body.layout-compact .layout-wrapper .ui-treetable tbody tr.treeTableChild:nth-child(odd) {
    background-color: #FFF;
}

body.layout-compact .layout-wrapper .ui-state-active .ui-column-filter:hover,
body.layout-compact .layout-wrapper .ui-state-active .ui-column-filter:focus {
    background: #4b4b4b; /* Old browsers */
    background: -moz-linear-gradient(top, #ffffff 0%, #ffffff 94%, #008000 95%, #008000 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top, #ffffff 0%, #ffffff 94%, #008000 95%, #008000 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom, #ffffff 0%, #ffffff 94%, #008000 95%, #008000 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#efefef', endColorstr='#008000', GradientType=0); /* IE6-9 */
    border-left: 2px solid green;
    color: black;
}

body.layout-compact .layout-wrapper .ui-sortable-column.ui-state-active:hover {
    background: rgb(117, 117, 117); /* Old browsers */
    background: -moz-linear-gradient(top, rgba(117, 117, 117, 1) 0%, rgba(99, 99, 99, 1) 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top, rgba(117, 117, 117, 1) 0%, rgba(99, 99, 99, 1) 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom, rgba(117, 117, 117, 1) 0%, rgba(99, 99, 99, 1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#757575', endColorstr='#636363', GradientType=0); /* IE6-9 */
}

body.layout-compact .layout-wrapper .ui-column-customfilter .ui-widget.ui-state-active {
    color: white;
}

body.layout-compact .layout-wrapper .ui-column-filter:hover,
body.layout-compact .layout-wrapper .ui-column-filter:focus
    /*Wofür ist diese Zeile des CustomFilters notwendig*/
    /*, body.layout-compact .layout-wrapper .ui-column-customfilter .ui-widget:hover */
{
    background: #ffffff; /* Old browsers */
    background: -moz-linear-gradient(top, #ffffff 0%, #ffffff 94%, #008000 91%, #008000 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top, #ffffff 0%, #ffffff 90%, #008000 91%, #008000 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom, #ffffff 0%, #ffffff 90%, #008000 91%, #008000 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#efefef', endColorstr='#008000', GradientType=0); /* IE6-9 */
    border-left: 2px solid green;
    color: black;
}

body.layout-compact .layout-wrapper .ui-datatable tbody tr.ui-state-hover {
    background-color: #5a5a5a;
    color: #ffffff;
}

body.layout-compact .layout-wrapper .layout-main {
    padding-bottom: 0;
}

body.layout-compact .layout-wrapper .ui-picklist-buttons .ui-button.ui-button-icon-only:not(.ui-state-disabled) {
    /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#00aa30+1,006e2e+100 */
    background: rgb(0, 170, 48); /* Old browsers */
    background: -moz-linear-gradient(top, rgba(0, 170, 48, 1) 1%, rgba(0, 110, 46, 1) 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top, rgba(0, 170, 48, 1) 1%, rgba(0, 110, 46, 1) 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom, rgba(0, 170, 48, 1) 1%, rgba(0, 110, 46, 1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#00aa30', endColorstr='#006e2e', GradientType=0); /* IE6-9 */
}

body.layout-compact .layout-wrapper .ui-picklist-buttons .ui-button.ui-button-icon-only.ui-state-disabled {
    background-color: grey !important;
}

body.layout-compact .layout-wrapper .ui-picklist-outline {
    outline: none;
}

body.layout-compact .layout-wrapper .ui-message {
    min-height: 20px;
}

body.layout-compact .layout-wrapper .ui-message .ui-message-error-icon {
    margin-top: 2px;
}

body.layout-compact .layout-wrapper .ui-message > span {
    margin-top: -1px;
}

body.layout-compact .layout-wrapper .ultima-menu span {
    overflow: hidden;
    width: 160px;
}

body.layout-compact .layout-wrapper .ultima-menu a.notactive-menuitem:hover .material-icons,
body.layout-compact .layout-wrapper .ultima-menu a.current-menuitem:hover .material-icons {
    color: green;
}

body.layout-compact .layout-wrapper .ultima-menu a.notactive-menuitem:hover
    /*, */
    /*body.layout-compact .layout-wrapper .ultima-menu .notactive-menuitem:hover */
{
    background-color: #e8e8e8 !important;
    border-right: 3px solid grey;
    color: green;
}

body.layout-compact .layout-wrapper .ultima-menu a.notactive-menuitem, body.layout-compact .layout-wrapper .ultima-menu .notactive-menuitem {
    border-right: 3px solid #ffffff;
}

body.layout-compact .layout-wrapper .ultima-menu .notactive-menuitem, body.layout-compact .layout-wrapper .ultima-menu .notactive-menuitem span {
    background: transparent;
    font-weight: normal;
}

body.layout-compact .layout-wrapper .ultima-menu li.current-menuitem > a,
body.layout-compact .layout-wrapper .ultima-menu li.active-menuitem > a,
body.layout-compact .layout-wrapper .ultima-menu a.current-menuitem {
    font-weight: bold;
    color: #424242;
}

body.layout-compact .layout-wrapper .ultima-menu li.current-menuitem .ripplelink .material-icons,
body.layout-compact .layout-wrapper .ultima-menu a.current-menuitem .material-icons {
    color: green !important;
}

body.layout-compact .layout-wrapper .ultima-menu a.current-menuitem i {
    font-weight: normal !important;
}

body.layout-compact .layout-wrapper .ultima-menu a.current-menuitem {
    background-color: #e8e8e8;
}

body.layout-compact .layout-wrapper a.current-menuitem {
    border-right: 3px solid #008000;
}

body.layout-compact .layout-wrapper .ultima-menu li.current-menuitem > a,
body.layout-compact .layout-wrapper .ultima-menu .current-menuitem > i {
    font-weight: bold;
}

.layout-wrapper .topbar .topbar-right .rightpanel-btn {
    margin-left: 10px;
}

.dot {
    height: 20px;
    width: 20px;
    border-radius: 50%;
    display: block;
}

.dotInline {
    height: 20px;
    width: 20px;
    border-radius: 50%;
    display: inline-block;
}

.ui-icon-cancel {
    color: red;
}

.ui-icon-check-circle {
    color: green;
}

.transpDot {
    color: transparent;
}

body.layout-compact .layout-wrapper .ui-datatable-tablewrapper .ui-chkbox .ui-chkbox-box {
    background-color: white;
}

body.layout-compact .layout-wrapper .noLabelWrap label {
    white-space: nowrap;
}

body.layout-compact .layout-wrapper .headerLeftAlign th {
    text-align: left;

}

body.layout-compact .layout-wrapper .headerLeftAlign th span {
    white-space: nowrap;
}

body.layout-compact .layout-wrapper .usernameMenuHeader i {
    color: #008000;
}

body.layout-compact .layout-wrapper .usernameMenuHeader span {
    font-weight: bold;
}

body.layout-compact .layout-wrapper .usernameMenuHeader {
    border-bottom: 1px solid grey;
    background-color: lightgray;
    cursor: default;
}

body.layout-compact .layout-wrapper .usernameMenuHeader:hover {
    background-color: lightgray;
}

body.layout-compact .layout-wrapper .deleteForeverBtn
body.main-body {
    background-color: #e8e8e8;
}

.dummyUnverfuegbarkeit::after {
    content: "\2002 \26A0";
}

body.layout-compact .layout-wrapper .topbar {
    background-color: #5a5a5a;
}

.layout-wrapper .topbar-itemsfix {
    float: right !important;
    margin: 0 !important;
    padding: 5px 0 0 0 !important;
    list-style-type: none !important;
    margin-right: 2px !important;
}

.layout-wrapper .topbar-itemsfix > li > a {
    position: relative;
    display: block;
}

.layout-wrapper .topbar-itemsfix > li .topbar-icon {
    font-size: 36px;
    color: #ffffff;
    -moz-transition: color 0.3s;
    -o-transition: color 0.3s;
    -webkit-transition: color 0.3s;
    transition: color 0.3s;
}

.tooltipCol:not(th) span:not(.ui-column-title) {
    display: inline-block !important;
    width: 100%;
}

.linebreakCol:not(th) span:not(.ui-column-title) {
    white-space: pre-line;
    height: 1em;
    overflow: hidden;
}

.date300px input {
    width: 290px;
}

body.layout-compact .ui-selectonemenu-panel tr.ui-selectonemenu-item {
    height: 24px;
}

/*OHNE :first-of-type werden alle deaktivierte ausgeblendet, so nur das erst, welcher der leere Eintrag sein sollte.*/
body.layout-compact .ui-selectonemenu-panel .ui-selectonemenu-item.ui-state-disabled:first-of-type.ui-state-highlight {
    background: none !important;
    padding: 0;
    margin: 0;
    font-size: 0;
    height: 0;
}

body.layout-compact .ui-selectonemenu-panel .ui-selectonemenu-item.ui-state-disabled:first-of-type.ui-state-highlight td {
    padding: 0;
    margin: 0;
}

body.layout-compact .ui-state-active, body .ui-state-highlight {
    background-color: green;
    color: white;
}

body.layout-compact .ui-datatable thead th.ui-state-active, body.layout-compact .ui-datatable thead th.ui-state-highlight {
    color: #ffffff;
    border-top-color: lightgreen;
}

body.layout-compact .ui-datepicker tbody td.ui-datepicker-today a {
    background-color: lightgreen;
    border: 1px solid green;
}

body.layout-compact .ui-chips .ui-chips-container {
    width: 100%;
}

body.layout-compact .hidePagination .ui-paginator-pages,
body.layout-compact .hideHeaderClone thead.ui-datatable-scrollable-theadclone {
    display: none;
}

body.layout-compact .timeOnly > input {
    width: 50px;
}

body.layout-compact .ui-toggleswitch.ui-toggleswitch-checked .ui-toggleswitch-slider {
    background-color: #e2ffe6;
    border-color: grey;
}

body.layout-compact .ui-toggleswitch:not(.ui-toggleswitch-checked) .ui-toggleswitch-slider {
    background-color: #f4f4f4;
    border-color: grey;
}

body.layout-compact .ui-toggleswitch.ui-toggleswitch-checked .ui-toggleswitch-slider:before {
    background-color: green;
    bottom: -4px;
}

body.layout-compact .ui-toggleswitch .ui-toggleswitch-slider:before {
    border: 1px solid green;
    bottom: -4px;
}

pe-timepicker-button pe-timepicker-up {
    height: 10px;
    padding: 0;
    width: 20px;
}

body.layout-compact .inputTimeForTable {
    width: 50px;
    text-align: center;
}

body.layout-compact .layout-wrapper .ui-datatable tbody tr.ui-state-hover .inputTimeForTable {
    padding-bottom: 3px;
}
body .ui-tabs.ui-tabs-top > .ui-tabs-nav > li:not(.ui-state-active) {
    transition: border 1s;
}

body .ui-tabs.ui-tabs-top > .ui-tabs-nav > li:not(.ui-state-active):hover {
    border-bottom: 2px solid grey;
}

.vAlignBottomPanelGrid {
    vertical-align: bottom;
}

.minWidthLabel {
    min-width: 120px;
    width: 120px;
}

.minWidthLabel200 {
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

body.layout-compact .layout-wrapper .iconUpload .ui-button-text {
    display: none;
}

body.layout-compact .layout-wrapper .iconUpload .ui-button-text-icon-left {
    padding-left: 26px;
}

body.layout-compact .layout-wrapper .iconUpload .ui-fileupload-filename {
    float: right;
    margin-top: 7px;
}

body.layout-compact .layout-wrapper .iconUpload .ui-fileupload-content {
    height: 0px;
    overflow: visible;
    padding: 0;
    border: none;
}

body.layout-compact .layout-wrapper .iconUpload .ui-fileupload-buttonbar {
    width: 0px !important;
    padding: 0px !important;
    border: none;
}

body .ui-fileupload .ui-fileupload-buttonbar .ui-button.ui-state-disabled.ui-fileupload-upload {
    display: none;
}

body .ui-fileupload .ui-fileupload-content {
    display: none;
}

body.layout-compact .layout-wrapper .ui-fileupload .ui-fileupload-buttonbar .ui-button.ui-state-disabled.ui-fileupload-cancel {
    display: none;
}

body.layout-compact .layout-wrapper .hideNameAndPreviewUploadContent .ui-fileupload-row > div:nth-child(1) {
    display: none;
}

body.layout-compact .layout-wrapper .hideNameAndPreviewUploadContent .ui-fileupload-row > div:nth-child(2) {
    display: none;
}

body.layout-compact .layout-wrapper .hideNameAndPreviewUploadContent .ui-fileupload-row > div:nth-child(3) {
    display: none;
}

body.layout-compact .layout-wrapper .hideNameAndPreviewUploadContent .ui-fileupload-row > div:nth-child(5) {
    display: none;
}

body.layout-compact .layout-wrapper .hideNameAndPreviewUploadContent .ui-fileupload-buttonbar {
    float: left;
}

body.layout-compact .layout-wrapper .hideNameAndPreviewUploadContent .ui-progressbar {
    /*width : 100px;*/
}

body.layout-compact .layout-wrapper .hideNameAndPreviewUploadContent .ui-fileupload-progress {
    padding-top: 0 !important;
    padding-bottom: 10px;
    vertical-align: middle;
    float: left;
    margin-left: 50px
}

body.layout-compact .layout-wrapper .hideNameAndPreviewUploadContent .ui-fileupload-messages {
    margin-left: 50px;
    width: 350px;
    margin-right: -400px;
    white-space: nowrap;
    overflow: hidden;
}

body.layout-compact .layout-wrapper .hideNameAndPreviewUploadContent .ui-fileupload-messages .ui-messages-error {
    padding: 6px;
    margin-top: -2px
}

body.layout-compact .layout-wrapper .hideNameAndPreviewUploadContent .ui-fileupload-messages .ui-messages-error .ui-messages-error-summary {
    float: left;
}

body.layout-compact .layout-wrapper .hideNameAndPreviewUploadContent .ui-fileupload-messages .ui-messages-error .ui-messages-error-detail {
    overflow: hidden;
    float: left;
    margin-left: 10px;
}

body.layout-compact .layout-wrapper .ui-datatable-data .ui-commandlink {
    color: black;
    text-decoration: underline;
    font-weight: bold;
}

body.layout-compact .layout-wrapper .ui-datatable-data .ui-datatable-selectable.ui-state-highlight .ui-commandlink,
body.layout-compact .layout-wrapper .ui-datatable-data .ui-datatable-selectable.ui-state-hover .ui-commandlink {
    color: white;
    text-decoration: underline;
    font-weight: bold;
}

.emptyStyle {
}

body.layout-compact .layout-wrapper .transparentBtn,
body.layout-compact .layout-wrapper .transparentBtn .ui-icon {
    background: none;
    border: none;
}

body.layout-compact .layout-wrapper .transparentBtn,
body.layout-compact .layout-wrapper .transparentBtn .ui-button-text,
body.layout-compact .layout-wrapper .transparentBtn.ui-state-disabled .ui-button-text {
    color: #212121;
}

body.layout-compact .layout-wrapper .transparentBtn .ui-icon {
    color: red;
}

body.layout-compact .layout-wrapper .transparentBtn.ui-state-active {
    border: 1px solid green;
}

body.layout-compact .layout-wrapper .transparentBtn.ui-state-active,
body.layout-compact .layout-wrapper .transparentBtn.ui-state-active .ui-icon {
    background: none;
    color: green;
}

body.layout-compact .layout-wrapper .transparentBtn {
    border: 1px solid #212121;
    box-shadow: none;
    -webkit-box-shadow: none;
}

body.layout-compact .layout-wrapper .transparentBtn .ui-icon {
    font-weight: bold;
}

body.layout-compact .layout-wrapper .transparentBtn:hover {
    border: 1px solid green;
    background-color: lightgray;
}

body.layout-compact .ui-panelgrid.slimMarginPPanelGrid .ui-panelgrid-cell {
    padding: 5px 10px;
}

body.layout-compact .ui-selectonemenu-item-group, body.layout-compact .ui-selectonemenu-item-group:focus {
    cursor: default;
    outline: 0;
}

body.layout-compact .ui-selectonemenu-item-group {
    background-color: #eaeaea;
    border-radius: 0;
    border-bottom: 1px solid grey;
}

body.layout-compact .ui-selectonemenu-panel.higherSelectOneMenuPanel .ui-selectonemenu-items-wrapper {
    max-height: 400px !important;
}

body.layout-compact .ui-selectonemenu-panel:not(.higherSelectOneMenuPanel) .ui-selectonemenu-items-wrapper {
    max-height: 300px !important;
}

body.layout-compact .ui-tooltip-text {
    white-space: pre-wrap;
    display: block;
    word-wrap: break-word;
}

/* Tooltips (u. a. die Info-Icons im Dashboard-Filter) auf eine lesbare
   Breite begrenzen und umbrechen, statt sie als sehr breite Einzeile
   darzustellen. Gilt global, da PrimeFaces das Tooltip-DOM ans <body>
   haengt und die einzelnen p:tooltip keine eigene styleClass tragen. */
.ui-tooltip {
    max-width: 360px;
}
.ui-tooltip .ui-tooltip-text {
    white-space: normal;
    word-wrap: break-word;
    overflow-wrap: anywhere;
}

.flipIconH .ui-icon {
    -moz-transform: scaleX(-1);
    -o-transform: scaleX(-1);
    -webkit-transform: scaleX(-1);
    transform: scaleX(-1);
    filter: FlipH;
    -ms-filter: "FlipH";
}

body.layout-compact .layout-wrapper .smallHeaderTabs .ui-tabs-header a {
    height: auto;
    max-width: 400px;
    overflow: hidden;
    white-space: normal;
    padding: 8px 14px !important;
}

.twoLineTabsExcludeFirst > .ui-tabs-nav > .ui-tabs-header > a,
.twoLineTabs > .ui-tabs-nav > .ui-tabs-header > a {
    height: 30px;
    max-width: 400px;
    /*text-overflow : ellipsis;*/
    white-space: pre;
    overflow: hidden;
}

.twoLineTabsExcludeFirst > .ui-tabs-nav > .ui-tabs-header:not(:first-child) > a,
.twoLineTabs > .ui-tabs-nav > .ui-tabs-header > a {
    padding-right: 40px !important;
}

.twoLineTabsExcludeFirst > .ui-tabs-nav > .ui-tabs-header:not(:first-child) > a::first-line,
.twoLineTabsExcludeFirst > .ui-tabs-nav > .ui-tabs-header:first-child > a,
.twoLineTabs > .ui-tabs-nav > .ui-tabs-header > a::first-line {
    color: #757575;
}

.twoLineTabsExcludeFirst > .ui-tabs-nav > .ui-tabs-header:not(:first-child) > a,
.twoLineTabs > .ui-tabs-nav > .ui-tabs-header > a {
    font-size: 12px;
    color: grey;
}

.ui-dialog-content .card {
    border: 1px solid lightgray
}

.ui-datatable .ui-datatable-data tr.ui-state-highlight .ui-button:hover {
    border: 1px solid lightgray
}

.ui-datatable .ui-datatable-data .ui-truncated-cell {
    overflow: hidden;
    text-overflow: ellipsis;
}

body .ui-selectmanycheckbox.ui-widget label {
    display: inline;
}

.ui-selectmanycheckbox.ui-widget td {
    padding-bottom: 10px;
}

.smallLineFieldset .ui-fieldset-legend,
.small-fieldset-legend .ui-fieldset-legend {
    padding-bottom: 0;
}

.ui-fieldset-legend {
    font-weight: bold;
}

.noScrollContentDialog .ui-dialog-content {
    overflow-y: hidden;
}

.red-row {
    color: red;
}

body.layout-compact .layout-wrapper .ui-selectonebutton .ui-button {
    background-color: lightgrey;
    color: black;
}

body.layout-compact .layout-wrapper .ui-selectonebutton .ui-button:hover {
    background-color: grey;
    color: white;
}

/* Aktiver (ausgewählter) Button - grün mit weißer Schrift */
body.layout-compact .layout-wrapper .ui-selectonebutton .ui-button.ui-state-active {
    background: rgb(0, 170, 48); /* Grüner Hintergrund */
    background: -moz-linear-gradient(top, rgba(0, 170, 48, 1) 1%, rgba(0, 110, 46, 1) 100%);
    background: -webkit-linear-gradient(top, rgba(0, 170, 48, 1) 1%, rgba(0, 110, 46, 1) 100%);
    background: linear-gradient(to bottom, rgba(0, 170, 48, 1) 1%, rgba(0, 110, 46, 1) 100%);
    color: white !important; /* Weiße Schrift */
    -moz-box-shadow: 0 1px 2.5px 0 rgba(0, 0, 0, 0.26), 0 1px 5px 0 rgba(0, 0, 0, 0.16);
    -webkit-box-shadow: 0 1px 2.5px 0 rgb(0 0 0 / 26%), 0 1px 5px 0 rgb(0 0 0 / 16%);
    box-shadow: 0 1px 2.5px 0 rgb(0 0 0 / 26%), 0 1px 5px 0 rgb(0 0 0 / 16%);
}

body.layout-compact .layout-wrapper .ui-selectonebutton .ui-button.ui-state-active:hover {
    background-color: #015a01 !important; /* Dunkleres Grün beim Hover */
    color: white !important;
}

.ui-selectbooleanbutton.ui-state-active .ui-button-text {
    color: white;
}

.ui-datatable-data tr:not(.ui-state-hover) .ui-selectonemenu.ui-state-focus {
    color: green;
}

.ui-datatable-data tr .ui-selectonemenu.ui-state-focus {
    background-image: linear-gradient(to bottom, #4CAF50, #4CAF50), linear-gradient(to bottom, #bdbdbd, #bdbdbd) !important;
}

.ui-datatable-data .ui-selectonemenu.ui-state-focus .ui-selectonemenu-label {
    font-weight: bold !important;
}

body.layout-compact .layout-wrapper .ui-message-warn-summary,
body.layout-compact .layout-wrapper .ui-message-info-summary {
    margin-right: 10px;
}

body.layout-compact .layout-wrapper .ui-message-warn-detail,
body.layout-compact .layout-wrapper .ui-message-warn-summary {
    color: black
}

body.layout-compact .layout-wrapper .ui-staticmessage {
    margin-top: 5px;
    padding: 5px
}

body.layout-compact .layout-wrapper .ui-message-warn-icon {
    color: #da0000;
}

/*paginator-current - Start*/
body.layout-compact .layout-wrapper .ui-paginator-current {
    float: left;
    margin-right: -50px;
    margin-left: 5px;
    margin-top: 2px;
    width: 0px;
    white-space: nowrap;
    color: #ebebeb;
}

body.layout-compact .layout-wrapper .ui-paginator-current:after {
    padding: 2px;
    display: none;
    position: relative;
    top: -22px;
    right: -60px;
    width: 220px;
    text-align: center;
    -moz-border-radius: 2px;
    -webkit-border-radius: 2px;
    -ms-border-radius: 2px;
    border-radius: 2px;
    color: #ffffff;
    background-color: rgba(66, 66, 66, 0.92);
    border: 2px solid green;
    border-radius: 30px;
}

/*paginator-current - ENDE*/

body.layout-compact .layout-wrapper .linebreakFooter .ui-dialog-footer.ui-widget-content {
    white-space: pre-wrap;
}

body.layout-compact .layout-wrapper .tableWithoutHeader thead {
    display: none;
}

body.layout-compact .layout-wrapper .card h3 {
    margin-top: 10px;
    width: auto;
    min-width: 33%;
    border-bottom: 1px solid grey;
    padding-bottom: 10px;
    margin-bottom: 10px;
    color: #424242;
    overflow-x: visible;
    white-space: nowrap;
}

body.layout-compact .layout-wrapper .ui-calendar input {
    width: 100px;
}

body.layout-compact .layout-wrapper .staticMessageGrey {
    margin: 0;
    background: none;
    color: grey;
    /*color      : #212121;*/
    border: none;
}

body.layout-compact .layout-wrapper .greenSelectonebutton.ui-selectonebutton .ui-button.ui-state-active {
    /*background-color : green;*/
    /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#00aa30+1,006e2e+100 */
    background: rgb(0, 170, 48); /* Old browsers */
    background: -moz-linear-gradient(top, rgba(0, 170, 48, 1) 1%, rgba(0, 110, 46, 1) 100%); /* FF3.6-15 */
    background: -webkit-linear-gradient(top, rgba(0, 170, 48, 1) 1%, rgba(0, 110, 46, 1) 100%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to bottom, rgba(0, 170, 48, 1) 1%, rgba(0, 110, 46, 1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#00aa30', endColorstr='#006e2e', GradientType=0); /* IE6-9 */
    color: white;
    -moz-box-shadow: 0 1px 2.5px 0 rgba(0, 0, 0, 0.26), 0 1px 5px 0 rgba(0, 0, 0, 0.16);
    -webkit-box-shadow: 0 1px 2.5px 0 rgb(0 0 0 / 26%), 0 1px 5px 0 rgb(0 0 0 / 16%);
    box-shadow: 0 1px 2.5px 0 rgb(0 0 0 / 26%), 0 1px 5px 0 rgb(0 0 0 / 16%);
    -moz-transition: background-color 1.0s;
    -o-transition: background-color 1.0s;
    -webkit-transition: background-color 1.0s;
    transition: background-color 1.0s;
}

body.layout-compact .layout-wrapper .greenSelectonebutton.ui-selectonebutton .ui-button.ui-state-active:hover {
    background-color: #015a01;
    color: white;
    -moz-transition: background-color 1.0s;
    -o-transition: background-color 1.0s;
    -webkit-transition: background-color 1.0s;
    transition: background-color 1.0s;
}

body.layout-compact .layout-wrapper .greenSelectonebutton.ui-selectonebutton .ui-button:focus,
body.layout-compact .layout-wrapper .greenSelectonebutton.ui-selectonebutton .ui-button.ui-state-focus {
    background-color: lightgrey;
    /*background-color : #015a01;*/
    color: white;
    border: none !important;
    -moz-box-shadow: 0 1px 2.5px 0 rgba(0, 0, 0, 0.26), 0 1px 5px 0 rgba(0, 0, 0, 0.16);
    -webkit-box-shadow: 0 1px 2.5px 0 rgb(0 0 0 / 26%), 0 1px 5px 0 rgb(0 0 0 / 16%);
    box-shadow: 0 1px 2.5px 0 rgb(0 0 0 / 26%), 0 1px 5px 0 rgb(0 0 0 / 16%);
    -moz-transition: background-color 1.0s;
    -o-transition: background-color 1.0s;
    -webkit-transition: background-color 1.0s;
    transition: background-color 1.0s;
}

body.layout-compact .layout-wrapper .staticMessageGrey .ui-message-info-icon {
    color: grey;
}

body.layout-compact .layout-wrapper .staticMessageGrey > span {
    display: block;
}

.biggerCheckbox {
    -ms-transform: scale(1.5); /* IE */
    -moz-transform: scale(1.5); /* FF */
    -webkit-transform: scale(1.5); /* Safari and Chrome */
    -o-transform: scale(1.5); /* Opera */
    transform: scale(1.5);
    padding: 10px;
}

body.layout-compact .layout-wrapper .ui-selectmanymenu .ui-selectlistbox-item .ui-chkbox .ui-chkbox-box.ui-state-active {
    border-color: #ffffff;
    background-color: green;
}

body.layout-compact .layout-wrapper .ui-selectmanymenu.ui-state-error {
    background-color: #ffc4c4;
    background-image: none;
}

td.spinnerCol {
    padding: 0 !important;
}

.ui-progressbar-value {
    background: linear-gradient(329deg, #23ff00, #000000, #ffffff);
    background-size: 600% 600%;
    -webkit-animation: ui-progressbar-value 1s ease infinite;
    -moz-animation: ui-progressbar-value 1s ease infinite;
    animation: ui-progressbar-value 1s ease infinite;
}

@-webkit-keyframes ui-progressbar-value {
    0% {
        background-position: 25% 0%
    }
    50% {
        background-position: 76% 100%
    }
    100% {
        background-position: 25% 0%
    }
}

@-moz-keyframes ui-progressbar-value {
    0% {
        background-position: 25% 0%
    }
    50% {
        background-position: 76% 100%
    }
    100% {
        background-position: 25% 0%
    }
}

@keyframes ui-progressbar-value {
    0% {
        background-position: 25% 0%
    }
    50% {
        background-position: 76% 100%
    }
    100% {
        background-position: 25% 0%
    }
}

body .qtip {
    font-size: 1em;
    line-height: 1.5;
}

.login-panel .ui-panel-footer {
    white-space: pre-wrap;
}

/*body.layout-compact .layout-wrapper .ui-button.ui-button-icon-only .ui-icon {*/
/*    width       : 20px;*/
/*    height      : 20px;*/
/*    font-size   : 20px;*/
/*    margin-top  : -10px;*/
/*    margin-left : -10px;*/
/*}*/

body.layout-compact .layout-wrapper .ui-button.ui-button-icon-only .ui-icon.ui-icon-playlist-play {
    width: 20px;
    height: 20px;
    font-size: 20px;
    margin-top: -9px;
    margin-left: -9px;
}

.smallLineFieldset {
    padding-right: 0px !important;
}

.smallLineFieldset td,
.smallLineFieldset .ui-panelgrid-cell {
    padding: 8px !important;
}

.smallLineFieldset td, .smallLineFieldset .ui-panelgrid-cell, .smallLineFieldset .ui-panelgrid-cell {
    white-space: nowrap;
    text-overflow: clip;
}

.smallLineFieldset td:first-child {
    max-width: 220px;
    white-space: nowrap;
    overflow-x: hidden;
}


body .rechteTable .ui-treetable-partialselected {
    /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#ffffff+0,a7d7ae+72 */
    background: #ffffff; /* Old browsers */
    background: -moz-linear-gradient(left, #ffffff 0%, #a7d7ae 72%); /* FF3.6-15 */
    background: -webkit-linear-gradient(left, #ffffff 0%, #a7d7ae 72%); /* Chrome10-25,Safari5.1-6 */
    background: linear-gradient(to right, #ffffff 0%, #a7d7ae 72%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#a7d7ae', GradientType=1); /* IE6-9 */
}

body .horizontalScroll .ui-datatable-tablewrapper {
    overflow-x: auto;
}

body.layout-compact .vertragPtGroupPickList .ui-picklist-list {
    height: 135px;
}


body.layout-compact .ui-selectcheckboxmenu-list-item:hover {
    background-color: #c8c8c8;
}

.ui-selectcheckboxmenu-multiple.gruppenFieldList .ui-selectcheckboxmenu-multiple-container {
    height: 100px;
    overflow-y: auto;
}

body .ui-selectcheckboxmenu-panel .ui-selectcheckboxmenu-item {
    padding-bottom: 0 !important;
    padding-top: 0 !important;
    margin: 3px;
}

body .ui-selectcheckboxmenu-panel .ui-selectcheckboxmenu-item label {
    padding: 10px 30px;
}

.searchPanelCol {
    vertical-align: top;
}

body.layout-compact .layout-wrapper .noBottomMarginSlideMenu.ui-slidemenu .ui-slidemenu-backward {
    margin-bottom: 0;
}

body.layout-compact .layout-wrapper .noBottomMarginSlideMenu.ui-slidemenu {
    margin-bottom: 0;
    padding-bottom: 0;
}

body.layout-compact .layout-wrapper .noBottomMarginSlideMenu.ui-slidemenu .ui-slidemenu-wrapper {
    height: calc(100vh - 388px) !important;
    min-height: 212px !important;
}

body.layout-compact .layout-wrapper .noBottomMarginSlideMenu.ui-slidemenu .ui-slidemenu-content {
    height: calc(100vh - 418px) !important;
    min-height: 185px !important;
}

body.layout-compact .ui-dialog .ui-dialog-content {
    margin-right: 20px;
}


body.layout-compact .ui-confirm-dialog-message {
    width: 80%;
}

.panelGrid200px {
    min-width: 200px;
}


body.layout-compact .ui-message > span {
    display: flex
}

/* SelectOneButton Styling */
.ui-selectonebutton .ui-state-active {
    background-color: #28a745 !important;
    color: white !important;
    border-color: #28a745 !important;
}

/* Chart Panel Styling */
.chart-panel {
    background: white;
    padding: 20px;
    border-radius: 4px;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

/* ============================================================
   Dashboard-Filter: einheitliches 4-Spalten-Raster
   (wird im Auswertungs-Dashboard für "Daten", "Darstellung" und
   "PIZ ABS – Erweiterte Filter" verwendet, damit die Label-Spalte
   und die Feld-Spalte über alle Panels hinweg in einer Flucht liegen.
   Wird in Kombination mit columnClasses="dfg-label,dfg-field,dfg-msg,dfg-spacer"
   auf dem p:panelGrid angewendet.)
   ============================================================ */
.dashboard-filter-grid {
    table-layout: fixed !important;
    width: 100% !important;
}

/* Feld-Labels (erste Spalte = ui-md-2) buendig an die Inhalts-/Bereichsleisten-
   Kante. Das PrimeFaces-Theme gibt den panelGrid-Zellen ein linkes Padding
   (16px) und den Labels zusaetzlich margin-left:5px - beides rueckt die Labels
   gegenueber den Sektions-Headern (Daten/Darstellung) ein. Die Label-Spalte
   wird daher linksbuendig gezogen; die Wert-Spalte (ui-md-9) bleibt unveraendert.
   Ergebnis: alle Feld-Labels fluchten exakt mit der Sektions-Header-Kante. */
.dashboard-filter-grid .ui-panelgrid-cell.ui-md-2 {
    padding-left: 0 !important;
}

.dashboard-filter-grid .ui-panelgrid-cell.ui-md-2 .ui-outputlabel {
    margin-left: 0 !important;
}

.dashboard-filter-grid .dfg-label {
    width: 260px !important;
    vertical-align: middle;
    white-space: nowrap;
}

.dashboard-filter-grid .dfg-field {
    width: auto !important;
    vertical-align: middle;
}

.dashboard-filter-grid .dfg-msg {
    width: 180px !important;
    vertical-align: middle;
}

.dashboard-filter-grid .dfg-spacer {
    width: 20px !important;
}

/* Collapse-Row fuer den optionalen "Linien je Vertrag separat"-Toggle.
   Die vier Zell-Wrapper (.linien-vertrag-toggle-cell) sind always-rendered,
   damit AJAX-Updates beim Vertragswechsel sie zuverlaessig adressieren
   koennen, ohne den vertragSelect mit-neuzurendern (sonst schliesst dessen
   Dropdown). Solange ihr Inhalt leer ist – also der Toggle bewusst nicht
   angezeigt wird – soll die <tr> aber keinen Platz beanspruchen.
   Browser-Support: :has() ist seit Chrome 105 / Safari 15.4 / Firefox 121
   stabil, was unsere Zielmatrix abdeckt. */
.dashboard-filter-grid .ui-panelgrid-cell:has(> .linien-vertrag-toggle-cell:empty) {
    display: none;
}

/* Analog zur Toggle-Row "Linien je Vertrag separat": always-rendered
   Wrapper, dafuer aber leere <tr> kollabieren, solange der Toggle
   "Diagramm pro Metrik" nicht angezeigt wird (also weniger als 2
   Metriken selektiert sind). */
.dashboard-filter-grid .ui-panelgrid-cell:has(> .diagramm-pro-metrik-cell:empty) {
    display: none;
}

/* Gleiches Muster fuer die optionalen Darstellungs-Zeilen (Multi-Pie,
   Normalisierung, Ranking): Die Wrapper bleiben fuer gezielte AJAX-Updates
   adressierbar, sollen aber im leeren Zustand keinen Grid-Platz belegen. */
.dashboard-filter-grid .ui-panelgrid-cell:has(> .darstellung-option-cell:empty) {
    display: none;
}

/* Generische Collapse-Regel fuer alle uebrigen optionalen Filter-Zeilen
   (Daten- und Darstellungs-Grid), z. B. VAUS/NVAUS, Schnellauswahl,
   Werteart, Kompakt-Modus, Aufschluesselung, Darstellungsweise. Die
   Zell-Wrapper bleiben always-rendered, damit gezielte AJAX-Updates sie
   adressieren koennen; die Grid-Zeile soll aber keinen Platz belegen,
   solange ihr bedingt gerenderter Inhalt leer ist. */
.dashboard-filter-grid .ui-panelgrid-cell:has(> .filter-collapsible-cell:empty) {
    display: none;
}

/* ============================================================
   Small Multiples: Layout pro Chart-Group (ein Diagramm je Metrik).
   Wird im Chart-Tab gerendert, wenn der Toggle "Diagramm pro Metrik"
   aktiv ist. Layout kommt vom Backend (controller.chartGroupLayoutCss).
   ============================================================ */
.chart-group {
    width: 100%;
    box-sizing: border-box;
}
.chart-group-stacked {
    display: flex;
    flex-direction: column;
    gap: 24px;
}
.chart-group-grid_2col {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
}
.chart-group-grid_3col {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 16px;
}
/* Responsives Auto-Fit-Grid (Standard für Small-Multiples): die Kacheln füllen die
   verfügbare Breite und brechen je nach Fenstergröße automatisch um – mehrere
   nebeneinander auf breiten Monitoren, eine Spalte auf schmalen. Ersetzt die frühere
   feste Spaltenzahl-Heuristik. */
.chart-group-responsive {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(380px, 1fr));
    gap: 16px;
}
/* Kompakt-Modus: dichteres Grid (mehr schmale Verläufe nebeneinander) + engere Tiles. */
.chart-group-responsive.chart-compact {
    grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
    gap: 10px;
}
.chart-compact .chart-tile {
    padding: 8px 10px;
}
.chart-compact .chart-tile-title {
    font-size: 0.85em;
    margin: 0 0 4px 0;
}
/* Responsive: auf schmalen Viewports immer eine Spalte. */
@media (max-width: 960px) {
    .chart-group-grid_2col,
    .chart-group-grid_3col,
    .chart-group-responsive {
        grid-template-columns: 1fr;
    }
}

.chart-tile {
    background: #ffffff;
    border: 1px solid #d8e2ec;
    border-radius: 6px;
    padding: 12px 14px;
    /* Tile-Fokus per Tab-Navigation sichtbar (WCAG 2.4.7 Focus Visible). */
    transition: box-shadow 0.15s ease, border-color 0.15s ease;
}
.chart-tile:focus,
.chart-tile:focus-visible {
    outline: none;
    border-color: #1a6191;
    box-shadow: 0 0 0 3px rgba(26, 97, 145, 0.25);
}
.chart-tile-title {
    margin: 0 0 8px 0;
    font-size: 1.0em;
    font-weight: 600;
    /* Kontrast #1a4a7a auf #ffffff = ~9.6:1, AA+AAA erfuellt. */
    color: #1a4a7a;
}

/* Print: Grid auf eine Spalte, kein Pagebreak innerhalb eines Tiles. */
@media print {
    .chart-group-grid_2col,
    .chart-group-grid_3col,
    .chart-group-responsive {
        grid-template-columns: 1fr;
    }
    .chart-tile {
        break-inside: avoid;
        page-break-inside: avoid;
    }
}

/* ============================================================
   Metriken-Chips im Auswertungs-Dashboard
   Echter p:commandButton, Look & Feel identisch zu den ausgewählten
   Segment-Buttons (grüner Gradient, s. Z. 1955ff). Klick entfernt die Metrik.

   WICHTIG: Die Hover-Farbe wird als Overlay-Pseudo-Element mit opacity-
   Transition eingeblendet, NICHT direkt über background-color. Grund: ein
   CSS-Gradient (background-image) lässt sich nicht weich zu einer flachen
   background-color überblenden - dabei verschwindet der Gradient abrupt und
   der Button flackert für einen Moment transparent/weiß.
   ============================================================ */
.metrik-chip.ui-button {
    position: relative;
    height: auto !important;
    padding: 4px 12px !important;
    margin: 0 !important;
    font-size: 0.82em !important;
    border-radius: 12px !important;
    overflow: hidden;
    /* identischer Gradient wie bei .ui-selectonebutton .ui-button.ui-state-active */
    background: rgba(0, 170, 48, 1) !important;
    background: linear-gradient(to bottom, rgba(0, 170, 48, 1) 1%, rgba(0, 110, 46, 1) 100%) !important;
    color: #fff !important;
    border: 1px solid #006e2e !important;
    box-shadow: 0 1px 2.5px 0 rgba(0, 0, 0, 0.26),
    0 1px 5px 0 rgba(0, 0, 0, 0.16) !important;
    transition: box-shadow 0.2s ease;
}

/* Hover-Farbe als Overlay. opacity:0 im Ruhezustand,
   opacity:1 bei Hover/UI-State-Hover → weiches Crossfade. */
.metrik-chip.ui-button::before {
    content: '';
    position: absolute;
    inset: 0;
    background: #015a01;
    opacity: 0;
    border-radius: inherit;
    transition: opacity 0.2s ease;
    pointer-events: none;
    z-index: 0;
}

/* Label muss über dem Overlay liegen */
.metrik-chip.ui-button .ui-button-text {
    position: relative;
    z-index: 1;
    padding: 0 !important;
    line-height: 1 !important;
}

/* Hover + Focus: identischer Effekt – Overlay einblenden.
   Der :focus-Zustand (z.B. nach Tab-Navigation) wirkt so genauso
   kräftig wie der :hover-Zustand und ist nicht mehr nur ein dezenter Rahmen.

   Der body.layout-compact .layout-wrapper Präfix ist nötig, damit unsere
   Selector-Spezifität die globale Regel in Z. 624ff schlägt, die
   .ui-button.ui-state-focus einen grünen Outline-Ring verpasst. */
body.layout-compact .layout-wrapper .metrik-chip.ui-button:not(:disabled):hover::before,
body.layout-compact .layout-wrapper .metrik-chip.ui-button.ui-state-hover:not(:disabled)::before,
body.layout-compact .layout-wrapper .metrik-chip.ui-button:not(:disabled):focus::before,
body.layout-compact .layout-wrapper .metrik-chip.ui-button:not(:disabled):focus-visible::before,
body.layout-compact .layout-wrapper .metrik-chip.ui-button.ui-state-focus:not(:disabled)::before {
    opacity: 1;
}

/* Native + PrimeFaces-Focus-Ring unterdrücken; der Overlay übernimmt die Sichtbarkeit.
   border wird explizit neu deklariert, weil die globale Regel (Z. 624ff) sie sonst
   auf grün überschreibt. */
body.layout-compact .layout-wrapper .metrik-chip.ui-button:not(:disabled):focus,
body.layout-compact .layout-wrapper .metrik-chip.ui-button:not(:disabled):focus-visible,
body.layout-compact .layout-wrapper .metrik-chip.ui-button.ui-state-focus:not(:disabled) {
    outline: 0 none !important;
    border: 1px solid #006e2e !important;
    box-shadow: 0 1px 2.5px 0 rgba(0, 0, 0, 0.26),
    0 1px 5px 0 rgba(0, 0, 0, 0.16) !important;
}

/* Letzter verbleibender Chip: nicht entfernbar */
.metrik-chip.ui-button:disabled,
.metrik-chip.ui-button.ui-state-disabled {
    opacity: 0.55 !important;
    cursor: not-allowed !important;
}

/* ============================================================
   WCAG 2.4.7 Focus Visible für ⓘ-Hilfe-Icons im Dashboard-Filter
   tabindex="0" + role="img" auf <span> hat im Browser-Default
   keinen WCAG-konformen Fokus-Indikator. Hier explizit setzen.
   ============================================================ */
[role="img"][tabindex="0"]:focus-visible {
    outline: 2px solid #1a6191;
    outline-offset: 2px;
    border-radius: 2px;
}

/* ============================================================
   PDF-Export Loading-Spinner
   Wird waehrend der clientseitigen PDF-Generierung auf den
   Button-Icon-Slot gelegt. Visuelles Feedback, weil der Vorgang
   bei vielen Charts mehrere Sekunden dauern kann.
   ============================================================ */
@keyframes pdf-spinner-rotate {
    from { transform: rotate(0deg); }
    to   { transform: rotate(360deg); }
}
.pdf-spinner-icon {
    animation: pdf-spinner-rotate 1s linear infinite;
    display: inline-block;
    transform-origin: 50% 50%;
}
@media (prefers-reduced-motion: reduce) {
    .pdf-spinner-icon {
        animation: none;
    }
}

/* Aktiv-State des PDF-Buttons waehrend der Generierung.
   Heller gruener Hintergrund + kraeftiger gruener Rahmen + schwarze
   Schrift signalisieren "ich arbeite gerade". Kontrast schwarz auf
   #c8e6c9 = ca. 13:1, deutlich ueber WCAG 2.1 AA (4.5:1).
   !important ist hier noetig, weil PrimeFaces' .ui-state-disabled
   eigene Hintergrund-, Border- und Opacity-Regeln setzt, die wir
   gezielt ueberstimmen muessen (cursor: progress statt not-allowed,
   weil der Button nicht "kaputt" ist, sondern beschaeftigt). */
.pdf-export-loading.ui-button,
.pdf-export-loading.ui-button.ui-state-disabled,
.pdf-export-loading.ui-button.ui-state-disabled:hover {
    background: #c8e6c9 !important;
    background-image: none !important;
    border: 2px solid #2e7d32 !important;
    color: #000 !important;
    opacity: 1 !important;
    cursor: progress !important;
}
.pdf-export-loading .ui-button-text,
.pdf-export-loading .ui-icon {
    color: #000 !important;
}

/* Dashboard p:selectOneButton Layout-Fix & Zentrierung */
.dashboard-filter-grid .ui-selectonebutton {
    display: flex !important;
    flex-wrap: nowrap !important;
    width: 100% !important;
    align-items: stretch !important;
}

.dashboard-filter-grid .ui-selectonebutton .ui-button {
    flex: 1 1 0 !important;
    height: auto !important;
    padding: 0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.dashboard-filter-grid .stoerkategorie-bereich-buttonbar.ui-selectonebutton,
.dashboard-filter-grid .metrik-preset-buttonbar.ui-selectonebutton {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: wrap !important;
    justify-content: flex-start !important;
    align-items: stretch !important;
    gap: 6px;
}

.dashboard-filter-grid .stoerkategorie-bereich-buttonbar.ui-selectonebutton .ui-button,
.dashboard-filter-grid .metrik-preset-buttonbar.ui-selectonebutton .ui-button {
    display: inline-flex !important;
    flex: 0 0 auto !important;
    width: auto !important;
    min-width: 88px;
    max-width: 180px;
    margin: 0 !important;
    float: none !important;
}

/* Metrik-Presets sind zweizeilig aufgebaut: Hauptbegriff oben, Detailtext
   (frueher in Klammern) darunter. Der Controller liefert beide Teile durch
   ein \n getrennt; white-space:pre-line rendert das als echten Umbruch.
   Grosszuegiges horizontales Padding, damit der Text luftig steht.
   align-items:stretch auf der Leiste sorgt fuer einheitliche Button-Hoehe,
   sodass auch der einzeilige "Alle"-Button gleich hoch ist. */
.dashboard-filter-grid .metrik-preset-buttonbar.ui-selectonebutton .ui-button {
    max-width: 460px;
    white-space: pre-line;
    line-height: 1.3;
    text-align: center;
    padding: 8px 18px !important;
}

/* PrimeFaces legt den Label-Text in einen inneren .ui-button-text-Span mit
   eigenem Padding und white-space:nowrap - beides ueberschreiben, damit
   unser Button-Padding nicht doppelt wirkt und der \n-Umbruch greift. */
.dashboard-filter-grid .metrik-preset-buttonbar.ui-selectonebutton .ui-button .ui-button-text {
    padding: 0 !important;
    white-space: pre-line !important;
}

/* Störkategorie-Bereich-Buttons ebenfalls zweizeilig: Range oben (z.B. "100er"),
   Klartext darunter (z.B. "Fahrzeug"). Controller liefert beide per \n getrennt;
   white-space:pre-line rendert den Umbruch. Einzeilige Buttons ("Alle"/"Keine")
   bleiben einzeilig und werden durch align-items:stretch der Leiste gleich hoch. */
.dashboard-filter-grid .stoerkategorie-bereich-buttonbar.ui-selectonebutton .ui-button {
    white-space: pre-line;
    line-height: 1.25;
    text-align: center;
    padding: 6px 12px !important;
    min-width: 96px;
    max-width: 200px;
}

.dashboard-filter-grid .stoerkategorie-bereich-buttonbar.ui-selectonebutton .ui-button .ui-button-text {
    padding: 0 !important;
    white-space: pre-line !important;
}

.dashboard-filter-grid .darstellung-select-buttonbar.ui-selectonebutton {
    flex-wrap: wrap !important;
    column-gap: 0;
    row-gap: 6px;
}

.dashboard-filter-grid .darstellung-select-buttonbar.ui-selectonebutton .ui-button {
    flex: 1 1 180px !important;
    min-width: 180px;
}

.dashboard-filter-grid .ui-selectonebutton .ui-button .ui-button-text {
    white-space: normal !important;
    line-height: 1.2 !important;
    padding: 0.4em 0.2em !important;
    word-break: break-word;
    display: block !important;
    width: 100%;
    text-align: center;
}

/* HTML-Chart-Tooltip (Ersatz für den Canvas-Tooltip): rendert außerhalb des
   Canvas und wird vom JS am Viewport ausgerichtet (Position/Sichtbarkeit setzt
   das JS inline). max-height begrenzt extrem lange Tooltips auf den Bildschirm,
   statt sie am kleinen Canvas-Rand abzuschneiden. pointer-events:none, damit der
   Tooltip nie ins Hover-/Maus-Verhalten eingreift. */
.quma-chart-tooltip {
    background: rgba(0, 0, 0, 0.85);
    color: #fff;
    padding: 8px 10px;
    border-radius: 6px;
    box-shadow: 0 4px 14px rgba(0, 0, 0, 0.35);
    font-size: 0.85em;
    line-height: 1.4;
    max-width: 90vw;
    max-height: 92vh;
    overflow: hidden;
    pointer-events: none;
    z-index: 11000;
}

.quma-chart-tooltip__title {
    font-weight: 700;
    margin-bottom: 4px;
    white-space: nowrap;
}

.quma-chart-tooltip__row {
    display: flex;
    align-items: center;
    white-space: nowrap;
}

.quma-chart-tooltip__swatch {
    display: inline-block;
    width: 10px;
    height: 10px;
    margin-right: 6px;
    border: 1px solid transparent;
    /* Garantierter heller Ring (unabhängig von der inline gesetzten Serienfarbe),
       damit auch halbtransparente Serienfarben gegen den dunklen Tooltip-Hintergrund
       klar abgegrenzt sind (WCAG 1.4.11). Die Info steht zusätzlich als Klartext. */
    box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.7);
    border-radius: 2px;
    flex: 0 0 auto;
}

/* Icon-Größe in den runden Konfig-Buttons (Übernehmen/Speichern/Umbenennen/Löschen)
   auf 18px. !important, da Theme-Regeln zur Icon-Größe höher spezifisch sind. */
.konfig-icon-btn {
    border-radius: 50% !important;
    padding: 0 !important;
    flex-shrink: 0 !important;
}

.konfig-icon-btn .ui-icon {
    font-size: 18px !important;
    line-height: 18px !important;
}

/* p:confirmDialog global="true" ignoriert position-Attribut; Top-Positionierung via CSS */
.konfig-confirm-dialog.ui-dialog {
    top: 75px !important;
}
