body {
    overflow-y: scroll;
}

hr {
    border-width: 1px;
}

.lineHover:hover {
    background-color: #8a8686;
}

.modal-90-percent {
    --bs-modal-width: 90%;
}

.customCard {
    width:200px;
}

.no-border-radius-bottom {
    border-bottom-left-radius: 0 !important;
    border-bottom-right-radius: 0 !important;
}

.no-border-radius-top {
    border-top-left-radius: 0 !important;
    border-top-right-radius: 0 !important;
}

* {
    scrollbar-width: thin;
}

.disabled {
    background: #eff2f7;
}

.width-auto {
    width: auto;
}

.warning {
    color: #FF8080;
}

.fontBold{
    font-weight: bold;
}


.nav-tabs .nav-link.active.activeCustom{
    background: #343a40;
    color: white;
}

.mergedGroupTriggerBtn i:before{
    content: "\f07b";
}

.mergedGroupTriggerBtn i.rotated:before {
    content: "\f07c";
    transition: transform 0.5s ease-in-out;
}


.tooltip {
    position: relative;
    display: inline-block;
    opacity: 1;
    cursor: help;
}

.tooltip .tooltiptext {
    visibility: hidden;
    width: 120px;
    background-color: black;
    color: #fff;
    text-align: center;
    border-radius: 6px;
    padding: 5px 0;

    /* Position the tooltip */
    position: absolute;
    z-index: 1;
    opacity: 0;
    margin-left: 5px;
    transition: 1.0s;
}

.tooltip:hover .tooltiptext {
    visibility: visible;
    transition: 1.0s;
    opacity: 0.8
}


table.dataTable.nowrap th.wrap, table.dataTable.nowrap td.wrap {
    white-space: unset;
}

.tableWOBG > :not(caption) > * > * {
    background-color: unset
}

.overYScroll{
    max-height:500px;
    overflow-y: scroll;
}

.more-text {
    display: none;
}

tbody, td, tfoot, th, thead, tr {
    border-color:#cbcbcb;
}

.modal-body-custom {
    position: relative;
    -webkit-box-flex: 1;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
    padding: var(--bs-modal-padding);
}

/** Login-Screen BEGIN **/
.lockLogin{
    position: absolute;
    height: calc(100% + 20px);
    background: #00000085;
    min-height:calc(100% + 20px);
    z-index: 500;
    width: calc(100% + 20px);
    margin-top: -10px;
    margin-left: -10px;border-radius: 10px
}

.lockLogin:not(.hidden){
    display: grid;
    justify-items: center;
    align-items: center;
    font-size: 28px
}

.lockLogin i{
    color:rgba(255, 255, 255, 0.68)
}
/** Login-Screen END **/

.line-thru::after{
    border-bottom: 1px solid #DADADA;
    content: '';
    display: block;
    left: 10%;
    position: absolute;
    top: 47%;
    width: 81%;
    z-index: 1
}

.line-thru::before{
    background-color: #FFF;
    content: '';
    height: 10px;
    left: 50%;
    position: absolute;
    margin: -5px 0 0 -20px;
    top: 50%;
    width: 40px;
    z-index: 2;
}

.line-thru {
    display: block;
    font-size: 12px;
    font-size: 1.2rem;
    position: relative;
}

.line-thru span {
    color: #CCC;
    position: relative;
    z-index: 3;
}





/** Custom BreadCrumb **/
.customBreadCrumb {
    margin-left: -24px;
    width: calc(100% + 46px);
    padding: 5px;
    color: #fff;
    border-bottom: 1px solid #2a3042;
    margin-bottom: 24px;
}

.accordion-button.collapsed {
    background: #dfdfdf;
}

/*
.vertical-collpsed .vertical-menu #sidebar-menu > ul ul li:hover > ul {
    width: 220px;
}*/

.vertical-collpsed .vertical-menu #sidebar-menu > ul > li:hover > ul {
    width: 260px;
}

.vertical-collpsed .vertical-menu #sidebar-menu > ul > li:hover > a {
    width: 330px;
}


.navbar-brand-box {
    width:300px;
}

.vertical-menu {
    width: 300px;
}


.customBreadCrumb .page-title-box {
    padding-bottom: 10px;
}

/**
TOAST MESSAGE SPEZIAL CS
 */
.toastrAutoWidth {
    /*width:auto !important;*/
    min-width:500px !important;
}

.toastrAutoHeight {
    min-height: auto !important;
}

#toast-container > div {
    overflow: unset !important;
}

.collectionForm > .vpeData {
    display: flex;
    gap: 3px;
    justify-content: center
}

.collectionForm .btn-group .btn-default {
    background-color: #74788d;
    color: #eff2f7;
    border: 1px solid #74788d;
}

/** Custom Switch **/
input.customSwitch[switch] + label {
    width: 85px;
}

input.customSwitch[switch]:checked + label::after {
    left: 63px;
}

input.switch-100[switch] + label {
    width: 100px;
}

input.switch-100[switch]:checked + label::after {
    left: 75px;
}

input.switch-110[switch] + label {
    width: 110px;
}

input.switch-110[switch]:checked + label::after {
    left: 85px;
}

input.customSwitch[switch="bool"]:checked + label {
    background-color: #f46a6a;
}

input.customSwitch[switch="bool"] + label {
    background-color: #34c38f;
}


.markedLine {
    background:#daa9a9 !important;
}

.input-group {
    flex-wrap: nowrap;
}

@media (max-width: 991.98px) {
    .footer {
        left:0px;
    }
}

.main-content {
    margin-left: 300px;
}

.clear {
    clear: both;
    height:0px
}

select option:disabled{
    color:#b4b4b4;
}

.select2-results__option[aria-selected=true] {
    display: none;
}

.activeLine, .selectBookingLine {
    background: #d7b993 !important;
}


table.customTable {
    background: #fff;
    --bs-table-striped-bg: #f9f9f9;
    border: 1px solid #c2c5cc;
}

table.extraStriped > tbody > tr:nth-child(4n+1), table.extraStriped > tbody > tr:nth-child(4n+2){
    /* jede 4. ab der 1. und jede 4. ab der 2.*/
    background-color: var(--bs-table-striped-bg);
}

.customTable > :not(caption) > * > * {
    background-color: unset;
}

table.extraStriped_3_4 > tbody > tr:nth-child(4n+3), table.extraStriped_3_4 > tbody > tr:nth-child(4n+4){
    /* jede 3. ab der 1. und jede 3. ab der 2.*/
    background-color: #ededed !important;
}

table.customStriped > tbody > tr:nth-child(2n+1) > td{
    /* jede 2. ab der 1. und jede 4. ab der 2.*/
    background-color: var(--bs-table-striped-bg);
}

div.customStriped .row:nth-child(even) {
    background-color: #f2f2f2; /* Beispiel für eine hellgraue Hintergrundfarbe */
}

.striped-2 > * {
    background-color: #787676;
}
.striped-2 > *:nth-child(2n+1){
    /* jede 2. ab der 1. und jede 4. ab der 2.*/
    background-color: #8b8b8b;
}

.striped-2-light > * {
    background-color: #bfbfbf;
}
.striped-2-light > *:nth-child(2n+1){
    /* jede 2. ab der 1. und jede 4. ab der 2.*/
    background-color: #ffffff;
}

table.customTable > thead {
    background: #fff;
    border-bottom: 3px solid #ddd;
}


table.dataTable.nowrap th, table.dataTable.nowrap td, .table-responsive[data-pattern="priority-columns"] > .table > thead > tr > th, .table-responsive[data-pattern="priority-columns"] > .table > tbody > tr > th, .table-responsive[data-pattern="priority-columns"] > .table > tfoot > tr > th, .table-responsive[data-pattern="priority-columns"] > .table > thead > tr > td, .table-responsive[data-pattern="priority-columns"] > .table > tbody > tr > td, .table-responsive[data-pattern="priority-columns"] > .table > tfoot > tr > td {
    white-space: unset;
}

.noWrap div.thead > div.tRow > div, .noWrap div.tbody > div.tRow > div, .noWrap {
    white-space: nowrap;
}

table.wrapUnset td{
    white-space: initial !important;
}

table td.noWrap {
    white-space: nowrap !important;
}



.table-responsive:not(.spez){
    overflow: visible !important;
}

/** DIV AS TABLE BEGIN **/
.tbody, div.divTable > div.tbody > div.tRow > div, .tfoot, div.divTable > div.thead > div.tRow > div, .thead, .tRow {
    border-bottom: 1px solid #cbcbcb;
}

div.divTable > div.thead > div.tRow div {
    font-weight: bold;
}


div.divTable{
    display: table
}

div.divTable > div.thead{
    display: table-header-group
}

div.divTable > div.tbody{
    display: table-row-group
}

div.divTable > div.thead > div.tRow, div.divTable > div.tbody > div.tRow{
    display: table-row
}

div.divTable > div.thead > div.tRow > div, div.divTable > div.tbody > div.tRow > div{
    display: table-cell
}

div.customTable {
  background: #fff;
  --bs-table-striped-bg: #f2f4f7;
  border: 1px solid #c2c5cc;
}

div.extraStriped > .tbody > div:nth-child(4n+1), div.extraStriped > .tbody > div:nth-child(4n+2){
    /* jede 4. ab der 1. und jede 4. ab der 2.*/
    background-color: var(--bs-table-striped-bg);
}

div.customStriped > .tbody > div:nth-child(2n+1){
    /* jede 4. ab der 1. und jede 4. ab der 2.*/
    background-color: var(--bs-table-striped-bg);
}

div.customTable > .thead {
    background: #fff;
    border-bottom: 3px solid #ddd;
}



div.customTable div.tRow > div.cVC, div.customTable div.tRow > div.cVC {
    vertical-align: middle !important;
}

div.customTable div.tRow > div.cVT, table.customTable div.tRow > div.cVT {
    vertical-align: top !important;
}

.cC {
    text-align: center !important;
}

.cL {
    text-align: left !important;
}

.cR {
    text-align: right !important;
}

.cVC, .row.cVC > div {
    margin-top:auto !important;
    margin-bottom:auto !important;
    vertical-align: middle;
}

.table-responsive[data-pattern="priority-columns"] > .table > .thead > .tRow > div, .table-responsive[data-pattern="priority-columns"] > .table > .tbody > .tRow > div, .table-responsive[data-pattern="priority-columns"] > .table > .tfoot > .tRow > .div, .table-responsive[data-pattern="priority-columns"] > .table > .thead > .tRow > div, .table-responsive[data-pattern="priority-columns"] > .table > .tbody > .tRow > div, .table-responsive[data-pattern="priority-columns"] > .table > .tfoot > .tRow > div {
    white-space: unset !important;
}

.table.wrapUnset > .thead > .tRow > div, .table.wrapUnset > .tbody > .tRow > div, .table.wrapUnset > .tfoot > .tRow > .div, .table.wrapUnset > .thead > .tRow > div, .table.wrapUnset > .tbody > .tRow > div, .table.wrapUnset > .tfoot > .tRow > div {
    white-space: initial !important;
}

/** DIV AS TABLE END **/


.table-rep-plugin .fixed-solution .sticky-table-header table {
    color: #7f7e7e;
}

table.dataTable thead > tr > th.sorting::after, table.dataTable thead > tr > th.sorting::before {
    color: #7f7e7e;
    font-size: 20px;
}


.lineLimit-2 {
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    line-height: 1.5 !important;
    border-width: 0px !important;
}

.lineLimit-1 {
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
    line-height: 1.5 !important;
    border-width: 0px !important;
}


table.customTable tr > td.cVC, table.customTable tr > th.cVC {
    vertical-align: middle !important;
}

table.customTable tr > td.cVT, table.customTable tr > th.cVT {
    vertical-align: top !important;
}

table.customTable tr.cVC td, table.customTable tr.cVC th {
    vertical-align: middle !important;
}

.cC {
    text-align: center !important;
}

.cL {
    text-align: left !important;
}

.cR {
    text-align: right !important;
}

.customBtnGroup{
    display:block;
}

.progress{
    background-color: #e0e0e0;
}

.notifications .notification-menu::before {
    bottom: 100%;
    right: 16px;
}

.notifications .notification-menu::before, .notifications .notification-icon::before {

    border-bottom: 6px solid #cccccc;
    border-bottom-color: rgb(204, 204, 204);
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    content: '';
    height: 0;
    margin-right: -3px;
    width: 0;
    position: absolute;
    pointer-events: none;
}

.notifications .notification-menu::before, .notifications .notification-icon::before {
    border-bottom-color: #0088cc;
}

.notifications .notification-menu .notification-title {
    background: #0088cc;
    border-radius: 3px 3px 0 0;
    color: white;

    padding: 8px 6px 8px 12px;
    text-transform: uppercase;
}

.notification-menu {
    width: initial;
    padding-top:0px;
    margin-top:5px !important;
}

.notificationContent {
    padding:10px;
}

.progress-xxl {
    height: 25px;
    font-size: 12px
}

.reichwStatus>div{
    text-align: center;
    font-size: 14px;
    color: white;
    padding: 4px;
    border-radius: 4px
}

.clickAble {
    cursor: pointer;
}

.text-danger {
    color: #d2322d !important;
}

.text-black{
    color: #495057 !important;
}

.text-success{
    color: #47a447 !important;
}

.hidden{
    display:none !important;
}


.main-content {
    overflow: unset;
}

.navbar-header {
    background-color: #2a3042;
    color: #fff;
}

body[data-sidebar="dark"] .navbar-brand-box{
    /*background: #656565;*/
}

.header-item, .header-item:hover {
    color: #8e8e8e;
}

.accordion-item {
    border:0px;
}

#functionMenu{
border-bottom:1px solid #495057;
margin-bottom:10px;
position: sticky;
background-color:#fff;
top: 70px;
margin-top: -24px;
z-index:3;
display: block;
margin-left: -24px;
width: calc(100% + 46px);
padding: 10px 24px 10px 24px
}

#functionMenu .badge {
    background: #d2312d;
    color: #fff;
    font-size: 10px;
    font-weight: 400;
    height: 16px;
    padding: 3px 5px;
    position: relative;
    left: -30px;
    top: -18px;
    min-width:50px;
    border: 1px solid #fff
}

.mr-5 {
    margin-right:5px;
}

.page-content {

    min-height: 100vh;
    padding: 94px 20px 60px;
}

/** Footerleiste BEGIN **/
.footer {
    left:300px;
    margin:0px;
    padding:0px;
    position: sticky;
    bottom:0px;
    border-top:2px solid #2a3042;
    border-left:1px solid #f8f8f8;
    height: unset;
    z-index: 2
}

.footer .versionInfo {
    border-top:1px solid #2a3042;
    font-size: 10px;
    padding: 10px 10px 10px 10px;
    background-color: #2a3042;
    color:#fff;
}

#additionalInfo {
    max-height: 130px;
    overflow-y: scroll;
    background-color: #fff;
    padding:20px;
}

/** Footer-Leiste END **/


.margB {
    margin-bottom:260px;
}

.table-responsive:not(.spez) {
    overflow-x: clip;
}

.inCollection {
    background: #34c38f;
    color:#fff;
}


.searchContainer {
    display: flex;
    align-items: center;
    gap: 4px;
}


.collectionForm .btn-group > .btn-group:not(:last-child) > .btn,
.collectionForm .btn-group > .btn:not(:last-child):not(.dropdown-toggle),
.vpeData .btn-group > .btn-group:not(:last-child) > .btn,
.vpeData .btn-group > .btn:not(:last-child):not(.dropdown-toggle),
.searchContainer .btn-group > .btn-group:not(:last-child) > .btn,
.searchContainer .btn-group > .btn:not(:last-child):not(.dropdown-toggle){
    border-radius:.25rem;

    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
}

.collectionForm .customBtnGroup, .vpeData .customBtnGroup, .searchContainer .customBtnGroup {
    margin-left: -17px;

}

.searchContainer .btn-group .btn-default {
    background-color: #74788d;
    color: #eff2f7;
    border: 1px solid #74788d;
}

.optionInput {
    margin-right: 0px;
}

.collectionForm .sammelMengeInput, .vpeData .sammelMengeInput, .optionInput {
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
    border: 1px solid #74788d;
}

#functionMenu .accordion-item > div {
    border:1px solid #74788d;
}

#functionMenu .customAccordBtn {
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
}

#functionMenu .customAccordBtn[aria-expanded="true"] {
    background-color: #212121;
}

#functionMenu .customAccordBtn.danger[aria-expanded="true"] {
    background-color: #c60a0a;
}

.aLastSpanRight{
    display:block;
    margin: 4px 0 2px 0;
}

.aLastSpanRight span{
    display:block;
    float: right
}

.uHovEff{
    position: relative;
    cursor: pointer
}

.uHovEff::before{
    content: '';
    position: absolute;
    bottom: 0;
    right: 0;
    width: 0;
    height: 2px;
    background-color: #b4b4b4;
    transition: width 0.6s cubic-bezier(0.25, 1, 0.5, 1);
}

.blinkStandard {
    animation: blinker 1s linear infinite;
    color: #c60000;
    font-weight: 600;
}

@keyframes blinker {
    50% { opacity: 0.2 }
}

#toast-container > [class^='toastHov']:hover{

    border: 2px solid #50a5f1 !important;
    background-color: rgba(64, 137, 202, 1) !important;
    cursor: unset;

}

.verbrauchSpan{
    float:right
}

.reichwStatus.show div:first-child {
    color: #fff;
    background: #0088cc !important;
}

.reichwStatus.show div:first-child {

}

.reichwStatus.show .verbrauchSpan {
    color: #fff !important
}

.containsInvalid{
    background: #f6b7b9 !important
}

.notifications.noPfeil .notification-menu::before{
    border-bottom: unset;
}

.openMergedProd{
    font-size: 30px;
    margin-left: 40px;
}


[id^='lagerProductLine_'].collapsing{
    display: table-caption;
    width: 0px;
    overflow: hidden;
    max-height:62px;
    background: #faebd7 !important;
    opacity: 0;
}

[id^='lagerProductLine'][class^='multi-collapse']{
    background: #faebd7 !important;
}

[id^='lagerProductLine'][class^='multi-collapse'].show{
    transition: opacity 0.5s;
    opacity: 1;
}

[data-bs-target^='.multi-collapse'] i{
font-size: 30px;
    margin-left: 25px;
    color: #b5956b;
    cursor: pointer
}

[data-bs-target^='.multi-collapse']:hover i{
    color: #e6bf8d
}

[data-bs-target^='.multi-collapse'] i::before{
    content: "\f07b";
}

[data-bs-target^='.multi-collapse'] i::before{
    content: "\f07c";
}

.collectionForm a[aria-expanded="false"] i::before{
    content: "\f07b";
}
/*
.vertical-collpsed .navbar-brand-box {
    width: unset !important;
}


.vertical-collpsed .main-content {
    margin-left: 70px !important;
}*/


@keyframes noteBlink {
    60% {
        opacity: 0;
        color:red
    }
}

.noteBlink {
    animation: noteBlink 1s infinite;
}

.cbg{
    border: 2px solid  #cfcece;
}

@media (hover: hover) and (pointer: fine) {
    .uHovEff:hover::before{
        left: 0;
        right: auto;
        width: 100%;
    }
}

@media (min-width: 1100px) {

    .notification-menu {
        width: max-content;

    }
    /*
    .vertical-collpsed .navbar-brand-box {
        width: 70px !important;
    }*/

    /*
    .overYScroll{
        overflow-y: unset;
    }*/

.table-responsive:not(.spez) {
        overflow: visible !important;
    }
}

.importMsg{
    background-color: #fff !important;
    padding: 5px;
}

/** Import **/
#importStateWrapper {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    column-gap: 20px;
    row-gap: 20px;
}

.tableStateWrapper{
    background-color: #ebebeb;
}



.tableStateWrapper .alert-success, .tableStateWrapper .alert-danger {
    background-color:unset;
}

.tableFieldStateWrapper ul {
    margin-left: 0px;
    padding-left: 0px;
}

.tableFieldStateWrapper ul li {
    list-style: none;
    padding:5px;
}


.tableFieldStateWrapper ul li:nth-child(2n+1) {
    background-color: #c7ddf0;
}

@media (max-width: 992px) {
    .navbar-brand-box {
        width: 0px;
    }

    .navbar-brand-box {
        padding:unset;
    }
}


.display-block {
    display: block !important;
}

.display-inline-block {
    display: inline-block !important;
}

.display-none {
    display: none !important;
}

.display-inline-none {
    display: none !important;
}

.setClearBoth {
    clear:both;
    display: block;
    margin-bottom:5px;
}

.lagerPaginationWrapper{
    top: 200px;
}

.panelBox{
    border: 1px solid #ced4da;
    padding: 10px;
    border-radius: 5px;
    background-color: #eff2f7;
}


@media (min-width: 1024px) {

    .lagerPaginationWrapper{
        top: 150px;
    }

    .setClearBoth {
        clear: initial;
        display: none;
    }

    .display-sm-none {
        display: none !important;
    }

    .display-inline-sm-none {
        display: none !important;
    }

    .display-sm-block {
        display: block !important;
    }

    .display-inline-sm-block {
        display: inline-block !important;
    }
}

@media (max-width: 1024px) {
    #activityVariations table thead tr:not(.variConfig) th {
        border:0px;
    }

    #activityVariations table thead tr:not(.variConfig) th:nth-child(3) {
        display: none !important;
    }


    #activityVariations table tr:not(.variConfig) {
        display: grid;
        grid-template-columns: 15% 70% 15%; /* 3 Spalten nebeneinander */
        grid-template-rows: auto auto; /* 2 Zeilen */
        grid-template-areas:
                    "spalte1 spalte2 spalte4"  /* Erste Zeile mit 3 Spalten */
                    "spalte3 spalte3 spalte3"; /* Zweite Zeile mit einer Spalte über volle Breite */
    }

    #activityVariations table tr:not(.variConfig) td {
        border:0px;
    }

    #activityVariations table tr:not(.variConfig) td:nth-child(1) {
        grid-area: spalte1;
    }

    #activityVariations table tr:not(.variConfig) td:nth-child(2) {
        grid-area: spalte2;
    }

    #activityVariations table tr:not(.variConfig) td:nth-child(3) {
        grid-area: spalte3;
    }

    #activityVariations table tr:not(.variConfig) td:nth-child(4) {
        grid-area: spalte4;
    }

}