/*Overide bootstrap modals*/
.modal-dialog  {
    z-index: 1100;
}

.nav-mobile-div {
    margin-bottom: 0;
}


.main-navbar {
    z-index: 1050;
}

.module-navbar.navbar-fixed-top  {
    top: 50px;
}

.main-body {
    margin-top: 60px;
}

.dropdown-menu {
    height: auto;
    overflow-y: auto;
    overflow-x: hidden;
}

@media (max-width: 991px) {
    /*xs and sm*/

    .breadcrumb {
        font-size: 12px;
        padding: 5px 10px;
        margin-bottom: 15px;
        list-style: none;
        background-color: #f5f5f5;
        border-radius: 4px;
    }
    /*Changeing viewport*/
    .navbar-header {
        float: none;
    }
    .navbar-toggle {
        display: block;
    }
    .navbar-collapse {
        border-top: 1px solid transparent;
        box-shadow: inset 0 1px 0 rgba(255,255,255,0.1);
    }
    .navbar-collapse.collapse {
        display: none!important;
    }
    .navbar-nav {
        float: none!important;
        margin: 7.5px -15px;
    }
    .navbar-nav>li {
        float: none;
    }
    .navbar-nav>li>a {
        padding-top: 10px;
        padding-bottom: 10px;
    }
    .navbar-text {
        float: none;
        margin: 15px 0;
    }
    /* since 3.1.0 */
    .navbar-collapse.collapse.in {
        display: block!important;
    }
    .collapsing {
        overflow: hidden!important;
    }

    /*Area selecteror and mobile nav scroll*/
    .area-selector-mobile:hover, .area-selector-mobile:focus {
        background-color: #444444;
    }

    .layout-top-item {
        background-color: transparent;
        border-color: transparent;
        color: #777777;
    }

    .layout-top-item > a {
        background-color: transparent;
        border-color: transparent;
        color: #777777;
        text-decoration: none;
    }

    .layout-top-item.btn-info {
        color: #ffffff;
    }

    .layout-top-item.active, .layout-top-item:active, .open>.dropdown-toggle.layout-top-item,
    .layout-top-item.active:focus, .layout-top-item:active:focus, .open>.dropdown-toggle.layout-top-item:focus,
    .layout-top-item.active:hover, .layout-top-item:active:hover, .open>.dropdown-toggle.layout-top-item:hover {
        background-color: transparent;
        border-color: transparent;
    }

    .nav-mobile-div {
        position: relative;
        overflow-y: hidden;
        overflow-x: auto;
        padding: 0;
        scroll-behavior: smooth;
    }

    .nav-mobile-div-white {
        background-color: #ffffff;
    }
    .nav-mobile-opacity {
        position: fixed;
        right: 0px;
        opacity: 0.7;
        background-color: #f8f8f8;
        z-index: 101;
        width: 25px;
        height: 40px;
    }
    .nav-mobile-div-white .nav-mobile-opacity {
        background-color: #ffffff;
    }
    .nav-mobile-ul {
        margin: 0;
        box-sizing: content-box;
        width: auto;
    }
    .nav-mobile-ul > li{
        float:left;
    }

    ul.nav-mobile-ul.nav-tabs{
        padding-left: 10px;
    }
    ul.nav-mobile-ul.nav-pills{
        padding-left: 10px;
    }

    .main-body {
        margin-top: 50px;
    }
    .module-navbar {
        min-height: 40px;
    }
}

@media (max-width:767.98px) {

    .modal-dialog {
        margin-right:15px;
        margin-left:5px;
        width: auto;
    }
}
@media (min-width:768px) {
    .modal-lg {
        width: 720px;
    }
    .modal-md {
        width: 720px;
    }
}
@media (min-width: 992px) {

    .container {
        width: 990px;
    }

    .area-selector-desktop {
        margin-left: 5px;
    }
    .modal-lg {
        width: 950px;
    }
    .modal-md {
        width: 950px;
    }
}
@media (min-width: 1200px) {
    .container {
        width: 1190px;
    }
    .area-selector-desktop {
        margin-left: 8px;
    }

    .modal-lg {
        width: 90%;
    }
    .modal-md {
        width: 1150px;
    }
}

body {padding-top: 50px; color: #555;}
body .table {margin-bottom: 5px;}
body .pagination {margin-top:0;}
body .big-icon {font-size:102px; float:left; line-height: 102px;}
body .pointer {cursor: pointer;}
.txt-btn {padding: 6px 12px 6px 12px;}
.table tbody tr td { mso-number-format:\@; }
.table tbody tr td.button_cell {background-color: #fff; border-color: #fff;}
.table tbody tr:hover td.button_cell {background-color: #fff; border-color: #fff;}

.loader {position: fixed;top: 40%; left: 50%;margin-left:-80px;display: none;z-index:9999;overflow: auto;}
.loader.htmx-request {display: block;}

.list-group-item.selected {color: #31708f;background-color: #d9edf7;border-color: #bce8f1;}
.list-group-item {cursor: pointer;}

select[multiple]  {
    min-height: 200px;
}

.act_badge {background-color: #f2dede; position: absolute; right: 5px; top:2px;}

.icon-inactive {color: #aaaaaa;}

.alert-white {color: #999999; border-color: #dddddd; background-color: #ffffff;}
.alert-darkgrey {color: #777777; border-color: #cccccc; background-color: #CDCDCD;}
.alert-grey {color: #777777; border-color: #cccccc; background-color: #eeeeee;}
.alert-danger-warning-white{border-color: #dddddd; background: linear-gradient(90deg, #ffffff 33%, #fcf8e3 33%, #fcf8e3 67%, #f2dede 67%);}
.alert-danger-white{border-color: #dddddd; background: linear-gradient(90deg, #ffffff 50%, #ffffff 51%, #f2dede 51%);}
.alert-warning-white{border-color: #dddddd; background: linear-gradient(90deg, #ffffff 50%, #ffffff 51%, #fcf8e3 51%);}
.alert-info-danger {border-color: #dddddd; background: linear-gradient(90deg, #d9edf7 50%, #d9edf7 51%, #f2dede 51%);}
.alert-lightgrey-grey {border-color: #dddddd; background: linear-gradient(90deg, #EDEDED 50%, #EDEDED 51%, #CDCDCD 51%);}
.alert-all-active {border-color: #dddddd; background: linear-gradient(90deg,  #ffffff 33%, #f2dede 33%, #f2dede 66%,  #dff0d8 66%,  #dff0d8 100%);}
.alert-all {border-color: #dddddd; background: linear-gradient(90deg,  #ffffff 20%, #f2dede 20%, #f2dede 40%,  #dff0d8 40%,  #dff0d8 60%, #EDEDED 60%, #EDEDED 80%, #CDCDCD 80%, #CDCDCD 100%);}

.alert-small {padding: 2px; font-size: 0.8em; margin-bottom: 0;}
.alert-active {border-width: medium; font-weight: bold; border-color: #aaaaaa;}
.alert-small.alert-active{padding:1px;}
.nav-pills > li > a {padding-top:5px; padding-bottom:5px;}
.pagination>li:first-child>a {}
.pagination>li:last-child>a {}
.well {box-shadow: none;}
.form-control { box-shadow: none;}

table.table-slim {
    font-size: 12px;
}
table tfoot {font-weight: bold;}
.negative {color: #d51111;}
.positive {color: #3c763d;}

.note-toolbar.btn-toolbar {margin-left:0px;}
.note-editor {background-color: #fff;}

.well.white {
    background-color: #ffffff;
}
.well.lightgreen {
    background-color: #dff0d8;
}

.orange, .orange>td {
    background-color: #F5DEB3;
}
.grey, .grey>td {
    background-color: #CDCDCD;
}
.lightgrey, .lightgrey>td {
    background-color: #EDEDED;
}
.borderless.table {
    border: none;
}
.borderless td, .borderless th {
    border: none;
}
.btn-yellow {
    color: #8a6d3b;
    background-color: #fcf8e3;
    border-color: #faebcc;
}

i.warning {
    color: #F5DEB3;
}

.btn-xlg {
    padding: 18px 28px;
    font-size: 22px;
}

.form-group {
    margin-bottom: 10px;
}

.edit-in-mosaico {
    margin-bottom: 10px;
}

.select-column-div ul li.dropdown-item {
    display: block;
    padding: 3px 20px;
    clear: both;
    font-weight: 400;
    line-height: 1.42857143;
    color: #333;
    white-space: nowrap;
}

.select-column-div ul li.dropdown-item input[type=checkbox] {
    margin-top: 2px;
}

.select-column-div ul.dropdown-menu {
    max-height: 400px;
    overflow-y: auto;
}

.select-column-div ul.dropdown-menu li.dropdown-item.sticky-btn {
    position: sticky;
    top: 0;
    z-index: 10; /* Ensure it stays on top of other elements while scrolling */
    background-color: white; /* Match the background to avoid overlap issues */
    border-bottom: 1px solid #dddddd; /* Optional: Add separator for better visual distinction */
}

.select-column-div ul li.dropdown-item.active {
    color: #fff;
    text-decoration: none;
    background-color: #337ab7;
    outline: 0;
}
