﻿/*Base colors*/
/*
    #1BB854 - primary - green
    #E7F8ED - primary light - light green for grid row hover
    #FEC201 - secondary - mustard
*/

body {
    font-size: 13px;
}

a:hover {
    color: inherit;
}

[aria-expanded="false"] .fa-chevron-up,
[aria-expanded="true"] .fa-chevron-down {
    display: none;
}

/*NAVBAR LEFT AND TOP CSS*********************************************/
.bb-nav-lhs {
    height: 100%; /* 100% Full-height */
    width: 230px; /* 0 width - change this with JavaScript */
    position: fixed; /* Stay in place */
    z-index: 1; /* Stay on top */
    top: 0; /* Stay at the top */
    left: 0;
    overflow-x: hidden; /* Disable horizontal scroll */
    transition: 0.2s; /* 0.5 second transition effect to slide in the bb-nav-lhs */
    border-right: 2px solid #edeaea;
    overflow-y: hidden; /*OWN - hide the vertical nav bar and only show when hover over it*/
    scrollbar-width: none; /* Hide scrollbar in Firefox */
}

    .bb-nav-lhs:hover {
        overflow-y: auto;
    }

/* Make the navigation content scrollable */
.bb-scrollable-content {
    overflow-y: auto;
    height: calc(100vh - 350px); /* Adjust height based on header and footer size */
    scrollbar-width: none; /* Hide scrollbar in Firefox */
}

#navLHSButtons a {
    color: rgba(var(--bs-dark-rgb), var(--bs-text-opacity));
}

    #navLHSButtons a:hover {
        background-color: #E7F8ED;
    }

#navSettings {
}

    #navSettings a:hover {
        background-color: #E7F8ED;
    }

.bb-nav-lhs-header {
    font-weight: bold;
    margin: 7px;
    cursor: pointer;
}

/* Keep the footer fixed at the bottom */
.bb-nav-lhs-stickyfooter {
    position: sticky;
    bottom: 0;
    background-color: white; /*NB*/
    color: black;
    z-index: 10;
}

.bb-scrollable-content::-webkit-scrollbar {
    display: none; /* Hide scrollbar in WebKit-based browsers (Chrome, Edge, Safari) */
}


#navLHSFooterButtons {
    border-top: 1px solid #E5E5E5;
}

    #navLHSFooterButtons a {
        color: rgba(var(--bs-dark-rgb), var(--bs-text-opacity));
    }

        #navLHSFooterButtons a:hover {
            background-color: #E7F8ED;
        }


.bb-nav-lhs-header .chevron-up {
    display: none;
}

.bb-nav-lhs-header .chevron-down {
    display: inline;
}

.bb-nav-lhs-header[aria-expanded="true"] .chevron-up {
    display: inline;
}

.bb-nav-lhs-header[aria-expanded="true"] .chevron-down {
    display: none;
}

/* Style page content - use this if you want to push the page content to the right when you open the side navigation */
.bb-nav-rhs {
    transition: margin-left .2s;
    margin-left: 200px;
}

/*Hide side menu on small screen*/
@media only screen and (max-width: 1199px) {
    .bb-nav-lhs {
        width: 50px;
    }

    .bb-nav-rhs {
        margin-left: 50px;
    }

    #navLHSButtons {
        display: none;
    }

    #navLHSFooterButtons {
        display: none;
    }
}

/*show side menu on bigger screen screen*/
@media only screen and (min-width: 1200px) {
    #navLHSButtons {
        display: inherit;
    }

    #navLHSFooterButtons {
        display: inherit;
    }
}
/*end of NAVBAR LEFT AND TOP CSS*********************************************/

.bb-hidden {
    display: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    -o-user-select: none;
    user-select: none;
}

.bb-layouttable {
    width: 100%;
}

.bb-page-title1 {
    font-size: 20px;
    font-weight: bold;
}

.bb-dlg-pagetitle1 {
    font-size: 20px;
    font-weight: bold;
}


.bb-card-header {
    padding: 0.5rem 1rem;
    background-color: inherit;
}

.bb-card-title-container {
    padding-top: 0.5rem !important;
    cursor: pointer;
    padding-bottom: 1rem !important;
}

.bb-cardtitle1 {
    font-weight: bold;
    font-size: 15px;
    /*    margin-top: 10px;
    margin-bottom: 10px !important;*/
}

.bb-alerttitle1 {
    font-size: 15px;
}

.bb-field-label1 {
    font-weight: 500;
}

.bb-title1 {
    font-weight: 500;
}

.bb-roundbutton-green {
    background-color: #1BB854;
}

    .bb-roundbutton-green a {
        text-decoration: none;
        color: white;
    }


.bb-primary-color {
    color: #1BB854;
}

.bb-width-100 {
    width: 100%;
}

.bb-link {
    color: #1BB854;
    text-decoration: none;
    cursor: pointer;
}

    .bb-link :hover {
        color: #E7F8ED !important;
    }


.bb-link-breadcrumb {
    font: inherit;
}

    .bb-link-breadcrumb a {
        /* color: inherit;*/
        color: #1BB854 !important;
        text-decoration: none;
    }

        .bb-link-breadcrumb a:hover {
            /* text-decoration: underline;*/
            color: #484848 !important;
        }

.card .bb-card-link :hover {
    background-color: #E7F8ED;
}

.bb-dashboard-heading1 {
    font-family: 'Segoe UI Light';
    font-size: 1.3rem;
    font-weight: normal;
}

.bb-dashboard-heading2 {
    font-family: 'Segoe UI Light';
    font-size: 1.7rem;
    font-weight: normal;
}

.bb-dashboard-heading3 {
    font-family: 'Segoe UI Light';
    font-size: 0.9rem;
    font-weight: normal;
}

.bb-dashboard-heading4 {
    font-family: 'Segoe UI Light';
    font-size: 1rem;
    font-weight: normal;
}


.bb-chart-tooltip-header {
    margin-bottom: 5px;
    font-size: 16px;
    font-weight: 500;
    padding-bottom: 5px;
    border-bottom: 1px solid #c5c5c5;
}

.bb-chart-tooltip-body {
    width: 170px;
}

    .bb-chart-tooltip-body .series-name {
        font-weight: normal;
        display: inline-block;
        line-height: 1.5;
        padding-right: 10px;
        width: 126px;
    }

    .bb-chart-tooltip-body .value-text {
        display: inline-block;
        line-height: 1.5;
        width: 30px;
    }


.bb-card {
    border: 0 !important;
}

.bb-card-header {
    border-bottom: none !important
}

.bb-fill-primary {
    fill: #09B850 !important;
}

.stepper-outline .step-trigger:hover {
    background-color: transparent;
}

.stepper-outline .bs-stepper-circle {
    width: 3rem;
    height: 3rem;
    border-radius: 100%;
    background-color: var(--bs-light);
    border: 2px solid var(--bs-gray-200);
    color: var(--bs-gray-200);
    line-height: 1.8rem;
}

.stepper-outline .line {
    background-color: var(--bs-gray-200);
}

.stepper-outline .bs-stepper-content {
    padding: 20px;
}

.stepper-outline .step.active .bs-stepper-circle {
    color: var(--bs-gray-600);
    border: 2px solid var(--bs-gray-600);
    line-height: 1.8rem;
}

.stepper-outline .step .bs-stepper-label {
    margin: 0;
}

.stepper-outline .step.active .bs-stepper-label {
    color: var(--bs-primary);
}

.step-trigger {
    padding: 5px;
}

    .step-trigger:hover {
        text-decoration: none;
        background-color: transparent;
    }

@media (max-width: 767.98px) {
    .stepper-outline .bs-stepper-circle {
        width: 2.5rem;
        height: 2.5rem;
        line-height: 1.4rem;
    }

    .stepper-outline .step.active .bs-stepper-circle {
        line-height: 1.6rem;
    }

    .stepper-outline .bs-stepper-content {
        padding: 5px;
    }
}

.btn-danger-soft {
    color: #d6293e;
    background-color: rgba(214, 41, 62, 0.1);
}


.bb-card-header-blank {
    padding: 0.5rem 1rem;
    --bs-bg-opacity: 1;
    background-color: rgba(var(--bs-light-rgb), var(--bs-bg-opacity)) !important;
    z-index: 1;
}

.bb-loader {
    width: 48px;
    height: 48px;
    border: 5px solid #FFF;
    border-bottom-color: transparent;
    border-radius: 50%;
    display: inline-block;
    box-sizing: border-box;
    animation: rotation 1s linear infinite;
}

/* Compact theme overrides for DevExtreme DataGrid */
.dx-theme-compact .dx-datagrid-rowsview .dx-row > td {
    padding: 4px 8px; /* reduce cell padding */
    font-size: 12px;
}

.dx-theme-compact .dx-header-row > td {
    padding: 4px 8px;
    font-size: 12px;
}

.dx-theme-compact .dx-datagrid {
    font-size: 12px;
}

.dx-theme-compact .dx-datagrid-headers {
    line-height: 1.2;
}
