@import "jquery-validation.css";
@import "responsive-border.css";

@font-face {
    font-family: 'HK Nova';
    src: url('/fonts/hk_nova_medium/TTF/HKNova-Medium.ttf') format('truetype'),
         url('/fonts/hk_nova_medium/OTF/HKNova-Medium.otf') format('opentype');
    font-weight: 500;
    font-style: normal;
}

@font-face {
    font-family: 'Lato';
    src: url('/fonts/Lato/Lato-Light.ttf') format('truetype');
    font-weight: 300;
    font-style: normal;
}

@font-face {
    font-family: 'Lato';
    src: url('/fonts/Lato/Lato-Regular.ttf') format('truetype');
    font-weight: 400;
    font-style: normal;
}

@font-face {
    font-family: 'Lato';
    src: url('/fonts/Lato/Lato-Bold.ttf') format('truetype');
    font-weight: 700;
    font-style: normal;
}

@font-face {
    font-family: 'Lato';
    src: url('/fonts/Lato/Lato-Black.ttf') format('truetype');
    font-weight: 900;
    font-style: normal;
}

@font-face {
    font-family: 'Montserrat';
    src: url('/fonts/Montserrat/static/Montserrat-Light.ttf') format('truetype');
    font-weight: 300;
    font-style: normal;
}

@font-face {
    font-family: 'Montserrat';
    src: url('/fonts/Montserrat/static/Montserrat-Regular.ttf') format('truetype');
    font-weight: 400;
    font-style: normal;
}

@font-face {
    font-family: 'Montserrat';
    src: url('/fonts/Montserrat/static/Montserrat-Bold.ttf') format('truetype');
    font-weight: 700;
    font-style: normal;
}

@font-face {
    font-family: 'Montserrat';
    src: url('/fonts/Montserrat/static/Montserrat-Black.ttf') format('truetype');
    font-weight: 900;
    font-style: normal;
}

/** Navigation Styles & Fix */
nav a[target]:not(.btn) {
    font-weight: normal;
    text-decoration: none !important;
}

.link_decoration {
    font-weight: 500;
    -webkit-text-decoration-skip: ink;
    text-decoration-skip-ink: auto;
    text-decoration: underline !important;
}

/** flex fix **/
.flex-even {
    flex: 1;
}

/** dark theme fix **/
.table-clean {
    background: transparent !important;
}

.page-logo img {
    width: auto !important;
    height: auto !important;
    margin-left: -15px;
    margin-right: 2rem;
}

.page-logo {
    padding: 2rem !important;
}

.dropdown-menu.show {
    padding: 5px;
}

.kpi-description-button {
    position: absolute;
    right: 5px;
    top: 10px;
    font-size: 14px;
}

.widget-description-button {
    margin-left: -5px;
    margin-right: 10px;
    font-size: 14px;
}

.custom-menu-item {
    cursor: pointer !important;
    font-family: "Open Sans", sans-serif;
    font-size: 0.813rem;
    font-weight: 800;
    color: #2294A8;
}

.custom-menu-item:hover {
    color: #666666;
}

.loading-animation {
    display: none;
    position: fixed;
    z-index: 10000;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    background: rgba(255, 255, 255, .8) url('../images/loading_bar.gif') 50% 50% no-repeat;
    opacity: 0.80;
    -ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=80);
    overflow: hidden;
}

.was-validated .select2:invalid + .select2 .select2-selection {
    border-color: #dc3545 !important;
}

.was-validated .select2:valid + .select2 .select2-selection {
    border-color: #28a745 !important;
}

*:focus {
    outline: 0;
}

.selectable-kpi-box {
    cursor: pointer !important;
}

.selectable-kpi-box.selected .card {
    border: 2px solid #ffc300 !important;
    border-radius: 10px !important;
}

.selectable-kpi-box.selected.success,
.selectable-kpi-box.selected.fail {
    border: 2px solid #ffc300 !important;
}

.selectable-kpi-box:hover .card-title,
.selectable-kpi-box.selected .card-title,
.selectable-kpi-box.selected.success,
.selectable-kpi-box.selected.fail {
    background-color: #0068AB !important;
}

.selectable-kpi-box:hover .card-text,
.selectable-kpi-box.selected .card-text {
    background-color: #2C89B9 !important;
}

.selected-kpi-box .card-title {
    background-color: #0370b7 !important;
}

.phpdebugbar-widgets-table-list .phpdebugbar-widgets-table-list-item,
.phpdebugbar-widgets-list-item,
.phpdebugbar-widgets-name {
    color: white !important;
}


.filter-input {
    height: calc(1.47em + 1rem + 5px);
}

/* Custom theme Overrides */

.page-logo img {
    max-width: 100%;
}

.page-logo {
    background: #fff;
}
.page-sidebar, .nav-footer, .bg-brand-gradient {
    background: #ffffff!important;
    box-shadow: 0 0 15px rgba(0, 0, 0, 0.15);
}

#js_page_content .bg-white.border-faded.rounded {
    height: 100%;
}

.page-content {
    background-color: #ffffff!important;
}
 .page-sidebar, .nav-footer, .bg-brand-gradient {
    background-color: #4f3b82;
}
.nav-menu li.open > a,
.nav-menu li a,
.nav-menu li a:focus {
    color: #0f8b7b;
}
.nav-menu li.active > ul li a:focus,
.nav-menu li > ul li a {
    color: #fff;
}

.nav-menu li.active > a,
.nav-menu li > ul {
    color: #ffffff;
    background-color: #0f8b7b;
}

.nav-menu li a:hover {
    color: #0f8b7b;
    background-color: rgb(15 139 123 / 29%);
}
.nav-menu li a > [class*='fa-'], .nav-menu li a > .ni {
    color: #57afa4;
}
.mod-nav-link:not(.nav-function-top):not(.nav-function-minify):not(.mod-hide-nav-icons) ul.nav-menu:not(.nav-menu-compact) > li > ul:before {
    border: 1px solid #57afa4;
}

.mod-nav-link:not(.nav-function-top):not(.nav-function-minify):not(.mod-hide-nav-icons) ul.nav-menu:not(.nav-menu-compact) > li > ul > li a:after {
    background-color: #0f8b7b;
    border: 1px solid #57afa4;
}
.mod-nav-link:not(.nav-function-top):not(.nav-function-minify):not(.mod-hide-nav-icons) ul.nav-menu:not(.nav-menu-compact) > li > ul > li a:hover:after {
    background: #fff;
}
.nav-menu li > ul li.active > a {
    color: #FFFFFF;
    font-weight: 600;
}
.page-title {
    color: #412c7b!important;
}
.info-card img.cover {
    opacity: 1;
    filter: hue-rotate(54deg);
}

.custom-menu-item {
    color: #4f3b82!important;
}

.text-primary {
    color: #4f3b82 !important;
}

.card-title {
    background-color: #4f3b82!important;
}
.card-text {
    background-color: #4e4a92!important;
}

.selectable-kpi-box:hover .card-title, .selectable-kpi-box.selected .card-title, .selectable-kpi-box.selected.success, .selectable-kpi-box.selected.fail {
    background-color: #4e4a92 !important;
}
.selectable-kpi-box:hover .card-text, .selectable-kpi-box.selected .card-text {
    background-color: #4f3b82 !important;
}
.panel-hdr {
    background-color: #4d458e!important;
}
.panel-hdr[class^="bg-"] h2, .panel-hdr[class*=" bg-"] h2 {
    color: #fff;
}

div > table > thead {
    background-color: #4e4a92 !important;
}
html body a {
    color: #4e448e;
}

.card-text-1,.card-text-2 {
    background-color: #4e4a92 !important;
}
.card-text-3 {
    background-color: #4d458e!important;
}

.card-text-4 {
    background-color: #4d458e!important;
}
.page-item.active .page-link {
    background-color: #4d458e;
    border-color: #4d458e;
}
.menu-item, label.menu-open-button{
    background-color: #0f8b7b;
}
.menu-item:hover, label.menu-open-button:hover {
    background-color: #57afa4;
}
.nav-pills .nav-link.active, .nav-pills .show > .nav-link {
    color: #fff;
    background-color: #4d458e;
}

.btn-primary,.btn-primary:active {
    background-color: #4d458e;
    border-color: #4d458e;
}
.btn-primary:hover,.btn-primary:focus {
    background-color: #3c2776;
    border-color: #3c2776;
}

.btn-success, .btn-success:active {
    color: #fff;
    background-color: #4d458e;
    border-color: #0f8b7b;
}

.header-btn[data-class='mobile-nav-on'] {
    border-color: #4d458e;
    background: #4d458e;
    color: #fff;
    width: 3.875rem;
}

i.btn-icon {
    cursor: pointer;
    color: #76689f;
    font-size: 70%;
}

/* in your page’s <style> or main CSS */
input[type="range"].form-control-range {
    -webkit-appearance: none;
    appearance: none;
    width: 100%;
    height: 8px;
    background: #ddd;
    border-radius: 4px;
    outline: none;
    margin: 0;
    --thumb-bg: #888;  /* fallback */
}
/* thumb */
input[type="range"].form-control-range::-webkit-slider-thumb {
    -webkit-appearance: none;
    width: 16px; height: 16px;
    border-radius: 50%;
    background: #888;
    cursor: pointer;
    margin-top: -4px;
    background: var(--thumb-bg);
}
input[type="range"].form-control-range::-moz-range-thumb {
    width: 16px; height: 16px;
    border-radius: 50%;
    background: #888;
    cursor: pointer;
    --thumb-bg: #888;
}

.info-card {
    height: 4rem;
}

.info-card .profile-image {
    width: 2.525rem;
}

.table.dataTable {
    width: 100% !important;
}

.kpi_height_top {
    height: 50px;
    line-height: 50px;
    text-align: center;
    color: white;
    font-weight: bold;
}

.kpi_height_bottom {
    height: 30px;
    line-height: 30px;
    text-align: center;
    color: white;
    font-size: 12px;
}

.card-text {
    text-align: center;
    color: white;
    font-size: 32px;
    font-weight: bold;
    margin: 0;
}

.card-text-1, .card-text-2 {
    text-align: center;
    color: white;
    font-size: 32px;
    font-weight: bold;
    cursor: pointer;
}