html, *, .h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6{
    font-family: "Open Sans", sans-serif;
}

hr {
    background-color: #007461!important;
}

/* General UI */
body[data-sidebar-color=dark] .logo-box{background-color: #007461 !important;}
.cursor-pointer { cursor: pointer; }
.float-left { float:left; }
.float-right { float:right; }
.input-group-btn button { border: 1px solid #ced4da; box-shadow: 0 1px 4px 0 #ced4da; }
.input-group-btn button.btn:focus { box-shadow: 0 1px 4px 0 #ced4da; }
img.grayscale{
    filter: grayscale(100%);
    -webkit-filter: grayscale(100%);
    -moz-filter: grayscale(100%);
    -ms-filter: grayscale(100%);
    -o-filter: grayscale(100%);
}
.opacity-100 {opacity: 1;}
.opacity-75 {opacity: .75;}
.opacity-50 {opacity: .5;}
.opacity-25 {opacity: .25;}
.opacity-0 {opacity: 0;}
body[data-sidebar-color="dark"] .input-group-btn button.date-picker-btn { border: 1px solid #424E58; box-shadow: none; }

/* Custom megamodal */
.megamodal .modal-body { overflow-y: hidden !important; }
.megamodal .modal-body .col-menu { border-right: 1px solid rgba(152,166,173,.2); }
.megamodal .modal-body .form-content { padding-top: 20px; height: calc(100% - 73px) !important; overflow-x: hidden; }
.megamodal .modal-footer { border-top: 1px solid rgba(152,166,173,.2); justify-content: center; align-items: center }

.popup-edit .modal-body { width: 800px; }
@media screen and (max-width: 992px) {
    .popup-edit .modal-body { width: 100%; padding:0; }
    .popup-edit .modal-body h4 { padding-top:50px; }
    .megamodal .modal-dialog { width: 100% !important; }
}

/* SweetAlert2 */
.swal2-container { z-index: 9999999 !important; }

/* Nestable */
.dd{ max-width: 100%; }
.dd-list .dd-item .dd-handle:hover { background-color: aliceblue; }

/* Gridstack */
.grid-stack-item-content { background-color: #FFFFFF; box-shadow: 0 1px 4px 0 rgb(0 0 0 / 10%); }

/* X-Editable */
.x-assignable { color: white !important; }

/* Datatable */
table.dataTable{ width:100% !important; }
.dataTables_wrapper .dataTables_length, .dataTables_wrapper .dataTables_info { float: left; }
.dataTables_wrapper .dataTables_filter { float: right; }
table.dataTable tbody>tr.selected:hover{ background-color: #007461; --bs-table-hover-bg: ##007461; }
.dataTables_processing{z-index: 1;}
div.dt-top-container {display: grid;grid-template-columns: auto auto auto;}
div.dt-center-in-div {margin: 0 auto;}
div.dt-filter-spacer {margin: 10px 0;}

/* Notifications pop-in */
#notifications-small-list .notify-details { white-space: normal !important; }
#notifications-small-list .notify-item { padding: 10px 10px !important; }
#notifications-small-list.noti-scroll{ max-height: 350px !important; }

/* MultiSelect */
.multi-select.w100 .ms-container { max-width: 100% !important; }
.multi-select.h400 .ms-container .ms-list{ height: 400px; }

/* Toast */
.toast-container { z-index: 1002 !important; margin-right: 15px; margin-top: 15px; }

/* Other */
table.table-fit { width: 100% !important; table-layout: auto !important; }
table.table-fit thead th, table.table-fit tfoot th { width: auto !important; }
table.table-fit tbody td, table.table-fit tfoot td { width: auto !important; }

/* Dark theme */
body[data-sidebar-color="dark"] div.dtsp-panesContainer div.dtsp-searchPanes div.dtsp-searchPane div.dataTables_wrapper { border: 2px solid #303841 !important; }
body[data-sidebar-color="dark"] div.dtsp-panesContainer div.dataTables_wrapper div.dataTables_scrollBody { background: #303841 !important; }
body[data-sidebar-color="dark"] div.dtsp-topRow.dtsp-bordered { border: 2px solid #303841; }
body[data-sidebar-color="dark"] .card { box-shadow: none; }
body[data-sidebar-color="dark"] .table-danger {  background: #3f282d; border-right: 1px solid #515b65; }
body[data-sidebar-color="dark"] .table-warning { background: #2b2313; border-right: 1px solid #515b65; }
body[data-sidebar-color="dark"] .table-success { background: #132f2a; border-right: 1px solid #515b65; }

/* Custom */
.bg-brown{background: white!important;color: black;}
button.bg-brown{background: #007461!important;color: white;}
button.bg-brown:hover{background: #007461!important;color: white;}
.disable-content{text-decoration:line-through; color: red!important;}

table.turnoverTable{min-width: 1500px;}
table.turnoverTable td, table.turnoverTable th{min-width:30px!important; max-width:30px!important;}
table.turnoverTable td:first-child, table.turnoverTable th:first-child{min-width:60px!important; max-width:60px!important;}

table.realTurnoverTable{min-width: 1500px;}
table.realTurnoverTable td, table.realTurnoverTable th{min-width:55px!important; max-width:55px!important;}
table.realTurnoverTable td:first-child, table.realTurnoverTable th:first-child{min-width:60px!important; max-width:60px!important;}
table.realTurnoverTable th:nth-child(2){min-width:25px!important; max-width:25px!important; width: 25px!important;}

table.realTurnoverMonthTable{min-width: 2000px;}
table.realTurnoverMonthTable td, table.realTurnoverMonthTable th{min-width:55px!important; max-width:55px!important;}
table.realTurnoverMonthTable td:first-child, table.realTurnoverMonthTable th:first-child{min-width:60px!important; max-width:60px!important;}

table.realTurnoverWeekTable{min-width: 2500px;}
table.realTurnoverWeekTable td, table.realTurnoverWeekTable th{min-width:55px!important; max-width:55px!important;}
table.realTurnoverWeekTable td:first-child, table.realTurnoverWeekTable th:first-child{min-width:60px!important; max-width:60px!important;}

table.realTurnoverTable .fix{position: sticky;left: 0;z-index: 2;background: white}
table.realTurnoverMonthTable .fix{position: sticky;left: 0;z-index: 2; background: white}
table.realTurnoverWeekTable .fix{position: sticky;left: 0;z-index: 2; background: white}

.table-fix{overflow: auto; min-height: auto;}

#sidebar-menu .menuitem-active>a {
    color: #007461!important;
}
#sidebar-menu li>a:hover, #sidebar-menu li>a:focus {
    color: #007461!important;
}
.whiteLogo, .logo-box{
    background-color: white!important;
}

.animation-custom a{
    color: black;
    cursor: pointer;
}

.animation-custom a{
    cursor: pointer;
    border-bottom: solid 2px transparent!important;
}

.animation-custom a:hover, .animation-active-custom{
    border-bottom: solid 2px #007461!important;
    cursor: pointer;
    color: #007461!important;
    cursor: pointer;
}

.left-side-menu, .menuitem-active{
    background-color: #007461!important;
}

.navbar-custom .button-menu-mobile {
    color: black!important;
}

.navbar-custom .topnav-menu .nav-link {
    color: black!important;
}

#sidebar-menu>ul>li>a, #sidebar-menu>ul>li>a:focus, #sidebar-menu ul.nav-second-level li a {
    color: rgba(255, 255, 255, 0.6)!important;
}

#sidebar-menu>ul>li.menuitem-active>a, #sidebar-menu ul.nav-second-level li.menuitem-active a {
    color: white!important;
}

#sidebar-menu>ul>li:hover>a, #sidebar-menu ul.nav-second-level li:hover a {
    color: white!important;
}

body[data-sidebar-size=condensed] .left-side-menu #sidebar-menu>ul>li:hover>a {
    background-color: #007461!important;
}

body[data-sidebar-size=condensed] .left-side-menu #sidebar-menu>ul ul {
    background-color: #007461!important;
}

.pulse-css, .pulse-css:after, .pulse-css:before {
    background-color: #a51c30!important;
    color: white;
    font-size: 12px;
    font-weight: bold;
    line-height: 1rem;
    text-align: center;
}
.checked {
    color: orange;
}

.form-control, .form-select {
    box-shadow: none;
    border-color: rgba(205, 205, 205, 1);
    border-radius: 0.75rem;
    height: 48px;
    color: black;
}

.form-control:focus, .form-select:focus, .form-control:hover, .form-select:hover{
    color: black;
    border-radius: 0.75rem;
}

hr{
    margin-top: 2rem;
    margin-bottom: 2rem;
}

.card-title{
    color: #007461!important;
    font-weight: bold;
    margin-bottom: 15px;
}

label{
    color: black;
}

.btn{
    border-radius: 0.5rem;
}

.btn-success {
    box-shadow: none;
}

small{
    margin-bottom: 15px;
}

.header{
    background-position: center;
    background-size: cover;
}

[data-headerbg="color_1"] .nav-header .hamburger.is-active .line, [data-headerbg="color_1"] .nav-header .hamburger .line {
    background: white !important;
}

[data-sidebar-style="full"][data-layout="vertical"] .menu-toggle .nav-header .nav-control .hamburger .line {
    background-color: white !important;
}

/* Style the Image Used to Trigger the Modal */
#myImg {
    border-radius: 5px;
    cursor: pointer;
    transition: 0.3s;
  }
  
  #myImg:hover {opacity: 0.7;}
  
  /* The Modal (background) */
  .modal {
    display: none; /* Hidden by default */
    position: fixed; /* Stay in place */
    z-index: 1; /* Sit on top */
    padding-top: 15px; /* Location of the box */
    left: 0;
    top: 0;
    width: 100%; /* Full width */
    height: 100%; /* Full height */
    overflow: auto; /* Enable scroll if needed */
    background-color: rgb(0,0,0); /* Fallback color */
    background-color: rgba(0,0,0,0.9); /* Black w/ opacity */
  }
  
  /* Modal Content (Image) */
  .modal-content {
    margin: auto;
    display: block;
    width: 80%;
  }
  
  /* Caption of Modal Image (Image Text) - Same Width as the Image */
  #caption {
    margin: auto;
    display: block;
    width: 80%;
    text-align: center;
    color: #ccc;
    padding: 10px 0;
    height: 150px;
  }
  
  /* Add Animation - Zoom in the Modal */
  .modal-content, #caption {
    animation-name: zoom;
    animation-duration: 0.6s;
  }
  
  @keyframes zoom {
    from {transform:scale(0)}
    to {transform:scale(1)}
  }
  
  /* The Close Button */
  .close {
    position: absolute;
    top: 15px;
    right: 35px;
    color: #f1f1f1;
    font-size: 40px;
    font-weight: bold;
    transition: 0.3s;
  }
  
  .close:hover,
  .close:focus {
    color: #bbb;
    text-decoration: none;
    cursor: pointer;
  }
  
  /* 100% Image Width on Smaller Screens */
  @media only screen and (max-width: 700px){
    .modal-content {
      width: 100%;
    }
  }

  .hoverZoom:hover{
      cursor: pointer;
      transform: scale(1.05);
  }

  div.bg-blue-custom{
    background-color: #2c88fa !important;
  }

  div.bg-green-custom{
    background-color: #05a135 !important
  }

  div.bg-orange-custom{
    background-color: #ebc300 !important
  }

  div.bg-pink-custom{
    background-color: #ff37a6 !important
  }

  :root {
    --sw-border-color: #eeeeee;
    --sw-toolbar-btn-color: #ffffff;
    --sw-toolbar-btn-background-color: #008931;
    --sw-anchor-default-primary-color: #f8f9fa;
    --sw-anchor-default-secondary-color: #b0b0b1;
    --sw-anchor-active-primary-color: #78c043;
    --sw-anchor-active-secondary-color: #ffffff;
    --sw-anchor-done-primary-color: #588835;
    --sw-anchor-done-secondary-color: #c2c2c2;
    --sw-anchor-disabled-primary-color: #f8f9fa;
    --sw-anchor-disabled-secondary-color: #dbe0e5;
    --sw-anchor-error-primary-color: #dc3545;
    --sw-anchor-error-secondary-color: #ffffff;
    --sw-anchor-warning-primary-color: #ffc107;
    --sw-anchor-warning-secondary-color: #ffffff;
    --sw-progress-color: #78c043;
    --sw-progress-background-color: #f8f9fa;
    --sw-loader-color: #78c043;
    --sw-loader-background-color: #f8f9fa;
    --sw-loader-background-wrapper-color: rgba(255, 255, 255, 0.7);
  }

.dataTables_wrapper .dataTables_paginate .paginate_button {
    padding: 0;
}

.file-block {
    border-radius: 10px;
    background-color: rgba(144, 163, 203, 0.2);
    margin: 5px;
    color: initial;
    display: inline-flex;
}
.file-block > span.name {
    padding-right: 10px;
    width: max-content;
    display: inline-flex;
}
span[class^="file-delete"] {
    display: flex;
    width: 24px;
    color: initial;
    background-color: #6eb4ff;
    font-size: large;
    justify-content: center;
    margin-right: 3px;
    cursor: pointer;
}
span[class^="file-delete"]:hover {
    background-color: rgba(144, 163, 203, 0.2);
    border-radius: 10px;
}
span[class^="file-delete"] > span {
    transform: rotate(45deg);
}

.text-blue{
    color: blue;
}

.text-orange{
    color: orange;
}

.text-pink{
    color: pink;
}

.text-red{
    color: red
}

.text-grey{
    color: grey;
}

#searchBar:hover{
    border: 1.25rem;
}

.btn-outline-custom-blue{
    color: rgb(30,152,158);
    border-color: rgb(30,152,158);
}

.btn-outline-custom-blue:hover, .btn-outline-custom-blue.active {
    color: #fff;
    background-color:  rgb(30,152,158);
    border-color: rgb(30,152,158);
}

.btn-outline-custom-red{
    color: rgb(229,50,57);
    border-color: rgb(229,50,57);
}

.btn-outline-custom-red:hover, .btn-outline-custom-red.active {
    color: #fff;
    background-color:  rgb(229,50,57);
    border-color: rgb(229,50,57);
}

textarea:disabled{
    background: gainsboro!important;
}