﻿ 

:root {
    --bs-blue: #0d6efd;
    --bs-indigo: #6610f2;
    --bs-purple: #6f42c1;
    --bs-pink: #d63384;
    --bs-red: #dc3545;
    --bs-orange: #fd7e14;
    --bs-yellow: #ffc107;
    --bs-green: #198754;
    --bs-teal: #20c997;
    --bs-cyan: #0dcaf0;
    --bs-white: #fff;
    --bs-gray: #6c757d;
    --bs-gray-dark: #343a40;
    --bs-gray-100: #f8f9fa;
    --bs-gray-200: #e9ecef;
    --bs-gray-300: #dee2e6;
    --bs-gray-400: #ced4da;
    --bs-gray-500: #adb5bd;
    --bs-gray-600: #6c757d;
    --bs-gray-700: #495057;
    --bs-gray-800: #343a40;
    --bs-gray-900: #212529;
    --bs-primary: #0d6efd;
    --bs-secondary: #6c757d;
    --bs-success: #198754;
    --bs-info: #0dcaf0;
    --bs-warning: #ffc107;
    --bs-danger: #dc3545;
    --bs-light: #f8f9fa;
    --bs-dark: #212529;
    --bs-primary-rgb: 13, 110, 253;
    --bs-secondary-rgb: 108, 117, 125;
    --bs-success-rgb: 25, 135, 84;
    --bs-info-rgb: 13, 202, 240;
    --bs-warning-rgb: 255, 193, 7;
    --bs-danger-rgb: 220, 53, 69;
    --bs-light-rgb: 248, 249, 250;
    --bs-dark-rgb: 33, 37, 41;
    --bs-white-rgb: 255, 255, 255;
    --bs-black-rgb: 0, 0, 0;
    --bs-body-color-rgb: 33, 37, 41;
    --bs-body-bg-rgb: 255, 255, 255;
    --bs-font-sans-serif: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", "Liberation Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
    --bs-font-monospace: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
    --bs-gradient: linear-gradient(180deg, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0));
    --bs-body-font-family: var(--bs-font-sans-serif);
    --bs-body-font-size: 1rem;
    --bs-body-font-weight: 400;
    --bs-body-line-height: 1.5;
    --bs-body-color: #212529;
    --bs-body-bg: #fff;
    --background-color: #fff;
    --background1-color: #fff;
    --background2-color: #fff;
    --background3-color: #fff;
    --kacheltext-color: #121416d8;
    --text-color: black;
    --textcontnet-color: black;
    --link-color: #543fd7;
    --jumbotron-bg: #D3D3D3;
    --svg-invert: 60%;
    --svg-grayscale: 0%;
    --svg-brightness: 50%;
    --svg-brightness-hover: 100%;
    --bs-body-color: #212529;
    --bs-tableThemeHover-bg: #e5e6e7;
    --bs-tableThemeHover-color: #000;
    --bs-tableThemeSelected-bg: #dfe0e1;
    --bs-tableThemeSelected-color: #000;
    --bs-shadow-color: #000;
    --bs-tableBorderColor: lightgray;
    --bs-feststellungsColor: lightgray;
    --bs-massnahmeColor: lightgray;
   
}

html[data-kiqureportaltheme='light'] {
    --bs-shadow-color: #D3D3D3;
    --background-color: #f2f1f6;
    --background-colorKachelStartSeite: #fff;
    --background0-color: #fff;
    --background1-color: #f2f1f6;
    --background2-color: #f2f1f6;
    --background3-color: #f2f1f6;
    --kacheltext-color: #121416d8;
    --text-color: black;
    --textcontnet-color: black;
    --link-color: #fc1135;
    --link-color: #543fd7;
    --jumbotron-bg: #D3D3D3;
    --svg-invert: 60%;
    --svg-grayscale: 0%;
    --svg-brightness: 50%;
    --svg-brightness-hover: 100%;
    --bs-body-color: #212529;
    --jumbotron-bg: #708090;
    --bs-tableThemeHover-bg: #e5e6e7;
    --bs-tableThemeHover-color: #000;
    --bs-tableThemeSelected-bg: #dfe0e1;
    --bs-tableThemeSelected-color: #000;
    --bs-tableBorderColor: lightgray;
    --bs-feststellungsColor: lightgray;
    --bs-massnahmeColor: lightyellow;
}



html[data-kiqureportaltheme='dark'] {
    --bs-shadow-color: black;
    --background-color: #242424;
    --background-colorKachelStartSeite: #333333;
    --background0-color: #333333;
    --background1-color: #242424;
    --background2-color: #212a2e;
    --background3-color: #212a2e;
    --kacheltext-color: #F7F8F8;
    --text-color: #F7F8F8;
    --textcontnet-color: #F7F8F8;
    --link-color: #828fff;
    --jumbotron-bg: #708090;
    --svg-invert: 20%;
    --svg-grayscale: 00%;
    --svg-brightness: 100%;
    --svg-brightness-hover: 40%;
    --bs-body-color: #fff;
    --bs-body-bg: #212529;
    /*  --bs-body-bg: #fff;*/
    --bs-tableThemeHover-bg: #323539;
    --bs-tableThemeHover-color: white;
    --bs-tableThemeSelected-bg: dimgrey;
    --bs-tableThemeSelected-color: white;
    --bs-tableBorderColor: #6c757d;
    --bs-feststellungsColor: darkslategray;
    --bs-massnahmeColor: darkgoldenrod;
}

[data-kiqureportaltheme='light'] .d-block-light,
[data-kiqureportaltheme='dark'] .d-block-dark {
    display: block !important;
}

/*.container-fluid {
    position: relative;
    z-index: 1;*/ /* unter der Navbar */
/*}*/

body, html {
    margin: 0;
    padding: 0;
    overflow-x: hidden;
   
    /* height: 100vh;*/
    background-color: var(--background-color);
    max-width: 100%;
    overflow-x: hidden;
}
#snow {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 1000;
    pointer-events: none;
}

 
[data-kiqureportaltheme='dark'] .btn-close {
    filter: invert(1);
}

.form-text {
    color: var(--text-color);
}


.leftMenue {
    max-height: 200px;
    height: 200px;
    max-height: 125px;
    height: 125px;
    top: 50px;
}

.topMenue {
    top: 245px;
    top: 170px;
}

.AuswertungFilter {
    max-height: 300px;
    overflow-y: auto;
}




@media (min-width: 576px) {
    body, html {
        margin-left: 0px;
        margin-right: 0px;
    }

    .leftMenue {
        top: 50px;
        max-height: 200px;
        height: 200px;
        max-height: 125px;
        height: 125px;
    }

    .topMenue {
        top: 250px;
        top: 170px;
    }

    .AuswertungFilter {
        max-height: 300px;
        overflow-y: auto;
    }
}

@media (min-width: 768px) {
    body, html {
        /*   margin-left: 10px;
        margin-right: 10px;*/
    }

    .leftMenue {
        top: 50px;
        max-height: 200px;
        height: 200px;
        max-height: 125px;
        height: 125px;
    }

    .topMenue {
        top: 250px;
        top: 170px;
    }

    .AuswertungFilter {
        max-height: 300px;
        overflow-y: auto;
    }
}

@media (min-width: 992px) {
    body, html {
        /* margin-left: 10px;
        margin-right: 10px;*/
    }

    .leftMenue {
        top: 55px;
        max-height: calc(100vh - 50px);
        height: calc(100vh - 50px);
    }

    .topMenue {
        top: 45px;
    }

    .AuswertungFilter {
        max-height: 1000px;
        overflow-y: auto;
    }
}

@media (min-width: 1200px) {
    body, html {
        /* margin-left: 30px;
        margin-right: 30px;*/
    }
}

@media (min-width: 1400px) {
    body, html {
        /*  margin-left: 30px;
        margin-right: 30px;*/
    }
}

.body-content {
    /*  padding-left: 15px;
    padding-right: 15px;
    margin: 0px;
    height: 100vh;*/
}


.dropdown {
    border-radius: 0.25rem;
}

.MyFullheightContainer {
    /*50 ist Höhe der Navbar*/
    padding-top: 50px;
    min-height: calc(100vh - 50px);
}

.MyFullheightContainer250 {
    /*50 ist Höhe der Navbar*/
    min-height: calc(100vh - 250px);
}


.HideScrollbar::-webkit-scrollbar {
    display: none;
}

.HideScrollbar {
    scrollbar-width: none; /* Firefox */
}


.background {
    background-color: var(--background-color);
}

.background0 {
    background-color: var(--background0-color);
}

.background1 {
    background-color: var(--background1-color);
}

.background2 {
    background-color: var(--background2-color);
}

.background3 {
    background-color: var(--background3-color);
}




.feststellung {
    background-color: var(--bs-feststellungsColor);
}

.massnahme {
    background-color: var(--bs-massnahmeColor);
}

.BorderAuswertungenAll {
    border: solid;
    border-width: 0.5px;
    border-color: var(--bs-tableBorderColor);
}

.BorderAuswertungenLeft {
    border: solid;
    border-width: 0.1px;
    border-bottom: none;
    border-top: none;
    border-right: none;
    border-color: var(--bs-tableBorderColor);
}

.BorderAuswertungenRight {
    border: solid;
    border-width: 0.1px;
    border-bottom: none;
    border-top: none;
    border-left: none;
    border-color: var(--bs-tableBorderColor);
}

.BorderAuswertungenBottom {
    border: solid;
    border-width: 0.1px;
    border-top: none;
    border-right: none;
    border-left: none;
    border-color: var(--bs-tableBorderColor);
}

.BorderAuswertungenRightBottom {
    border: solid;
    border-width: 0.1px;
    border-top: none;
    border-left: none;
    border-color: var(--bs-tableBorderColor);
}


.BorderAuswertungenTopLess {
    border: solid;
    border-width: 0.1px;
    border-top: none;
    border-color: var(--bs-tableBorderColor);
}

.BorderAuswertungenTopBottomLess {
    border: solid;
    border-width: 0.1px;
    border-top: none;
    border-bottom: none;
    border-color: var(--bs-tableBorderColor);
}


.jumbotron {
    border-radius: 10px;
    border-width: 2px;
    border-style: solid;
    padding: 20px;
    margin-bottom: 4px;
    overflow-y: scroll;
    overflow-x: hidden;
}

.dl-horizontal dt {
    white-space: normal;
}


input,
select,
textarea {
    /*max-width: 280px;*/
}




* {
    box-sizing: border-box;
}

.bgKiQu {
    height: 100%;
    margin-left: 0px;
    margin-right: 0px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    padding: 0px;
}

.bgKiQu-text {
    position: absolute;
    top: 15px;
    left: 0%;
    margin: auto;
    z-index: 0;
    padding: 0px;
    text-align: center;
}

.bgTheme {
    background-color: var(--background0-color);
    color: var(--text-color);
    
    --bs-table-hover-color: var(--bs-tableThemeHover-color);
    --bs-table-hover-bg: var(--bs-tableThemeSelected-bg);
}

.textTheme {
    color: var(--text-color);
  
    --bs-table-hover-color: var(--text-color);
}


.btnauswahltheme {
    background-color: var(--background0-color);
    color: var(--text-color);
}

    .btnauswahltheme:hover {
        background-color: var(--bs-tableThemeSelected-bg);
        color: var(--bs-tableThemeHover-color);
    }


table.tableTheme {
    color: var(--text-color);
    width: 100%;
    margin-bottom: 1rem;
    vertical-align: top;
    border-color: #dee2e6;
    

}

    table.tableTheme.tableThemeStriped tr:nth-child(even) {
        background-color: var(--background0-color);
    }


.trSelected {
    background-color: var(--bs-tableThemeSelected-bg);
}

.trDisabled {
    background-color: var(--bs-tableThemeSelected-bg);
    pointer-events: none;
    opacity: 0.4;
}






.rowHighleight:hover {
    background-color: var(--bs-tableThemeHover-bg);
    color: var(--bs-tableThemeHover-color);
}

.navigationArrow:hover {
   
    background-color: lightgray;
   
}

td, th {
    padding: 5px;
    padding-left: 15px;
    padding-right: 15px;
}

    td.tdSelected {
        padding: 5px;
        padding-left: 15px;
        padding-right: 15px;
        background: var(--bs-tableThemeSelected-bg);
        background-color: var(--bs-tableThemeSelected-bg);
    }



[data-kiqureportaltheme='light'] td.feststellung {
    background-color: lightgray;
    padding: 2px;
    padding-left: 15px;
    padding-right: 15px;
    border-bottom-style: hidden
}

[data-kiqureportaltheme='dark'] td.feststellung {
    background-color: darkslategray;
    padding: 2px;
    padding-left: 15px;
    padding-right: 15px;
    border-bottom-style: hidden
}

[data-kiqureportaltheme='light'] td.massnahme {
    background-color: lightyellow;
    padding: 2px;
    padding-left: 15px;
    padding-right: 15px;
    border-bottom-style: hidden;
    border-top-style: hidden
}

[data-kiqureportaltheme='dark'] td.massnahme {
    background-color: darkgoldenrod;
    padding: 2px;
    padding-left: 15px;
    padding-right: 15px;
    border-bottom-style: hidden;
    border-top-style: hidden
}

td.noBorder {
    border-style: hidden;
}




td.first {
    border-style: hidden;
    border-left-style: solid;
}

td.last {
    border-style: hidden;
    border-right-style: solid;
}



tr.hide_right > td, td.hide_right {
    border-right-style: hidden;
}

tr.hide_all > td, td.hide_all, tr.hide_all > th, th.hide_all {
    border-right-style: hidden;
    border-left-style: hidden;
}




a.whitelink {
    color: #333333
}

    a.whitelink:active {
        color: #666666
    }

    a.whitelink:link {
        color: #999999
    }

    a.whitelink:visited {
        color: #CCCCCC
    }




.StartseiteInfo {
    border-radius: 10px;
    border-width: 0px;
    border-style: none;
    padding: 25px;
    margin: 5px;
    box-shadow: 3px 3px 3px 3px var(--bs-shadow-color);
    background: var(--background-colorKachelStartSeite);
    color: var(--kacheltext-color);
    height: 100%;
    text-align: center;
}

button.btn-startseite {
    border-radius: 10px;
    border-width: 0px;
    border-style: none;
    padding: 25px;
    margin: 5px;
    box-shadow: 3px 3px 3px 3px var(--bs-shadow-color);
    background: var(--background-colorKachelStartSeite);
    color: var(--kacheltext-color);
    height: 100%;
}

    button.btn-startseite:hover {
        color: #6c757d;
        border-color: #0a58ca;
        border-color: gray;
        box-shadow: 0 0 0 0 var(--bs-shadow-color);
    }

    button.btn-startseite:hover .btn-startseite-svg-color {
        filter: brightness(var(--svg-brightness-hover)) grayscale(var(--svg-grayscale)) opacity(50%);
    }

        button.btn-startseite:hover .btn-startseite-svg-sw {
            filter: invert(var(--svg-invert)) grayscale(var(--svg-grayscale)) brightness(var(--svg-brightness-hover));
        }

.btn-startseite-svg-sw {
    filter: invert(var(--svg-invert)) grayscale(var(--svg-grayscale)) brightness(var(--svg-brightness));
}

.btn-startseite-svg-color {
}

button.btn-startseite.backgroundTraeger {
    background-color: darkorange;
}

button.accordion-button.mylistbutton,
li.mylistbutton,
div.mylistbutton {
    background: var(--background-color);
    color: var(--text-color);
}

    button.accordion-button.mylistbutton:hover {
       
    }

#myUL {
    margin: 0;
    padding: 0;
   
    list-style-type: none;
}

.caret {
    cursor: pointer;
    -webkit-user-select: none; /* Safari 3.1+ */
    -moz-user-select: none; /* Firefox 2+ */
    -ms-user-select: none; /* IE 10+ */
    user-select: none;
}


    .myLi:hover, .caret:hover {
        color: #6c757d;
    }

    .caret::before {
        content: "\25B7";
        color: var(--textcontnet-color);
        display: inline-block;
        margin-right: 6px;
    }

.caret-down::before {
    -ms-transform: rotate(90deg); /* IE 9 */
    -webkit-transform: rotate(90deg); /* Safari */
    transform: rotate(90deg);
}

.nested {
    display: none;
    list-style-type: none;
}

.active {
    display: block;
    list-style-type: none;
    /*list-style-type: "♥ ";*/
}

span.selected {
    font-weight: bold;
}

span.unselected {
    font-weight: normal;
}

li.selected {
    font-weight: bold;
}

li.unselected {
    font-weight: normal;
}



.mydropdown {
    border-radius: 5px;
    padding: 10px;
    /*margin-bottom: 4px;*/
    /*background: var(--jumbotron-bg);*/
}

    .mydropdown:hover {
        /* border-radius: 25px;
    padding: 30px;*/
        /*margin-bottom: 4px;*/
        background: whitesmoke;
    }



.row.display-flex {
    display: flex;
    flex-wrap: wrap;
}

    .row.display-flex > [class*='col-'] {
        display: flex;
        flex-direction: column;
    }



/*Bewertungen Frage Height FragenBox*/
.BewertungFrageFrangenbox {
    max-height: 30vh;
}


@-moz-document url-prefix() {
    .BewertungFrageFrangenbox {
        max-height: 25vh;
    }
}


.alert-box {
    padding: 10px 16px;
    text-align: center;
    position: fixed;
    top: 50px;
    left: 25%;
    width: 50%;
    align-content: center;
    margin: auto;
    z-index: 20;
    border-radius: 10px;
}

.success {
    color: #3c763d;
    background-color: #dff0d8;
    border-color: #d6e9c6;
    display: none;
}








.myOverflow {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    max-width: 100%; /* Adjust max-width as necessary */
}

@media (min-width: 992px) {
    .myOverflow {
        white-space: normal;
        text-overflow: clip;
        overflow: visible;
    }
}
.centered-cell {
    text-align: center;
    vertical-align: middle;
}
.leftcentered-cell {
    text-align: left;
    vertical-align: middle;
}

/* Fix: ensure tableThemeStriped is visible and scoped to tbody (responsive rows) */
table.tableTheme.tableThemeStriped tbody tr:nth-child(even) {
    background-color: var(--bs-tableThemeHover-bg) !important;
}

    /* Ensure td/background of inner elements doesn't hide the tr background */
    table.tableTheme.tableThemeStriped tbody tr:nth-child(even) td,
    table.tableTheme.tableThemeStriped tbody tr:nth-child(even) td > div {
        background-color: transparent !important;
    }

/* Make sure theme attribute variations use same variable (light/dark) */
html[data-kiqureportaltheme='light'] table.tableTheme.tableThemeStriped tbody tr:nth-child(even),
html[data-kiqureportaltheme='dark'] table.tableTheme.tableThemeStriped tbody tr:nth-child(even) {
    background-color: var(--bs-tableThemeHover-bg) !important;
}