﻿body {
}
:root {
    --MainBlue: #1E80BB;
    --AccentBlue: #23A2DA;
    --LightBlueButton: #23a2da80;
    --AccentRed: #e93a3e;
    --Pending: #afafaf;
    --NotScheduled: #EB1E23;
    --Scheduled: green;
    --FollowUp: #db7a16;
    --Submitted: #1E80BB;
}

/*=================TOP NAV===================*/

.acctDrop {
    background-color: var(--MainBlue);
    display: block;
    margin: auto;
    width: 100%;
    text-align: center;
    color: white;
    padding: 1em;
    position: absolute;
    top: 0;
}

    .acctDrop a {
        color: white;
    }

    .acctDrop button {
        color: white;
    }

.hamBtn {
    text-align: end;
    padding: 1em;
    display: none
}

.notesNots {
    text-align: end;
}

    .notesNots .badge {
        margin-left: -10px;
    }


    /*Just admin top options*/

/*.topNavOpts {*/
/*    text-align: right;*/
  /*  text-align: center;*/
    /* bottom: 0; */
    /*margin: auto;
    display: flex;*/
    /*    display: table;*/
    /*height: 100%;*/
    /*    align-items: end;*/
    /*align-items: center;
}*/
/*=================END TOP NAV===================*/
/*=================SIDE NAV===================*/
.imgIconNav {
    width: 50px;
    height: 50px;
}

.stacked-menu > .menu > .menu-item.has-active > .menu-link {
    background-color: var(--AccentRed);
    color: white;
}

.stacked-menu > .menu > .menu-item.has-active > .menu-link {
    background-color: var(--AccentRed);
    color: white;
}

.stacked-menu .menu-item.has-open:not(.has-active) > .menu-link {
    background-color: green;
    color: white;
}

.stacked-menu > .menu > .menu-item > .menu-link:hover {
    color: white;
    background-color: var(--AccentBlue);
}

.stacked-menu > .menu > .menu-item > .menu-link:focus {
    background-color: var(--AccentRed);
    color: white;
}

 .menu-link:focus {
    background-color: var(--AccentRed);
    color: white;
}

/*.aside-content header button {
    background-color: var(--AccentRed);
    color: white
}*/

.mobileSideNavProfile{
    background-color:var(--AccentRed);
    color:white
}
/*SIDE NAV FOR ADMIN*/
.navHover {
    background-color: var(--Pending);
    position: absolute;
    left: 9rem;
    top: 0em;
    width: 9rem;
    min-width: fit-content;
    height: 100vh;
}

    .navHover li {
        width: 100%
    }


    /*    .nav-link{
        position:relative
    }
*/
    .navHover .nav-link:hover {
        color: white
    }
/*=================END SIDE NAV===================*/

@media (max-width: 767.98px) {
    .app-aside {
        top: 0;
        width: 50%;
        /*        min-width: 15rem;
        max-width: 16.5rem;*/
        /* -webkit-transform: translate3d(-100%, 0, 0);
            transform: translate3d(-100%, 0, 0);*/
        z-index: 1050;
        border-right: 0;
        display: block;
        min-width: auto;
        max-width: auto;
    }

        .app-aside.has-open {
            -webkit-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);
        }

    .app-header {
        position: fixed;
        top: 0;
        right: 0;
        left: 0;
        height: 3.5rem;
        background-color: #fff;
        color: var(--MainBlue);
        -webkit-box-shadow: 0 0 0 1px rgb(61 70 79 / 5%), 0 1px 3px 0 rgb(61 70 79 / 15%);
        box-shadow: 0 0 0 1px rgb(61 70 79 / 5%), 0 1px 3px 0 rgb(61 70 79 / 15%);
        z-index: 1030;
    }

    .hamBtn {
        display: block
    }

    .userAccountInfo {
        display: none;
        text-align: end;
    }

    .aside-menu {
        overflow: scroll;
    }

    .navHover {
        left: 100%;
        width: 100%;
        transition: visibility 0s, opacity 0.5s linear;
    }
}

/************************LENDER SIDE**********************************/


/*=================PAGES===================*/
.page-title {
    margin-top: 0;
    font-size: 1.75rem;
    text-align: center;
    margin-top: 0.5em;
}

.sub-title {
    margin-top: 0;
    font-size: .75rem;
    text-align: center;
    margin-top: 0.5em;
}

.textBoxCust {
    width: 100%;
    padding: 0.5rem 1rem;
    font-size: initial;
    border-radius: 16px;
}

.kanban-card span{
    font-weight: bold
}

.kanban-card {
    line-height: 14px;
}

/*.kanban-link-card {
    border-left: 8px solid #E61E23 !important;
    color: #E61E23 !important;
}*/
.loanNmb {
    text-align: end
}
/*=================END PAGES===================*/
.stacked-menu .icon {
    color: black
}

.projectAddPage input, select, textarea {
    /* max-width: 280px; */
    border-radius: 5px;
    border: 1px solid grey;
    font-size: 12px;
    padding: 5px;
    margin-bottom: 5px
}

.projectAddPage .RequiredField {
    font-size: 12px;
    background-color: #ffffcc;
    display: block;
    width: 100%;
    padding: 5px;
    line-height: 1.428571429;
    color: #555555;
    vertical-align: middle;
    border: 0.5px solid grey;
    border-radius: 5px;
    -webkit-box-shadow: inset 0 1px 1px rgb(0 0 0 / 8%);
    box-shadow: inset 0 1px 1px rgb(0 0 0 / 8%);
    -webkit-transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
    transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
}

.projectAddPage .NormalField {
    font-size: 12px;
    display: block;
    width: 100%;
    padding: 7px;
    line-height: 1.428571429;
    color: #555555;
    vertical-align: middle;
    border: 0.5px solid grey;
    border-radius: 5px;
    -webkit-box-shadow: inset 0 1px 1px rgb(0 0 0 / 8%);
    box-shadow: inset 0 1px 1px rgb(0 0 0 / 8%);
    -webkit-transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
    transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
    margin-bottom: 5px;
}

.projectAddPage .tblForm {
    border-collapse: separate;
    background-color: #ffffff;
    border-width: 0px;
    width: 100%;
    margin-bottom: 5px;
}

.projectAddPage h5 {
    padding: 5px;
    border-bottom: 2px solid var(--AccentRed);
}

.projectAddPage table {
  display:block
}

.projectAddPage table tr{
    display: grid
}

.checkboxForm table tr {
    display: revert;
}



#grid .e-content {
    overflow: scroll
}

.newProjBtns button{
    width:100%;
}
/************************END LENDER SIDE**********************************/



/************************ADMIN SIDE**********************************/
.dashboardGrid {
    grid-template-columns: repeat(auto-fit, minmax(100px, 1fr));
    display: grid;
    grid-template-rows: repeat(3, 200px);
    gap: 10px;
    grid-auto-flow: column;
    grid-auto-columns: 300px 100px;
}

/*Forms*/

.innerForms {
    width: 90%;
    padding: 12px;
    margin: auto;
    background-color: white;
    box-shadow: rgba(17, 17, 26, 0.1) 0px 4px 16px, rgba(17, 17, 26, 0.1) 0px 8px 24px, rgba(17, 17, 26, 0.1) 0px 16px 56px;
}

    .innerForms .control-label {
        color: #4e4e4e;
        font-weight: bold;
        font-size: 10px;
    }
#FormDiv label{
 margin-bottom: 0;
}

.RequiredField {
    background-color: #ffffcc !important;
}
/************************END ADMIN SIDE**********************************/
/************************INSPECTOR SIDE**********************************/
.headerInspect {
    text-align: center;
    box-shadow: 0px 0px 16px rgb(0 0 0 / 30%);
    padding: 1em;
    background-color: white;
}

.headerInspect img{
 width:80%;
 margin:auto;
 display:block;
 padding:1em
}



.inspectTable button {
    font-size: 12px;
    text-align: center;
    font-weight: bold;
}

.inspectTable td {
    padding-top: 1em;
    width: 100%;
}

.pending{
    background-color: var(--Pending);
    box-shadow: 0px 0px 16px rgb(0 0 0 / 30%);
}
.notScheduled {
    background-color: var(--NotScheduled);
    box-shadow: 0px 0px 16px rgb(0 0 0 / 30%);
}
.scheduled {
    background-color: var(--Scheduled);
    box-shadow: 0px 0px 16px rgb(0 0 0 / 30%);
}
.followUp {
    background-color: var(--FollowUp);
    box-shadow: 0px 0px 16px rgb(0 0 0 / 30%);
}
.submitted {
    background-color: var(--Submitted);
    box-shadow: 0px 0px 16px rgb(0 0 0 / 30%);
}

.inspectTable .metric-label {
    color:white
}

.innerLocations {
    background: #fff;
    text-align: center
}

    .innerLocations hr {
        background-color: #9d9999;
        height: 2px;
        margin: 0;
    }

    .metric .metric-value h3 {
        background-color: white;
        border-radius: 50px;
        margin: 5px;
        width: 30px;
        height: 30px;
        text-align: center;
    }

.viewBtn {
    font-size: 12px;
    color: white;
    width: 100%;
    text-align: end;
    margin-bottom: 0em;
}

/*.fa-caret-down:after {
    content: "\f0d8";
}*/

.locationInspect {
    background: #fff;
    /* box-shadow: 0px 0px 16px rgb(0 0 0 / 30%); */
    -webkit-border-radius: 2;
    -moz-border-radius: 2;
    border-radius: 4px;
    /* text-shadow: 1px 1px 3px #666666; */
    font-family: Poppins,sans-serif;
    color: #292929;
    font-size: 15px;
    padding: 10px 20px 10px 20px;
    text-decoration: none;
    border: 0px;
    margin: 0px 5px 0px 0px;
    cursor: pointer;
    width: 100%;
    min-width: 300px;
    max-width: 800px;
    text-align: left;
}



.inspectAccountButtons .inspectHomeButton {
    font-size: 10px;
    margin: 0;
    width: 100%;
    padding: 2em;
    background: #fff;
    box-shadow: 0px 0px 16px rgb(0 0 0 / 30%);
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    border-radius: 0;
    font-family: Poppins,sans-serif;
    color: #292929;
    text-decoration: none;
    border: 0px;
    cursor: pointer;
    width: 100%;
    min-width: auto;
    max-width: none;
    text-align: center;
}

    .inspectAccountButtons .inspectHomeButton i{
        padding:5
        px
    }

    .inspectAccountButtons button {
        display: block;
        margin: auto;
    }

.GreenButton {
    background: green !important;
    color: white !important;
    font-weight: normal !important;
}

.RedButton {
    background: red !important;
    color: white !important;
    font-weight: normal !important;
}



[data-toggle="collapse"] .viewBtn .fa:before {
    content: "\f139";
}

[data-toggle="collapse"].collapsed .viewBtn .fa:before {
    content: "\f13a";
}



/*===========================DETAIL PAGES=======================*/

.detailInspectDiv {
    margin: 5px;
    box-shadow: 0px 0px 16px rgb(0 0 0 / 30%);
    background-color: white;
    padding: 10px;
}

    .inspectDetailTable .metric-label {
     color:black
    }

.instructions p{
    font-size:12px
}

.inspectSec span{
    font-size:14px
}

.inspectPages span {
    font-weight: bold;
    color: var(--MainBlue)
}
.StandardInputFull textarea{
  height:100px
}

.inspectTable .QuestionButtonGood {
    background: #fff;
    border-radius: 4px;
    font-family: Poppins,sans-serif;
    color: #292929;
    font-size: 15px;
    padding: 10px 20px 10px 20px;
    text-decoration: none;
    border: 0px;
    margin: 0px 5px 0px 0px;
    cursor: pointer;
    width: 100%;
    min-width: 300px;
    max-width: 800px;
    font-size: 12px;
    text-align: center;
    font-weight: bold
}
    .inspectTable .QuestionButtonGood:hover {
        background: var(--AccentBlue);
    }

.DisabledButton {
    background: var(--Pending);
    color: #b1b0b0;
    /*   width: 100%;
    border-radius: 4px;
    font-size: 15px;*/
}

    .DisabledButton:hover {
        cursor: not-allowed;
    }




/*==========================BOOTSTRAP/andOTHER CUSTOM OVERRIDES=========================*/

.btn-primary {
    color: #fff;
    background-color: var(--MainBlue);
    border-color: var(--MainBlue);
}

  

.btn-secondary {
    color: var(--AccentBlue);
    background-color: #fff;
    border-color: var(--AccentBlue);
}


    .btn-secondary:hover {
        color: #fff;
        background-color: var(--LightBlueButton);
        background: var(--LightBlueButton);
        border-color: var(--AccentBlue);
    }


.btn-danger {
    color: #fff;
    background-color: var(--AccentRed);
    border-color: var(--AccentRed);
}

    .btn-danger:hover {
        color: var(--AccentRed);
        background-color: #fff;
        border-color: var(--AccentRed);
    }

.btn-success {
    color: #fff;
    background-color: #059936;
    border-color: #006f5f;
}

    .btn-success:hover, .btn-success:focus {
        color: #fff;
        background-color: #007c69;
        border-color: #006f5f;
    }

.btn-info {
    color: #fff;
    background-color: #00a28a;
    border-color: #00a28a;
}

    .btn-info:hover, .btn-info:focus {
        color: #fff;
        background-color: #00a28a;
        border-color: #00a28a;
    }


    .btn-primary:focus, .btn-secondary:focus, .btn-success:focus, .btn-danger:focus, .btn-success:focus, .btn-info:focus {
        border-color: none;
        background-color: initial;
        color: initial;
    }

.btn-primary:disabled, .btn-secondary:disabled, .btn-success:disabled, .btn-danger:disabled, .btn-success:disabled, .btn-info:disabled {
    border-color: none;
    background: #807f7f;
    color: white;
    font-style: italic;
    cursor: not-allowed;
}

    .btn-primary:disabled:hover, .btn-secondary:disabled:hover, .btn-success:disabled:hover, .btn-danger:disabled:hover {
        border-color: none;
        background: #807f7f;
        color: white;
        font-style: italic;
        cursor: not-allowed;
    }

.e-card-header-title{
    font-weight:bold
}

.e-card {
    box-shadow: 0px 0px 16px rgb(0 0 0 / 30%);
}

.alert-success {
    color: var(--MainBlue);
    background-color: #f5fbfa;
    border-color: var(--MainBlue);
}

/*.e-menu-container {
    width: 100%;*/
    /*height:100%;*/
    /*z-index: 1000;
}*/
.e-menu-wrapper ul.e-menu, .e-menu-container ul.e-menu {
    display: inline-block;
    width: 48%;
    text-align: end;
    overflow: auto;
    background-color: transparent;
}
.e-menu-wrapper ul .e-menu-item, .e-menu-container ul .e-menu-item {
  
    height: 44px;
    line-height: 44px;
}

    .e-menu-wrapper .e-menu .e-menu-item.e-selected, .e-menu-container .e-menu .e-menu-item.e-selected {
        color: white;
        outline: 0 solid #dee2e6;
        outline-offset: 0;
        background-color: var(--MainBlue);
        border-radius: 5px 5px 0px 0px;
        box-shadow: inset 0px 2px 5px #00000033;
    }

.dropdown-item.active, .dropdown-item:active, .dropdown-item:focus, .dropdown-item:hover {
    background-color: var(--MainBlue);
}

select.form-control:not([size]):not([multiple]) {
    height: inherit;
}




/*================MENU DROPDOWN=======================*/


.navOptDrop-content {
   
    z-index: 1;
    transition: all 0.25s ease-in; /* here */
}

.navOptDrop-content a {
    color: black;
 
    text-decoration: none;
}

.navOptDrop-content a:hover {
    cursor: auto;
}

.topNavOpts:hover .navOptDrop-content {
    /*   display: block; */ /* no need for display block and none, you can depend on opacity as long as the position is absolute*/
    transform: translateY(0); /* here */
    opacity: 1; /* here */
}

