﻿/* Global */
html, body {
    height: 100%;
    margin: 0;
    padding: 0;
}

a {
    color: #00535C;
}

    a:hover, a:focus {
        text-decoration: none;
    }

    a.disabled {
        opacity: .65;
        pointer-events: none;
        cursor: not-allowed !important;
    }

p.well {
    line-height: 1.75;
}

template {
    display: none;
}

a:hover, a:focus, a:visited {
    text-decoration: none;
}

h1 {
    padding: 15px;
    margin: 15px 0 1px 0;
    color: #808080;
    font-size: 30px;
    font-weight: bold;
    line-height: 30px;
    border-bottom: 5px solid #00535C;
}

.page-admin .page-header {
    margin: 0;
    padding: 0;
    border: 0;
    background-color: #B2C9CC;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 1001;
}

    .page-admin .page-header .page-logo {
        padding-top: 15px;
        width: 250px;
        height: 50px;
        float: left;
        border-right: 1px solid #00535C;
    }

        .page-admin .page-header .page-logo a {
            display: block;
            text-align: center;
        }

        .page-admin .page-header .page-logo img {
            max-width: 200px;
        }

    .page-admin .page-header .page-navigation-main {
        color: #FFFFFF;
        height: 50px;
        margin: 0 0 0 250px;
        border: 0;
        border-bottom: 5px solid #333333;
        background-color: #00535C;
        box-shadow: 0 1px 6px 0 rgba(0,0,0,0.12), 0 1px 6px 0 rgba(0,0,0,0.12);
    }

        .page-admin .page-header .page-navigation-main .navbar-nav > li > a {
            color: #FFFFFF;
            line-height: 15px;
        }

            .page-admin .page-header .page-navigation-main .navbar-nav > li > a:hover,
            .page-admin .page-header .page-navigation-main .navbar-nav > li > a:focus {
                color: #333333;
                background-color: #B2C9CC;
            }

        .page-admin .page-header .page-navigation-main .menu-user .img-user {
            float: left;
            width: 25px;
            height: 25px;
            margin-top: -2px;
            margin-right: 10px;
        }

        .page-admin .page-header .page-navigation-main .navbar-nav > li {
            float: left;
        }

            .page-admin .page-header .page-navigation-main .navbar-nav > li > .dropdown-menu {
                position: absolute;
                right: 0;
                left: auto;
                min-width: 200px;
            }

        .page-admin .page-header .page-navigation-main .badge {
            position: absolute;
            top: 5px;
            right: 0px;
            background-color: #B2101D;
        }

.page-admin .page-navigation-side {
    height: 100%;
    width: 250px;
    float: left;
    margin: 0;
    padding: 100px 0 0 0;
    border: 0;
    border-right: 1px solid #00535C;
    background-color: #B2C9CC;
    box-shadow: 0 8px 17px 0 rgba(0,0,0,0.2), 0 6px 20px 0 rgba(0,0,0,0.19);
    position: fixed;
    top: 0;
    left: 0;
    z-index: 1000;
}

    .page-admin .page-navigation-side .panel {
        margin: 0;
        padding: 0;
        border: 0;
        border-top: 1px solid #E6E6E6;
        box-shadow: none;
        background-color: transparent;
    }

        .page-admin .page-navigation-side .panel:first-child {
            border: 0;
        }

    .page-admin .page-navigation-side .sidebar-menu ul {
        margin: 0;
        padding: 0;
        list-style: none;
    }

        .page-admin .page-navigation-side .sidebar-menu ul li {
            margin: 0;
            padding: 0;
            border-top: 1px solid #00535C;
        }

    .page-admin .page-navigation-side .sidebar-menu > ul > li:not(.header) {
        border-left: 10px solid transparent;
    }

    .page-admin .page-navigation-side .sidebar-menu > ul > li.header {
        color: #FFFFFF;
        padding: 10px;
        font-weight: bold;
        letter-spacing: 5px;
        background-color: #00535C;
    }

    .page-admin .page-navigation-side .sidebar-menu ul li a {
        color: #333333;
        display: block;
        padding: 10px;
    }

    .page-admin .page-navigation-side .sidebar-menu > ul > li > a {
        font-weight: bold;
    }

        .page-admin .page-navigation-side .sidebar-menu > ul > li > a > i.fa {
            width: 20px;
        }

    .page-admin .page-navigation-side .sidebar-menu > ul > li:not(.header):hover,
    .page-admin .page-navigation-side .sidebar-menu > ul > li:not(.header).active {
        border-color: #00535C;
        background-color: #9BBABE;
    }

    /*geöffneter Menüeintrag */
    .page-admin .page-navigation-side .sidebar-menu ul li ul li {
        border-right: 5px solid transparent;
        background-color: #E7EEEF;
    }

        .page-admin .page-navigation-side .sidebar-menu ul li ul li:hover,
        .page-admin .page-navigation-side .sidebar-menu ul li ul li.active {
            border-right-color: #00535C;
            background-color: #FFFFFF;
        }

    /*Wenn ein Menüeintrag selbst einen Link enthält, dann soll der Menüeintrag als aktiv weiß angezeigt werden */
    .page-admin .page-navigation-side .sidebar-menu ul li > a:first-child[href]:not([href="#"]):not([href=""]) {
        border-right: 5px solid transparent !important;
        background-color: #E7EEEF !important;
    }

    .page-admin .page-navigation-side .sidebar-menu ul li:hover > a:first-child[href]:not([href="#"]):not([href=""]),
    .page-admin .page-navigation-side .sidebar-menu ul li.active > a:first-child[href]:not([href="#"]):not([href=""]) {
        border-right-color: #00535C !important;
        background-color: #FFFFFF !important;
    }

    .page-admin .page-navigation-side .sidebar-menu ul ul li a {
        padding-left: 30px;
    }


body.sidebar-hidden .page-header .page-logo {
    display: none;
}

body.sidebar-hidden .page-header .page-navigation-main {
    margin-left: 0;
}

body.sidebar-hidden .page-navigation-side {
    display: none;
}

body.sidebar-hidden .page-content {
    padding-left: 15px;
}

.page-admin .page-navigation-side .panel-footer {
    padding: 15px;
    border: 0;
    margin-top: 25px;
}

.page-admin .page-content {
    padding: 75px 15px 75px 275px;
    min-height: 500px;
}

.page-footer {
    z-index:999;
}

.page-admin .page-footer {
    border: 0;
    border-top: 15px solid #00535C;
    background-color: #B2C9CC;
}

    .page-admin .page-footer ul {
        margin: 0;
    }

    .page-admin .page-footer .page-footer-container {
        padding: 10px 10px 5px 260px;
    }

.modal {
    z-index: 10101;
}

@media (max-width: 767px) {
    #sidenav {
        position: fixed;
    }

    .page-admin .page-content,
    .page-admin .page-footer .page-footer-container {
        padding-left: 15px;
    }

        .page-admin .page-footer .page-footer-container ul li {
            display: block;
        }
}



#overlay {
    background-color: rgba(0, 0, 0, 0.3);
    z-index: 999;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
}

/*Modal Dialog*/
    .modal-dialog .modal-header {
        color: #FFFFFF;
        font-size: 18px;
        font-weight: bold;
        border-bottom: 1px solid #EEEEEE;
        background-color: #628590;
    }

        .modal-dialog .modal-header.modal-header-primary {
            background-color: #428bca;
        }

        .modal-dialog .modal-header.modal-header-success {
            background-color: #5cb85c;
        }

        .modal-dialog .modal-header.modal-header-warning {
            background-color: #f0ad4e;
        }

        .modal-dialog .modal-header.modal-header-danger {
            background-color: #d9534f;
        }

        .modal-dialog .modal-header .btn {
            position: absolute;
            top: 0;
            right: 0;
            margin-top: 0;
            border-top-left-radius: 0;
            border-bottom-right-radius: 0;
            color: #333;
            background-color: #fff;
            border-color: #ccc;
            opacity: 0.8;
        }

    .modal-dialog .modla-body .modal-body-question {
        font-weight: bold;
    }

    .modal-dialog .modla-body .modal-body-question-additional {
        margin-top: 15px;
    }

    .modal-dialog .modal-footer {
        padding: 5px;
        border-top: 1px solid #ACAEB0;
        background-color: #F9F9F9;
    }

        .modal-dialog .modal-footer .btn-group > .btn:first-child {
            border-bottom-left-radius: 0;
        }

        .modal-dialog .modal-footer .btn-group > .btn:last-child {
            border-top-right-radius: 0;
        }


/* Forms */
.panel {
    border: 1px solid #00535C;
    border-radius: 3px;
    box-shadow: 0px 9px 16px gainsboro;
}

    .panel .panel {
        border: 1px solid #CCCCCC;
        box-shadow: none;
    }

.panel-header,
.panel-heading {
    color: #FFFFFF;
    background-color: #00535C;
    font-size: 16px;
    font-weight: bold;
    padding: 10px;
    border: 1px solid #00535C;
    border-radius: 0;
}
.panel-heading-padding {
    padding: 10px;
}

.panel .panel .panel-header,
.panel .panel .panel-heading {
    color: #333333;
    border-color: #EEEEEE;
    border-bottom-color: #CCCCCC;
    background-color: #EEEEEE;
}

.panel-actions {
    margin-top: 15px;
    margin-bottom: 10px;
}

    .panel-actions .text-left .btn {
        margin-right: 10px;
    }

    .panel-actions .text-right .btn {
        margin-left: 10px;
    }


.panel h3 {
    display: block;
    width: 100%;
    padding: 0;
    margin-bottom: 20px;
    font-size: 21px;
    line-height: inherit;
    color: #333;
    border: 0;
    border-bottom: 1px solid #e5e5e5;
    padding-left: 10px;
}

.select2 {
    width: 100% !important;
}

/* Verhindert unschönes brechen vom clear Button bei Mehrfachselektierung */
.select2-container--default .select2-selection--multiple .select2-selection__rendered {
    padding-right: 30px;
}

.select2-container--default .select2-selection--multiple .select2-selection__clear {
    cursor: pointer;
    float: none;
    font-weight: bold;
    margin-top: 0;
    margin-right: 0px;
    position: absolute;
    right: 20px;
    top: 5px;
}

/*Table Grid */
table thead tr {
    color: #FFFFFF;
    background-color: #00535C;
}

.select2-search__field {
    color: #45484D !important;
}

.table-hover > tbody > tr:hover {
    background-color: #F0F0F0;
}

table.table-striped, table.table-striped thead tr th, table.table-striped tr td {
    border: 1px solid #505050;
}

/* Table styles */
.row-loading, .row-nodata {
    font-weight: bold;
    font-style: italic;
    text-align: center;
}

.row-spacer {
    height: 1px;
    line-height: 1px;
    font-size: 1px;
    overflow: hidden;
    background-color: #CCCCCC;
}

.row-filter, .row-filter td {
    background-color: #E0E0E0;
}

    .row-filter select {
        padding-left: 5px;
        min-width: 75px;
    }

thead tr th {
    text-align: left !important;
}

.column-auto {
    width: auto;    
}

.column-icon {
    width: auto;
    vertical-align: middle !important;
}

.column-actions {
    width: 15px;
    white-space: nowrap;
    text-align: center;
    vertical-align: middle !important;
}

.column-detail {
    width: 25px;
    text-align: center;
    vertical-align: middle !important;
}

.column-id {
    width: 100px;
    text-align: right;
}

.column-date {
    width: 125px;
    text-align: right;
    white-space: nowrap;
}

.column-datetime {
    width: 140px;
    text-align: right;
    white-space: nowrap;
}

.column-date-range {
    width: 200px;
    text-align: right;
    white-space: nowrap;
}

.column-icon {
    width: 25px;
    text-align: center;
    white-space: nowrap;
}

.column-shortnumber {
    width: 50px;
    text-align: left;
    white-space: nowrap;
}

thead .column-icon {
    white-space: normal !important;
}

.column-text {
    width: 200px;
    overflow-wrap: normal;
    overflow: auto;
    max-width: 200px;
}

.column-smalltext {
    width: 100px;
}

.column-actions {
    width: 10px;
    white-space: nowrap;
    text-align: right;
}

.column-number {
    width: 150px;
    white-space: nowrap;
}

.column-numeric, .column-number {
    width: 75px;
    text-align: right;
    white-space: nowrap;
}
.column-status {
    width: 280px;
    white-space: nowrap;
}

/* Buttons */
/* Speichern Buttons unten rechts fix fließen lassen*/
.container-static-save {
    position: fixed;
    right: 25px;
    bottom: 50px;
    padding: 10px 5px 10px 5px;
    margin-bottom: 0;
    z-index: 997;
    background-color: rgba(0,0,0,0.1);
    border-radius: 10px;
}

.action-buttons-fixed {
    position: fixed;
    right: 15px;
    bottom: 20px;
    z-index: 10;
}

.form-ajax, .form-loading, .form-error {
    display: none;
}

.form-ajax {
    position: relative;
}

.form-loading, .form-error {
    padding: 15px;
    text-align: center;
}


.text-bold {
    font-weight: bold;
}

.label-checkbox {
    font-weight: normal;
}
.label-text-right {
    margin-left: 4px;
}
.label-text-left {
    margin-right: 4px;
}

.list-group-item.disabled label {
    cursor: not-allowed;
}

.table-paged {
    margin-bottom: 0 !important;
}

.panel-table-pager {
    padding: 5px;
    margin-bottom: 15px;
    background-color: #E2E2E2;
    border: 1px solid #67696D;
}

    .panel-table-pager .pager-page input {
        text-align: center;
    }

    .panel-table-pager .pager-recordcount {
        padding-top: 5px;
        text-align: right;
    }


table thead a, table thead a:active, table thead a:focus {
    color: #EAEAEA;
}

    table thead a:hover {
        color: #FFFFFF;
    }

    /* Table Head - Sort Icon*/
    table thead a.sort,
    table thead a.sort-asc,
    table thead a.sort-desc {
        display: block;
        position: relative;
        padding-right: 15px;
    }

        table thead a.sort:after,
        table thead a.sort-asc:after,
        table thead a.sort-desc:after {
            display: block;
            position: absolute;
            color: #FFFFFF;
            top: 0;
            right: 0;
            font-family: 'Font Awesome 5 Free';
            font-size: 16px;
            font-weight: normal;
            opacity: 0.3;
        }

        table thead a.sort:after {
            font-weight: 900;
            content: "\f0dc";
        }

        table thead a.sort-asc:after {
            content: "\f0de";
            opacity: 0.8;
        }

        table thead a.sort-desc:after {
            content: "\f0dd";
            opacity: 0.8;
        }
    /* Table Head - Check / Uncheck Icon*/
    table thead a.check,
    table thead a.check-asc,
    table thead a.check-desc {
        display: block;
        position: relative;
        padding-right: 15px;
    }

        table thead a.check:after,
        table thead a.check-checked:after,
        table thead a.check-unchecked:after {
            display: block;
            position: absolute;
            color: #FFFFFF;
            top: 0;
            right: 0;
            font-family: 'FontAwesome';
            font-size: 16px;
            font-weight: normal;
            opacity: 0.3;
        }

        table thead a.check:after {
            content: "\f0c8";
        }

    table thead a.check-checked:after {
        content: "\f14a";
        opacity: 0.8;
    }

    table thead a.check-unchecked:after {
        content: "\f0c8";
        opacity: 0.8;
    }

@media (max-width: 991px) {
    .pager-pagesize, .pager-page, .pager-recordcount {
        text-align: center !important;
        padding: 15px;
    }
}

label {
    border: 1px solid transparent;
    border-bottom-width: 2px;
}

.form-group {
    margin-bottom: 10px;
}

.form-horizontal .control-label {
    text-align: left;
}

.form-control {
    border-bottom-width: 2px;
}

.form-control-static {
    background-color: #F3F3F3;
}

.list-group label {
    margin-bottom: 0;
}

.list-group-item {
    padding: 5px 10px;
}

.checkbox-inline input[type="checkbox"] {
    margin-top: 0;
}

.form-control,
.form-control:focus {
    box-shadow: none;
    border-radius: 0;
}

    .form-control:focus {
        border-bottom: 2px solid #00535C;
    }

.pnlUpload {
    border: 1px solid #00535C;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

    .pnlUpload .upload-title {
        padding: 5px;
        color: #FFFFFF;
        background-color: #00535C;
    }

    .pnlUpload .upload-item-wrapper {
        display: table;
        width: 100%;
        height: 150px;
    }

        .pnlUpload .upload-item-wrapper .upload-item {
            padding: 5px;
            display: table-cell;
            text-align: center;
            vertical-align: middle;
        }

            .pnlUpload .upload-item-wrapper .upload-item img {
                max-width: 100%;
                max-height: 80px;
            }

    .pnlUpload .upload-action input {
        width: 100%;
        border-radius: 0;
    }

span.headline {
    display: block;
    font-weight: bold;
    border-bottom: 2px solid #555555;
}

/* Tabs */
.nav-tabs {
    border-bottom: 2px solid #086A1F;
    margin-bottom: 10px;
}

    .nav-tabs > li {
        font-weight: bold;
        margin-right: 15px;
        background-color: #F3F3F3;
        margin-bottom: 0;
        border: none;
    }

        .nav-tabs > li a:hover,
        .nav-tabs > li.active
        .nav-tabs > li.active a,
        .nav-tabs > li.active a:hover {
            color: #000;
            background-color: #FFF;
            border-color: #00535c;
        }

        .nav-tabs > li > a {
            letter-spacing: 1px;
            border: 1px solid #E0E0E0;
            border-bottom: 0 !important;
        }

        .nav-tabs > li > a,
        .nav-tabs > li.active > a:focus,
        .nav-tabs > li.active > a:hover {
            border-radius: 0;
            margin: 0;
        }

/* Dropdown Button */
.btn-DropDown {
    background-color: #FFF;
}

    .btn-DropDown a.dropdown-item {
        display: block;
        color: #45484D;
        padding: 5px;
        font-size: 15px;
        text-align: center;
        font-weight: bold;
    }

        .btn-DropDown a.dropdown-item:not(:last-child) {
            border-bottom: 1px solid #45484D;
        }

        .btn-DropDown a.dropdown-item:hover {
            background-color: #e0e0e0;
        }
/* SubTabs*/
.sub-tabs {
    background-color: #F3F3F3;
    border: none;
    margin-top: -10px;
    font-size: 12px;
    margin-bottom: 10px;
    /*max-height: 40px;*/
    min-height: 40px !important;
}

    .sub-tabs .navbar {
        /*max-height: 40px;*/
        min-height: 40px !important;
    }

    .sub-tabs ul {
        border: none;
        margin-bottom: 0;
        background: #F3F3F3;
    }

        .sub-tabs ul li {
            border: none;
            background: #F3F3F3;
        }

            .sub-tabs ul li a {
                border: none;
                background: #F3F3F3;
            }

        .sub-tabs ul > li a:hover, .sub-tabs ul > li.active a, .sub-tabs ul > li.active a:hover {
            background: #F3F3F3 !important;
            color: #45484D !important;
            border-top: none !important;
            border-left: none !important; /*1px solid #e0e0e0 !important;*/
            border-right: none !important; /*1px solid #e0e0e0 !important;*/
            border-bottom: 3px solid #45484D !important;
        }

.no-padding {
    padding: 0px !important;
}

.no-horizontal-padding {
    padding-left: 0px !important;
    padding-right: 0px !important;
}

.no-left-padding {    
    padding-left: 0px !important;
}

.no-right-padding {
    padding-right: 0px !important;
}

#holdon-overlay {
    z-index: 99999 !important;
}

.dropdown-menu li {
    cursor: pointer;
}

/*Cookie*/
.cookie-bar {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 100000;
    color: #DDDDDD;
    background-color: #464646;
    font-size: 12px;
}

    .cookie-bar .cookie-bar-inner-left,
    .cookie-bar .cookie-bar-inner-right {
        padding: 15px;
    }

    .cookie-bar .cookie-bar-inner-right {
        float: right;
    }

    .cookie-bar a {
        color: #DDDDDD;
        text-decoration: underline;
    }

    .cookie-bar button {
        color: #464646;
        background-color: #DDDDDD;
        padding: 6px 9px;
        border: 1px solid #000000;
        font-weight: bold;
    }

        .cookie-bar button:hover {
            cursor: pointer;
            background-color: #F0F0F0;
        }

.ControlWrapper {
    background: white;
    padding: 10px;
    border: 1px dashed #c1c1c1;
    margin-left: 15px;
}

/* Bootstrap Datepicker */
.dropdown-menu, .bootstrap-datetimepicker-widget.dropdown-menu:hover {
    background: white !important;
}

.table.table-condensed tr:first-child {
    border: 1px solid black;
}

.bootstrap-datetimepicker-widget tr, .bootstrap-datetimepicker-widget th {
    border-radius: 0 !important;
}

.bootstrap-datetimepicker-widget table thead tr:first-child th:hover {
    background: none !important;
}

.bootstrap-datetimepicker-widget .datepicker-days table td {
    border: 1px solid #e0e0e0;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
/* KW Spalte links auffüllen */
.bootstrap-datetimepicker-widget .datepicker {
    padding-left: 0;
}

.bootstrap-datetimepicker-widget th:hover {
    background-color: rgba(0,128,53,0.3);
    cursor: default;
}
/* Horizontale Linie bei den Wochentagen */
.bootstrap-datetimepicker-widget thead tr:first-child {
    border-bottom: 1px solid #086a1f;
}
/* Vertikale Linien bei den Wochentagen */
.bootstrap-datetimepicker-widget thead tr:nth-child(2) th:not(:last-child) {
    border-right: 1px solid #086a1f;
}
/* Route bei Spalte KW zentrieren */
.bootstrap-datetimepicker-widget thead tr:nth-child(2) th:first-child {
    text-align: center !important;
}

/* Timepicker */
.bootstrap-datetimepicker-widget .timepicker-picker table tr:nth-child(2) {
    border: 1px solid #e0e0e0;
    background-color: #f3f3f3;
}

.bootstrap-datetimepicker-widget .row .timepicker {
    margin-left: -25px;
    width: calc(50% + 25px);
}

/* Ohne diesen Workaround wird der Datepicker oben links auf der Seite angezeigt 
    Wenn man die td relative setzt, wird unter IE und FF kein Border angezeigt

*/
td input.datepicker, td input.datetimepicker, td input.timpicker {
    position: relative;
}

.icon-arrow-left {
    font-family: 'Font Awesome 5 Free';
    font-weight: 900;
    content: "\f0dc";
}

.error {
    background-color: rgba(220, 53, 69, 0.3);
}

#pnlDebug .modal-content {
    width: 1500px !important;
}

.nav-tabs.disabled {
    pointer-events: none;
}
/* intl-tel-input: Pfad zu den Flaggen*/
.iti__flag {
    background-image: url("~/libs/intl-tel-input/img/flags.png");
}

@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
    .iti__flag {
        background-image: url("~/libs/intl-tel-input/img/flags@2x.png");
    }
}

.question-required {
    height: 14px;
    margin-top: auto;
    margin-bottom: auto;
    font-size: 10px;
    color: #ec7070;
    vertical-align: super;
    transform: translate(0px, -5px);
}

.table-required::after {
    content: "\002a\0020";
    color: #FF0000;
    font-weight: bold;
    font-size: 1.5em;
    vertical-align: text-top;
}

.fileList {
    margin: 2px 0 0 0;
}

.smiley {
    font-size: 32px;
    padding: 4px;
}

.status-success, .status-warning, .status-inprogress {
    font-size: 1em;
    margin-left: auto;
    margin-right: auto;
    display: block;
    text-align: center;
}

.status-empty::before {
    display: block;
    content: "";
    width: 32px;
    height: 32px;
    margin-left: auto;
    margin-right: auto;
}

.status-success::before {
    display: block;
    content: "";
    width: 32px;
    height: 32px;
    background: transparent url(../img/icons/icon-ok-32.png) no-repeat;
    margin-left: auto;
    margin-right: auto;
}

.status-warning::before {
    display: block;
    content: "";
    width: 32px;
    height: 32px;
    background: transparent url(../img/icons/icon-attention.png) no-repeat;
    margin-left: auto;
    margin-right: auto;
}

.status-inprogress::before {
    display: block;
    content: "";
    width: 32px;
    height: 32px;
    background: transparent url(../img/icons/icon-inprogress-32.png) no-repeat;
    margin-left: auto;
    margin-right: auto;
}

.status-new::before {
    display: block;
    content: "";
    width: 32px;
    height: 32px;
    background: transparent url(../img/icons/icon-new-32.png) no-repeat;
    margin-left: auto;
    margin-right: auto;
}

.status-deleted::before {
    display: block;
    content: "";
    width: 32px;
    height: 32px;
    background: transparent url(../img/icons/icon-deleted-32.png) no-repeat;
    margin-left: auto;
    margin-right: auto;
}

.pulse-button {
    animation: pulse 1.5s infinite !important;
    -webkit-animation: pulse 1.5s infinite !important;
}

    .pulse-button:hover {
        animation: none !important;
        -webkit-animation: none !important;
    }

@-webkit-keyframes pulse {
    0% {
        box-shadow: 0 0 0 0px rgba(0, 0, 0, 0.4);
    }

    100% {
        box-shadow: 0 0 0 35px rgba(0, 0, 0, 0);
    }
}

.chart-container-overview {
    width: 240px;
    height: 80px;
}

/* Blendet vue Elemente aus, bis Vue Instanz erstellt wurde*/
[v-cloak] {
    display: none;
}

.overview-status-icon {
    margin: auto;
}

td .overview-status-icon {
    display: block;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
}

/*2024-11-05 AS: #20043: Diese Regel führte dazu, dass die Ergebnisse nicht scrollbar sind*/
/*.select2-container--default .select2-results > .select2-results__options {
    overflow-y: hidden;
    max-height: none !important;
}*/

.slider.slider-horizontal {
    width: 100%;
    height: 20px;
}

    .arrow-right {
        position: relative;
        width: 0px;
        border: 12px solid;
        border-color: darkcyan darkcyan transparent transparent;
        -webkit-transform: rotate(45deg);
        transform: rotate(45deg) translate(75%, -50%);        
    }
.arrow-left {
    position: relative;
    width: 0px;
    border: 12px solid;
    border-color: darkcyan darkcyan transparent transparent;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg) translate(-100%, 100%);
}

.inline-header {
    display: inline-block
}

.input-margin-bottom {
    margin-bottom: 3px;
}

/* Text bricht in JsTree */
.jstree-default a {
    white-space: normal !important;
    height: auto;
    max-width: 80%;
}

.jstree-anchor {
    height: auto !important;
}

.jstree-default li > ins {
    vertical-align: top;
}

.jstree-leaf {
    height: auto;
}

    .jstree-leaf a {
        height: auto !important;
    }

/* Abstand zwischen Radio Buttons */
.radio-inline {
    padding-right: 10px;
}
label.label-info {
    background-color: var(--cx-background-color-light);
    font-weight: 400;
    width: 100%;
    padding-left: 5px;
    padding-right: 5px;
    border-left: 1px solid #ccc;
    border-right: 1px solid #ccc;
    border-bottom: 1px solid #ccc;
}

#Messages:not(:has(li)) {
    display: none;
}
.date-picker-wrapper {
    z-index: 99999; /*Eine Stelle mehr als die Sidebar*/
}
.cx-input.control-label-bottom {
    font-size: small;
    background-color: #f3f3f3;
    width: 100%;
    font-weight: normal;
    border-left: 1px solid #ccc;
    border-right: 1px solid #ccc;
    border-bottom: 1px solid #ccc;
}
.cx-input.control-label-top {
    font-size: small;
    background-color: #f3f3f3;
    width: 100%;
    font-weight: normal;
    border-left: 1px solid #ccc;
    border-right: 1px solid #ccc;
    border-top: 1px solid #ccc;
    margin-bottom: 0px;
}

.min-200px {
    min-width: 200px;
}


.table-responsive table thead {
    position: sticky;
    top: 0;
    border: 0 !important;
}

    .table-responsive table thead tr,
    .table-responsive table thead tr th,
    .table-responsive table thead tr td {
        border: 0 !important;
        margin: 0 !important;
    }

.or-seperator {
    margin: 40px 0 10px;
    text-align: center;
    border-top: 1px solid #ccc;
}
    .or-seperator span {
        padding: 0 10px;
        background: #f7f7f7;
        position: relative;
        top: -11px;
        z-index: 1;
    }

.d-inline-block {
    display: inline-block !important;
}