/*!
 * @filesource pitcom-adaption.css
 * @project    pitcom-backendcore
 * @package    adm2020core
 *
 * @copyright  (c) 2020-2025 by pitcom GmbH | Bahnhofstraße 61 | D-08523 Plauen Germany
 * @author     Florian Schlichter, B.A. <florian.schlichter@pitcom.de>
 * @link       https://www.pitcom.de
 *
 * @version    2.8
 * @date       2025-09-22
 */
html body.pitcom {
    color: var(--text);
    background-color: var(--bg-white);

    a:not(.btn) {
        color: var(--link-bg);


    }

    a:not(.btn):hover {
        color: var(--link-bg-hover);
    }

    h1, h2, h3, h4, h5, h6 {
        color: var(--h1);
    }

    .navy-bg,
    .bg-primary,
    .badge-primary,
    .label-primary,
    .btn-primary,
    .toast {
        background-color: var(--primary) !important;
        color: var(--primary-contrast);
        border-color: var(--primary) !important;
        transition: background-color 0.3s, filter 0.3s;

        h1, h2, h3, h4, h5, h6, p, small, .toast-message {
            color: var(--primary-contrast);
        }
    }

    .btn-primary:not(.btn-no-brightness-filter):hover,
    .btn-primary:not(.btn-no-brightness-filter):focus,
    .btn-primary:not(.btn-no-brightness-filter):active {
        filter: brightness(0.8);
    }

    .btn-primary.focus,
    .btn-primary:focus-visible {
        outline: 2px solid var(--primary) !important;
        filter: brightness(1) !important;
        outline-offset: 2px;
    }

    .bg-success,
    .badge-success,
    .label-success,
    .btn-success,
    .toast-success {
        background-color: var(--pit-bg-success) !important;
        color: var(--pit-bg-success-contrast);
        border-color: var(--pit-bg-success) !important;
        transition: background-color 0.3s, filter 0.3s;

        h1, h2, h3, h4, h5, h6, p, small, .toast-message {
            color: var(--pit-bg-success-contrast);
        }
    }

    .btn-success:not(.btn-no-brightness-filter):hover,
    .btn-success:not(.btn-no-brightness-filter):focus,
    .btn-success:not(.btn-no-brightness-filter):active {
        filter: brightness(0.8);
    }

    .btn-success.focus,
    .btn-success:focus-visible {
        outline: 2px solid var(--pit-bg-success) !important;
        filter: brightness(1) !important;
        outline-offset: 2px;
    }

    .lazur-bg,
    .bg-info,
    .badge-info,
    .label-info,
    .btn-info,
    .toast-info {
        background-color: var(--pit-bg-info) !important;
        color: var(--pit-bg-info-contrast);
        border-color: var(--pit-bg-info) !important;
        transition: background-color 0.3s, filter 0.3s;

        h1, h2, h3, h4, h5, h6, p, small, .toast-message {
            color: var(--pit-bg-info-contrast);
        }
    }

    .btn-info:not(.btn-no-brightness-filter):hover,
    .btn-info:not(.btn-no-brightness-filter):focus,
    .btn-info:not(.btn-no-brightness-filter):active {
        filter: brightness(0.8);
    }

    .btn-info.focus,
    .btn-info:focus-visible {
        outline: 2px solid var(--pit-bg-info) !important;
        filter: brightness(1) !important;
        outline-offset: 2px;
    }

    .yellow-bg,
    .bg-warning,
    .badge-warning,
    .label-warning,
    .btn-warning,
    .toast-warning {
        background-color: var(--pit-bg-warning) !important;
        color: var(--pit-bg-warning-contrast);
        border-color: var(--pit-bg-warning) !important;
        transition: background-color 0.3s, filter 0.3s;

        h1, h2, h3, h4, h5, h6, p, small, .toast-message {
            color: var(--pit-bg-warning-contrast);
        }
    }

    .btn-warning:not(.btn-no-brightness-filter):hover,
    .btn-warning:not(.btn-no-brightness-filter):focus,
    .btn-warning:not(.btn-no-brightness-filter):active {
        filter: brightness(0.8);
    }

    .btn-warning.focus,
    .btn-warning:focus-visible {
        outline: 2px solid var(--pit-bg-warning) !important;
        filter: brightness(1) !important;
        outline-offset: 2px;
    }

    .red-bg,
    .bg-danger,
    .badge-danger,
    .label-danger,
    .btn-danger,
    .toast-danger {
        background-color: var(--pit-bg-danger) !important;
        color: var(--pit-bg-danger-contrast);
        border-color: var(--pit-bg-danger) !important;
        transition: background-color 0.3s, filter 0.3s;

        h1, h2, h3, h4, h5, h6, p, small, .toast-message {
            color: var(--pit-bg-danger-contrast);
        }
    }

    .btn-danger:not(.btn-no-brightness-filter):hover,
    .btn-danger:not(.btn-no-brightness-filter):focus,
    .btn-danger:not(.btn-no-brightness-filter):active {
        filter: brightness(0.8);
    }

    .btn-danger.focus,
    .btn-danger:focus-visible {
        outline: 2px solid var(--pit-bg-danger) !important;
        filter: brightness(1) !important;
        outline-offset: 2px;
    }

    .gray-bg, .bg-muted {
        background-color: var(--pit-bg-muted) !important;
        color: var(--pit-bg-muted-contrast);

        h1, h2, h3, h4, h5, h6, p, small {
            color: var(--pit-bg-muted-contrast);
        }
    }

    .progress-bar {
        background-color: var(--gray-2) !important;
    }

    .progress-bar-success {
        background-color: var(--pit-bg-success) !important;
    }

    .progress-bar-warning {
        background-color: var(--pit-bg-warning) !important;
    }

    .progress-bar-danger {
        background-color: var(--pit-bg-danger) !important;
    }

    .text-success {
        color: var(--pit-bg-success) !important;
    }

    .text-warning {
        color: var(--pit-bg-warning) !important;
    }

    .text-danger {
        color: var(--pit-bg-danger) !important;
    }

    .text-dark-white {
        color: var(--text-dark-white) !important;
    }


    .navbar.navbar-static-top.white-bg {
        background-color: var(--primary);
        border-color: var(--primary);
        color: var(--primary-contrast);
    }

    #side-menu {
        .nav-header {
            padding-top: 20px;
            padding-bottom: 10px;
            padding-left: 20px;
            padding-right: 30px;
        }

        li {
            a {
                color: var(--nav-text);
            }
        }

        li.active {
            background-color: var(--nav-bg);

            a {
                color: var(--nav-text);
            }
        }

        li,
        li.active {
            a:hover, a:focus-visible {
                color: var(--nav-hover-text);
                background-color: var(--nav-hover-bg);
                outline: 0;
            }

            a:focus-visible {
            }
        }

        li:has(a:hover),
        li:has(a:focus),
        li:hover:has(a:hover),
        li:hover:has(a:focus),
        li.active:has(a:hover),
        li.active:has(a:focus) {
            border-left-color: var(--nav-hover-border);
            background-color: var(--nav-hover-bg);
            color: var(--nav-hover-text);

            a, a:hover, a:focus-visible, a:focus {
                color: var(--nav-hover-text);
                background-color: var(--nav-hover-bg);
            }

        }

        li:hover,
        li:has(a:focus),
        li:has(a:focus-visible),
        li:has(.nav-second-level li a:focus-visible) {
            .nav-second-level {
                display: block !important;
                padding: 0;
                border-radius: 0 2px 2px 0;
                min-width: 160px;
                height: auto;

                li {
                    a {
                        color: var(--nav-text);
                        background-color: var(--nav-bg);
                    }
                }

                li:last-child {
                    padding-bottom: 0;
                }

                li:has(a:hover),
                li:has(a:focus),
                li:hover:has(a:hover),
                li:hover:has(a:focus),
                li.active:has(a:hover),
                li.active:has(a:focus) {
                    border-left-color: var(--nav-hover-border);
                    background-color: var(--nav-hover-bg);
                    color: var(--nav-hover-text);

                    a, a:hover, a:focus-visible, a:focus {
                        color: var(--nav-hover-text);
                        background-color: var(--nav-hover-bg);
                    }
                }
            }
        }

        li:has(a:focus-visible) {
            outline: 2px dotted var(--nav-focus);
            outline-offset: -4px;
        }


        .nav-second-level {
            background-color: var(--nav-bg);
        }

        .nav-second-level li.active {
            border-left: 4px solid var(--nav-border);
        }
    }

    .navbar.navbar-static-top,
    .navbar.navbar-fixed-top {
        height: 80px;

        .btn-primary {
            border-color: var(--primary-contrast) !important;
        }

        .btn-primary:active,
        .btn-primary:hover,
        .btn-primary:focus,
        .btn-primary:focus-visible {
            background-color: var(--primary-contrast) !important;
            color: var(--primary) !important;
        }
    }

    .nav.navbar-top-links {
        a,
        .text-muted {
            color: var(--white) !important;
        }
    }

    #page-wrapper {
        background: var(--bg-main);
    }

    .row.wrapper.white-bg.page-heading {
        background: var(--bg-main);
    }

    .footer {
        background: var(--bg-main);

        a {
            color: var(--footer-a);
        }


        .top-link {
            font-size: 2em;
            position: fixed;
            right: .75em;
            bottom: .75em;
            z-index: 1000;
            display: block;
            text-align: center;
            width: 1.5em;
            color: #676a6c;;
            background: rgba(0, 0, 0, .2);
            visibility: hidden;
            opacity: 0;
            -webkit-transition: all .2s ease;
            -o-transition: all .2s ease;
            transition: all .2s ease;
        }

        .top-link.on {
            visibility: visible;
            opacity: 1;
        }

        .top-link:focus,
        .top-link:hover {
            color: #fff;
            background: #676a6c;
        }
    }

    .ibox {
        color: var(--ibox-bg);

        .ibox-title {
            background-color: var(--primary);
            color: var(--primary-contrast);
            padding: 15px 90px 15px 15px;
            border-top-width: 0;

            h1, h2, h3, h4, h5, h6, p {
                color: var(--primary-contrast);
                display: inline-block;
                font-size: 14px;
                margin: 0;
                padding: 0;
                text-overflow: ellipsis;
                float: none;
                font-weight: bold;
            }
        }

        .ibox-content {
            background-color: var(--ibox-bg);
            color: var(--ibox-text);

            a:not(.btn) {
                color: var(--ibox-text-link);
            }

            table.table,
            table.table-bordered {
                thead {
                    tr {
                        th {
                            background-color: var(--ibox-th-bg);
                            color: var(--ibox-th-txt);
                        }
                    }
                }
            }

            table.dataTable {
                thead {
                    @media (prefers-color-scheme: dark) {
                        .sorting::after,
                        .sorting_asc::after,
                        .sorting_desc::after,
                        .sorting_asc_disabled::after,
                        .sorting_desc_disabled::after {
                            opacity: .9;
                        }
                    }
                }
            }
        }
    }

    form {

        .input-group input + select.form-control:not([size]):not([multiple]),
        .input-group input + select + .input-group-append {
            height: calc(2px + 2.25rem);
        }

        input.form-control:not(.form-no-valiinfo):not([type]):required,
        input.form-control:not(.form-no-valiinfo)[type="text"]:required,
        input.form-control:not(.form-no-valiinfo):not([type]):required:invalid,
        input.form-control:not(.form-no-valiinfo)[type="text"]:required:invalid,
        input.form-control:not(.form-no-valiinfo):not([type]):optional:invalid,
        input.form-control:not(.form-no-valiinfo)[type="text"]:optional:invalid,
        input.form-control:not(.form-no-valiinfo)[type="date"]:required,
        input.form-control:not(.form-no-valiinfo)[type="date"]:required:invalid,
        input.form-control:not(.form-no-valiinfo)[type="date"]:optional:invalid,
        input.form-control:not(.form-no-valiinfo)[type="datetime-local"]:required,
        input.form-control:not(.form-no-valiinfo)[type="datetime-local"]:required:invalid,
        input.form-control:not(.form-no-valiinfo)[type="datetime-local"]:optional:invalid,
        input.form-control:not(.form-no-valiinfo)[type="email"]:required,
        input.form-control:not(.form-no-valiinfo)[type="email"]:required:invalid,
        input.form-control:not(.form-no-valiinfo)[type="email"]:optional:invalid,
        input.form-control:not(.form-no-valiinfo)[type="number"]:required,
        input.form-control:not(.form-no-valiinfo)[type="number"]:required:invalid,
        input.form-control:not(.form-no-valiinfo)[type="number"]:optional:invalid,
        input.form-control:not(.form-no-valiinfo)[type="password"]:required,
        input.form-control:not(.form-no-valiinfo)[type="password"]:required:invalid,
        input.form-control:not(.form-no-valiinfo)[type="password"]:optional:invalid,
        input.form-control:not(.form-no-valiinfo)[type="tel"]:required,
        input.form-control:not(.form-no-valiinfo)[type="tel"]:required:invalid,
        input.form-control:not(.form-no-valiinfo)[type="tel"]:optional:invalid,
        input.form-control:not(.form-no-valiinfo)[type="time"]:required,
        input.form-control:not(.form-no-valiinfo)[type="time"]:required:invalid,
        input.form-control:not(.form-no-valiinfo)[type="time"]:optional:invalid,
        input.form-control:not(.form-no-valiinfo)[type="url"]:required,
        input.form-control:not(.form-no-valiinfo)[type="url"]:required:invalid,
        input.form-control:not(.form-no-valiinfo)[type="url"]:optional:invalid,
        textarea.form-control:not(.form-no-valiinfo):required,
        textarea.form-control:not(.form-no-valiinfo):required:invalid,
        textarea.form-control:not(.form-no-valiinfo):optional:invalid,
        select.form-control:not(.form-no-valiinfo):required,
        select.form-control:not(.form-no-valiinfo):required:invalid,
        select.form-control:not(.form-no-valiinfo):optional:invalid {
            border-left: 2px solid var(--form-invalid);
        }

        input.form-control:not(.form-no-valiinfo):not([type]):required:valid,
        input.form-control:not(.form-no-valiinfo)[type="text"]:required:valid,
        input.form-control:not(.form-no-valiinfo)[type="date"]:required:valid,
        input.form-control:not(.form-no-valiinfo)[type="datetime-local"]:required:valid,
        input.form-control:not(.form-no-valiinfo)[type="email"]:required:valid,
        input.form-control:not(.form-no-valiinfo)[type="number"]:required:valid,
        input.form-control:not(.form-no-valiinfo)[type="password"]:required:valid,
        input.form-control:not(.form-no-valiinfo)[type="tel"]:required:valid,
        input.form-control:not(.form-no-valiinfo)[type="time"]:required:valid,
        input.form-control:not(.form-no-valiinfo)[type="url"]:required:valid,
        textarea.form-control:not(.form-no-valiinfo):required:valid,
        select.form-control:not(.form-no-valiinfo):required:valid {
            border-left: 2px solid var(--form-valid);
        }

        .form-control:focus {
            border-color: var(--form-focus-border);
            box-shadow: 0 0 10px 0 var(--form-focus-border);
        }

        .form-control:not(.form-no-valiinfo):required:invalid:focus {
            box-shadow: 0 0 5px 0 var(--form-invalid);
        }

        label[for] {
            cursor: pointer;
        }

        .input-group-addon {
            background-color: var(--form-input-addon-bg);
            color: var(--form-input-addon-txt);
            padding: 0 1em;
            text-align: center;
            align-content: center;
        }

        input[disabled] + .input-group-append,
        input[disabled] + .input-group-append > .input-group-addon,
        input[disabled] + .input-group-addon {
            background-color: var(--form-input-addon-disabled-bg);
            color: var(--form-input-addon-disabled-txt);
        }

        .note-editor.note-frame {
            .note-editing-area {
                .note-editable:focus {
                    border-color: var(--form-focus-border);
                }
            }

            .note-editing-area:has(.note-editable:focus) {
                box-shadow: 0 0 5px 0 var(--form-focus-border);
            }

            .note-status-output {
                padding-left: 1em;
            }

            @media screen and (prefers-color-scheme: dark) {
                .note-editing-area {
                    .note-editable {
                        background-color: var(--ibox-bg);
                        color: var(--ibox-text);
                    }
                }

                .note-toolbar,
                .note-status-output,
                .note-statusbar {
                    background-color: var(--gray-2);
                    color: var(--ibox-text);
                }
            }
        }
    }

    form:invalid {
        button[type=submit].btn.btn-primary {
            cursor: not-allowed !important;
            background-color: var(--gray-3) !important;
            color: var(--gray-1) !important;
            border-color: var(--gray-1) !important;
        }
    }

    input, select, .btn.btn-default {
        background-color: var(--form-input-bg) !important;
        color: var(--form-input-txt) !important;
    }

    input:is(:-webkit-autofill, :autofill) {
        background-color: var(--pit-gelb) !important;
        color: var(--form-input-txt) !important;
    }

    input[disabled], select[disabled], .btn.btn-default[disabled] {
        background-color: var(--form-input-disabled-bg) !important;
        color: var(--form-input-disabled-txt) !important;
        cursor: not-allowed;
    }

    .alert-success {
        border-radius: 0 !important;
        color: var(--white);
        background-color: var(--pit-gruen);
        border-color: var(--pit-gruen);
    }

    .alert-danger {
        color: var(--white);
        background-color: #ed5565;
        border-color: #ed5565;
    }

    .alert-info {
        color: var(--white);
        background-color: var(--primary);
        border-color: var(--primary);
    }

    .alert-warning {
        background-color: var(--pit-gelb);
        border-color: var(--pit-gelb);
    }

    .alert[class*="alert-"] {
        border-radius: 0 !important;

        a {
            color: var(--white);
            text-decoration: underline !important;
        }
    }

    .pagination {
        .footable-page.active a {
            background-color: var(--primary);
            border-color: var(--primary);
            color: var(--white);
        }


        .page-item .page-link {
            background-color: var(--pagination-bg);
            border-color: var(--pagination-border);
            color: var(--pagination-text);
        }

        .page-item.active .page-link {
            background-color: var(--pagination-active-bg);
            border-color: var(--pagination-active-border);
            color: var(--pagination-active-text);
        }
    }

    .forum-item.active {
        .fa {
            color: var(--primary);
        }

        a.forum-item-title {
            color: var(--primary);
        }
    }

    .vertical-date small {
        color: var(--primary);
    }

    .login-logo-container {
        background: var(--primary);
        padding: 2em;
        border-radius: 3px;

        svg > path, > svg > rect {
            fill: var(--white);
        }
    }

    .minimalize-styl-2 {
        margin: 14px 5px 5px 30px;
    }

    .spin-icon {
        background: var(--primary) !important;
    }

    .dropdown-menu > .active > a,
    .pitcom .dropdown-menu > .active > a:focus,
    .pitcom .dropdown-menu > .active > a:hover {
        background-color: var(--primary);
    }

    .nav > li.active {
        border-color: var(--primary);
    }

    .nav-header {
        background-color: var(--primary);
        background-image: none;
    }

    .top-navigation {
        .navbar-nav .dropdown-menu > .active > a {
            color: var(--primary);
        }

        .nav > li a:hover,
        .nav > li a:focus {
            color: var(--primary);
        }

        .nav > li.active > a {
            color: var(--primary);
        }

        .navbar-brand {
            background: var(--primary);
        }

    }

    .navbar-toggler {
        background-color: var(--primary);
    }

    .breadcrumb {
        background: transparent;
    }

    .page-heading {
        border: none;
    }


    .navbar-minimalize {
        background: var(--primary);
        border-color: var(--primary);
    }

    .nav.navbar-right > li > a {
        color: #444444;
    }

    .pitcom.fixed-nav .minimalize-styl-2 {
        margin: 14px 5px 5px 15px;
    }


    .inmodal {
        .modal-content {
            background-color: var(--bg-white);
            border-top-left-radius: 5px;
            border-top-right-radius: 5px;
            border-bottom-left-radius: 5px;
            border-bottom-right-radius: 5px;
        }

        .modal-header {
            display: block;
            border-top-left-radius: 5px;
            border-top-right-radius: 5px;
            background-color: var(--bg-white);

            button.close:not(:disabled):not(.disabled) {
                color: var(--h1);
                text-shadow: none;
                opacity: 1;
            }

            button.close:not(:disabled):not(.disabled):focus,
            button.close:not(:disabled):not(.disabled):focus-visible {
                opacity: .8;
                outline: 2px solid var(--h1);
                outline-offset: calc(-1rem + 2px);
            }

            button.close:not(:disabled):not(.disabled):hover {
                opacity: .8;
            }
        }

        .modal-header + form {
            border-bottom-left-radius: 5px;
            border-bottom-right-radius: 5px;
        }

        .modal-footer {
            background-color: var(--bg-white);
            border-bottom-left-radius: 5px;
            border-bottom-right-radius: 5px;
        }

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

    .sweet-alert {
        background-color: var(--bg-white);

        h1, h2 {
            color: var(--h1);
        }

        p {
            color: var(--text);
        }

        button {
            background-color: var(--button-bg);
            color: var(--button-text);
        }

        button:hover, button:focus, button:active {
            background-color: var(--button-hover-bg);
            color: var(--button-hover-text);
        }

        button:focus-visible {
            background-color: var(--button-hover-bg);
            color: var(--button-hover-text);
            outline: 2px solid var(--button-hover-bg);
            outline-offset: calc(2px);
        }

        button.cancel {
            background-color: var(--button-secondary-bg);
            color: var(--button-secondary-text);
        }

        button.cancel:hover, button.cancel:focus, button.cancel:active {
            background-color: var(--button-secondary-hover-bg);
            color: var(--button-secondary-hover-text);
        }

        button.cancel:focus-visible {
            background-color: var(--button-secondary-hover-bg);
            color: var(--button-secondary-hover-text);
            outline: 2px solid var(--button-secondary-hover-bg);
            outline-offset: calc(2px);
        }
    }


    @media (max-width: 768px) {
        body.pitcom,
        body.pitcom.mini-navbar {
            #side-menu {
                li:hover,
                li:has(a:focus),
                li:has(a:focus-visible),
                li:has(.nav-second-level li a:focus-visible) {
                    .nav-second-level {
                        left: unset !important;
                        display: inline-block !important;
                        position: initial;
                        width: 100%;
                        opacity: 1;

                        li {
                            a {
                                display: inline-block !important;
                                width: 100%;
                            }
                        }
                    }
                }
            }
        }
    }

    .chosen-container {
        .chosen-single {
            background-color: transparent;
            border-color: #e5e6e7 !important;
        }

        .chosen-results li.highlighted {
            background-color: var(--primary) !important;
            color: var(--primary-contrast) !important;
        }
    }

    .sk-loading {
        .sk-spinner-wave {
            div {
                background-color: var(--primary) !important;
                box-shadow: 0 0 17px 2px var(--white);
            }
        }
    }

    @media screen and (prefers-color-scheme: dark) {
        .sk-loading:after {
            background-color: rgba(95, 99, 104, .7);
        }
    }

    /* Sorting-List */

    .sort-list-form.ui-sortable,
    [class*='sort-list-form-'].ui-sortable {
        position: relative;

        .sort-col:active,
        [class*='sort-col-']:active {
            cursor: grab;
        }

        .sort-col.ui-sortable-helper:before,
        .sort-col:hover:before,
        [class*='sort-col-'].ui-sortable-helper:before,
        [class*='sort-col-']:hover:before {
            content: "\f142";
            font: normal normal normal 14px/1 FontAwesome;
            font-size: 1.5em;
            position: absolute;
            left: 15px;
            top: 0;
            height: calc(100% - .25rem);
            background-color: var(--sorting-bg);
            color: var(--sorting-txt);
            padding: 0;
            z-index: 2;
            display: flex;
            align-items: center;
            justify-content: center;
            aspect-ratio: 1 / 1.5;
            cursor: grabbing;
        }

        .sort-col.ui-sortable-helper,
        .sort-col.ui-sortable-helper .ibox-title,
        [class*='sort-col-'].ui-sortable-helper,
        [class*='sort-col-'].ui-sortable-helper .ibox-title {
            cursor: grabbing !important;
        }

        .sort-col:not(.ui-sortable-helper) .ibox-title,
        .sort-col:not(.ui-sortable-helper):before,
        [class*='sort-col-']:not(.ui-sortable-helper) .ibox-title,
        [class*='sort-col-']:not(.ui-sortable-helper):before {
            cursor: grab;
        }

        .ui-sortable-placeholder {
            outline: 4px dashed var(--sorting-outline);
            outline-offset: 2px;
            z-index: 2;
        }
    }
}

body.pitcom.mini-navbar {
    .nav-header {
        background-color: var(--primary);
    }
}

/* SPINNER */

body.has-spinner {
    max-height: 100vh;
    overflow-y: hidden;

    #spinner {
        position: fixed;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0;
        background-color: rgba(0, 0, 0, .6);
        z-index: 100000000;

        .neo-spinner {
            padding: 30px;
            background-color: var(--ibox-bg);
            border-radius: 30px;
            position: absolute;
            top: 50%;
            left: 50%;
            margin: -94px 0 0 -94px;

            img {
                width: 100%;
                -webkit-animation: spin 1s linear infinite;
                animation: spin 1s linear infinite;
            }

            @media screen and (prefers-color-scheme: dark) {
                img {
                    filter: brightness(0) invert(1);
                }
            }
        }
    }
}

@keyframes spin {
    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

/* LOGIN */
html body.pitcom.pitcom-login {
    background-color: var(--bg-main) !important;

    .loginColumns {
        max-width: 450px;

        a {
            white-space: nowrap;
        }

        a + a::before {
            content: '|';
            padding-right: 2px;
        }

        .pitcom-login-head {
            text-align: center;
        }

        .pitcom-login-head img,
        .pitcom-login-head svg {
            max-width: 300px;
            margin-bottom: 2em;
        }

        .ibox-content, .footer {
            border-top-width: 0;
        }
    }
}

.pit-hidden-row > :not(.last) {
    text-decoration: line-through;
}

.scroll-x {
    overflow-x: auto;
}

.alert .close {
    color: #fff;
    text-shadow: none;
    opacity: 1;
    line-height: .8;
}

.gritter-close {
    background: url(/js/plugins/gritter/images/gritter.png) no-repeat left top;
}

.help-block {
    flex-direction: column;
    flex-basis: 100%;
    color: #999;
}

table.head-vertical {
    width: auto;
}

table.head-vertical thead th {
    writing-mode: vertical-rl;
    transform: rotate(180deg);
}

table.dataTable thead th a {
    color: inherit;
}

table.dataTable thead .sorting,
table.dataTable thead .sorting_asc,
table.dataTable thead .sorting_desc,
table.dataTable thead .sorting_asc_disabled,
table.dataTable thead .sorting_desc_disabled {
    padding-right: 2em;
}

table.dataTable thead .sorting::after, table.dataTable thead .sorting_asc::after, table.dataTable thead .sorting_desc::after, table.dataTable thead .sorting_asc_disabled::after, table.dataTable thead .sorting_desc_disabled::after {
    /* Die sortier-Klasse kommt nicht an <th> sondern an ein <div> innerhalb des <a>-Tags */
    bottom: 0;
    opacity: 1;
}

table.table-detail > tbody > tr > td:first-of-type {
    width: 35%;
}

@media (max-width: 576px) {
    table.table-detail > tbody > tr > td, table.table-detail > tbody > tr > td:first-of-type {
        display: block;
        width: 100%;
    }
}

.select2-result-repository__avatar {
    float: left;
    width: 60px;
    margin-right: 10px;
}

.select2-result-repository__meta {
    margin-left: 70px;
}

/**
SELECT 2
 */
.select2-container--default .select2-selection--single, .select2-dropdown.select2-dropdown--below {
    border-radius: 0 !important;
    border-color: #e5e6e7 !important;;
}

.select2-container .select2-selection--single {
    height: 36px !important;
}

.select2-container--default .select2-selection--single .select2-selection__rendered {
    line-height: 36px !important;
}

.select2-container--default .select2-selection--single .select2-selection__arrow {
    height: 36px !important;

}

.fileupload-buttonbar .btn-group, .fileupload-buttonbar .btn-group-vertical {
    display: inherit;
}

.form-group.single-file-upload .btn-group .btn-select {
    width: 85%;
    text-align: left;
    padding: 0;
}

.form-group.devider {
    border-top: 1px solid #e7eaec;
}

table th .btn-group.dropdown {
    width: 100%;
}

/**
Action-Icons in Tabellen:
 */
.last.center.options .icon {
    float: none;
}

.last.center.options a {
    transition: background-color 150ms;
    text-align: center;
    border-radius: 4px;
    float: left;
    color: #676a6c;
    font-size: 19px;
    padding: 0.2em;
    line-height: 26px;
    width: 39px;

}

.pit-filter-bar .btn-group {
    flex-wrap: wrap;
    margin-bottom: 1rem;
}

.pit-filter-bar .btn-group .btn + .btn {
    border-right: 2px solid white !important;

}

.pitcom .breadcrumb-item + .breadcrumb-item::before {
    content: '»';
}

@media (min-width: 576px) {
    .navbar.navbar-static-top, .navbar.navbar-fixed-top {
        height: 60px;
    }

    .navbar-top-links li:last-child {
        margin-right: 30px;
    }
}

.panel, .panel-heading {
    border-radius: 0;
}

.hidden {
    display: none !important;
    visibility: hidden !important;
}

table .foldablerow-cell {
    position: relative;
}

table .foldablerow-cell-container {
    overflow: hidden;
    max-height: none;

}

table .foldablerow-cell .foldablerow-cell-container {
    max-height: 100px;
}

.nav > li > a i {
    /* align von Labeln in dem Menü:*/
    width: 1em;
}

.multicheckbox label .editHelp, .multicheckbox label .helpButton {
    float: right;
    margin-top: -3px;
}

.editHelp, .helpButton {
    cursor: pointer;
}

.form-group .editHelp > span, .form-group .helpButton > span {
    line-height: 3em;
}

.ibox-title .editHelp {
    display: inline-block;
    vertical-align: top;
}

.ibox-title > .icon {
    margin-right: 1em;
}

.ibox-title > .fa {
    margin-right: 0.5em;
}

.form-group .icon.non {
    color: #d0d0d0;
}

.form-group > div > .module {
    font-weight: bold;
}

.form-horizontal label.submodule {
    padding-left: 2em;
}

.form-horizontal label.subsubmodule {
    padding-left: 4em;
}

.form-horizontal label.devider {
    margin: 0 0 0.5em;
    padding: 0 0 0.5em;
}

div.filterable {
    height: 300px;
    overflow: scroll;
    overflow-x: hidden;
}

.recent-posts,
.recent-comments,
.recent-users {
    margin: 0;
    padding: 0;
}

.recent-posts li,
.recent-comments li,
.article-post li,
.recent-users li {
    border-bottom: 1px dotted #AEBDC8;
    list-style: none outside none;
    padding: 10px;
}

.recent-posts .article-post,
.recent-comments .comments {
    margin-left: 60px;
}

.recent-posts li.viewall,
.recent-comments li.viewall,
.recent-users li.viewall {
    padding: 0;
}

.recent-posts li.viewall a,
.recent-comments li.viewall a,
.recent-users li.viewall a {
    padding: 5px;
    text-align: center;
    display: block;
    color: #888888;
}

.recent-posts li.viewall a:hover,
.recent-comments li.viewall a:hover,
.recent-users li.viewall a:hover {
    background-color: #eeeeee;
}

.recent-posts li:last-child,
.recent-comments li:last-child,
.recent-users li:last-child {
    border-bottom: none !important;
}

.nopadding {
    padding: 0 !important;
}

.ibox-tools .input-group {
    /* Anpassung der Suchleiste für Tabellen  */
    margin-top: -9px;
}

.input-group.datepicker {
    padding: 0 15px;
    direction: ltr;
}

.datepicker > div.input-group-prepend {
    display: -ms-flexbox;
    display: flex;
}

.last.center.options a:hover {
    background: #ddd;
}

table .last.center.options a:hover {
    background: #fff;
}

.nav-header img {
    /* Logo soll nicht breiter sein als die sidebar */
    max-width: 100%;
}

body.mini-navbar .nav-label, body.mini-navbar .navbar-default .nav li li a span {
    /*
    Navigationseinträge haben standardmäßig einen <span class="text"> um das Label;
    Dieser wird in der minimierten Ansicht der Navbar standardmäßig nicht angezeigt.
    Das führt dazu das in der minimierten Ansicht in der zweiten Ebene keine Labels sichtbar sind
    */
    display: inline;
}

/* Form */

.form-control::placeholder {
    /*
    Placeholder schwer unterscheidbar
    */
    color: #B6BFC7;
    opacity: 1;
}

@media (min-width: 576px) {
    .pitcom .col-form-label, .pitcom .control-label {
        text-align: right;
    }
}

.pitcom .col-form-value {
    padding-top: calc(.375rem + 1px);
    padding-bottom: calc(.375rem + 1px);
    margin-bottom: 0;
    font-size: inherit;
    line-height: 1.5;
}

@media (max-width: 576px) {
    .ibox-search {
        position: relative;
        top: auto;
        right: auto;
    }

    .ibox-tools.ibox-search .tableSearch .input-group {
        margin-top: 0;
    }
}

.tableSearch .form-control {
    height: 2em;
    padding: 5px;
}

.ibox-tools .tableSearch .input-group {
    margin-top: -5px;
}

.tableSearch .btn {
    padding: 0 .5em;
}

.url-hp {
    /*
    Honeypot in Login Form
    */
    display: none;
}

[class*='icheckbox_square'],
[class*='iradio_square'] {
    margin-right: 0.3em !important;
}

.multicheckbox label {
    width: 100%;
}

@media (max-width: 576px) {
    .navbar-top-links .text {
        display: none;
    }

}

@media (max-width: 768px) {
    .profile-element img {
        padding: 10px 25px;
    }

    body #page-wrapper {
        width: 100vw;
    }

    body.mini-navbar #page-wrapper {
        margin: 0 0 0 calc(100vw - 85px);
    }

    body.mini-navbar .navbar-static-side {
        width: calc(100vw - 85px);
    }

    body.mini-navbar .profile-element, body.mini-navbar .nav-label, body.mini-navbar .navbar-default .nav li a span {
        display: inline;
    }

    body:not(.fixed-sidebar):not(.canvas-menu).mini-navbar .nav-second-level {
        z-index: 2;
    }

    body:not(.fixed-sidebar):not(.canvas-menu).mini-navbar .nav li:hover > .nav-second-level,
    body:not(.fixed-sidebar):not(.canvas-menu).mini-navbar .nav li:has(a:focus-visible) > .nav-second-level,
    .mini-navbar .nav li:focus > .nav-second-level,
    .mini-navbar .nav li:has(a:focus-visible) > .nav-second-level {
        min-width: 70vw;
        display: block;
    }
}

/*Bugfix Login-Form*/
.loginscreen {
    position: relative;
    top: 50%;
    margin-top: -154px;
    padding-top: 0;
}


/* Messages (Inbox) */
.widget.pitcom-spf {
    margin-top: 0;
}

.widget-messages .widget-title .nav-tabs li a {
    padding-bottom: 7px;
}

@media (max-width: 576px) {
    .widget-messages .widget-title .nav-tabs li a .text {
        display: none;
    }
}

.widget-messages .widget-content {
    overflow: hidden;
}

@media (max-width: 768px) {
    .widget-messages .widget-content {
        height: auto;
    }
}

.widget-messages .messages-list {
    width: 35%;
    margin: -4px 0 0;
    padding: 0;
    float: left;
    list-style: none;
}

.widget-messages .messages-list .messages-item {
    padding: 5px;
    position: relative;
}

.widget-messages .messages-list .messages-item span {
    display: block;
    color: #555555;
}

.widget-messages .messages-list .messages-item .messages-item-star,
.widget-messages .messages-list .messages-item .messages-item-attachment,
.widget-messages .messages-list .messages-item .messages-item-time,
.widget-messages .messages-list .messages-item .messages-item-time .messages-item-actions {
    position: absolute;
}

.widget-messages .messages-list .messages-item .messages-item-star {
    left: 7px;
    opacity: 0;
    -webkit-transition: opacity 0.2s ease-in-out;
    transition: opacity 0.2s ease-in-out;
}

.widget-messages .messages-list .messages-item .messages-item-attachment {
    left: 7px;
    top: 25px;
}

.widget-messages .messages-list .messages-item .messages-item-avatar {
    border-radius: 4px;
    float: left;
    max-width: 40px;
    height: auto;
}

.widget-messages .messages-list .messages-item .messages-item-from,
.widget-messages .messages-list .messages-item .messages-item-subject,
.widget-messages .messages-list .messages-item .messages-item-preview {
    margin-left: 45px;
}

.widget-messages .messages-list .messages-item .messages-item-from {
    margin-top: 2px;
    font-weight: bold;
}

.widget-messages .messages-list .messages-item .messages-item-time {
    top: 8px;
    right: 15px;
    opacity: 1;
    -webkit-transition: opacity 0.2s ease-in-out;
    transition: opacity 0.2s ease-in-out;
}

.widget-messages .messages-list .messages-item .messages-item-time .text {
    font-size: 12px;
    color: #999999;
}

.widget-messages .messages-list .messages-item .messages-item-time .messages-item-actions {
    top: 0;
    right: 0;
    opacity: 0;
    width: 75px;
    -webkit-transition: opacity 0.2s ease-in-out;
    transition: opacity 0.2s ease-in-out;
}

.widget-messages .messages-list .messages-item .messages-item-time .messages-item-actions > a,
.widget-messages .messages-list .messages-item .messages-item-time .messages-item-actions .dropdown > a {
    margin-left: 5px;
    color: #555555;
}

.widget-messages .messages-list .messages-item .messages-item-time .messages-item-actions > div {
    display: inline-block;
}

.widget-messages .messages-list .messages-item .messages-item-time .messages-item-actions .dropdown-menu {
    margin-top: 0;
}

.widget-messages .messages-list .messages-item .messages-item-time .messages-item-actions .tag-icon {
    margin: 0 5px 0 -13px;
    display: inline-block;
    width: 11px;
    height: 11px;
    border-radius: 3px;
}

.widget-messages .messages-list .messages-item .messages-item-time:hover .text {
    opacity: 0;
}

.widget-messages .messages-list .messages-item .messages-item-time:hover .messages-item-actions {
    opacity: 1;
}

.widget-messages .messages-list .messages-item .messages-item-subject {
    font-size: 12px;
    margin-bottom: 4px;
}

.widget-messages .messages-list .messages-item .messages-item-preview {
    font-size: 12px;
    color: #999999;
}

.widget-messages .messages-list .messages-item:hover {
    cursor: pointer !important;
}

.widget-messages .messages-list .messages-item:hover .messages-item-star {
    opacity: .2;
}

.widget-messages .messages-list .messages-item.starred .messages-item-star {
    display: block;
    opacity: 1;
}

@media (max-width: 768px) {
    .widget-messages .messages-list {
        height: auto;
        max-height: 500px;
        float: none;
        width: auto;
        margin-top: 3px;
    }
}

.widget-messages .messages-content {
    width: auto;
    margin-top: 4px;
    margin-left: 35%;
    height: auto;
    background-color: transparent;
    position: relative;
}

.widget-messages .messages-content .message-header {
    padding: 10px 15px;
}

.widget-messages .messages-content .message-header .message-from {
    font-weight: bold;
}

.widget-messages .messages-content .message-header .message-to {
    color: #999999;
}

.widget-messages .messages-content .message-header .message-time {
    position: absolute;
    top: 10px;
    right: 15px;
    color: #999999;
}

.widget-messages .messages-content .message-header .message-actions {
    position: absolute;
    width: 115px;
    left: 50%;
    margin-left: -65.7px;
}

.widget-messages .messages-content .message-header .message-actions a {
    margin: 0 0 0 -4px;
    background-color: #fafafa;
    padding: 4px 7px;
}

.widget-messages .messages-content .message-header .message-actions a:first-child {
    border-bottom-left-radius: 15px;
    border-top-left-radius: 15px;
    padding-left: 10px;
}

.widget-messages .messages-content .message-header .message-actions a:last-child {
    border-bottom-right-radius: 15px;
    border-top-right-radius: 15px;
}

.widget-messages .messages-content .message-content {
    padding: 10px;
}

@media (max-width: 768px) {
    .widget-messages .messages-content {
        margin-left: 0;
    }
}

@media (min-width: 768px) {
    .dl-horizontal dt {
        float: left;
        width: 180px;
        overflow: hidden;
        clear: left;
        text-align: right;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .dl-horizontal dd {
        margin-left: 200px;
    }

    .dl-horizontal dd:before,
    .dl-horizontal dd:after {
        display: table;
        content: " ";
    }

    .dl-horizontal dd:after {
        clear: both;
    }

    .dl-horizontal dd:before,
    .dl-horizontal dd:after {
        display: table;
        content: " ";
    }

    .dl-horizontal dd:after {
        clear: both;
    }
}

#inbox-tab .messages-item .nav-link {
    border: 0;
    border-radius: 0;
    padding: 10px 0;
    border-bottom: 1px solid #dee2e6;
}

#inbox-tab .messages-item:last-child .nav-link {
    border-bottom: 0;
}

#inbox-tab .nav {
    display: block;
    flex-wrap: inherit;
    border-right: 1px solid #dee2e6;
}

#inbox-tab .nav-tabs .nav-link:not(.active):focus, #inbox-tab .nav-tabs .nav-link:not(.active):hover {
    background-color: #f3f3f4;
}

#inbox-tab .nav-tabs .nav-link.active {
    background-color: #dee2e6;
}

.widget-messages #inbox-tab .messages-list .messages-item {
    padding: 0;
}

#inbox-tab .message-header {
    border-bottom: 1px solid #dee2e6;
}

/* remove pointer events for tel buttons */
@media screen and (min-width: 700px) {
    a[href^="tel:"] {
        pointer-events: none;
        text-decoration: none;
        color: #333333;
    }
}


button.fixed-backendform-save-btn {
    position: fixed;;
    top: 5em;
    right: 1em;
}

button.fixed-backendform-save-btn > span {
    display: none;
}

button.fixed-backendform-save-btn:hover {
    width: auto;
}

button.fixed-backendform-save-btn:hover > span {
    display: inline-block;
    padding-left: 1em;
}

.logout-end {
    position: fixed;
    display: flex;
    align-items: center;
    justify-content: center;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background-color: rgba(0, 0, 0, .5);
    z-index: 999999;


    .logout-end-box {
        display: flex;
        flex-wrap: wrap;
        flex-direction: row;
        background-color: var(--bg-white);
        border: 15px solid rgba(0, 0, 0, .6);
        width: 90vw;
        max-width: 400px;
        max-height: 75vh;
        padding: 15px;

        p {
            width: 100%;
            text-align: center;
            font-size: 20px;
            margin: 0;
        }

        h1 {
            width: 100%;
            text-align: center;
            margin: 30px 0;
            font-size: 70px;
        }

        div {
            width: 100%;
            margin: 30px 0 0 0;

            span {
                width: 100%;
            }
        }
    }
}

.logout-end.vh,
.logout-timer.vh {
    display: none;
}