/*
    REFERENCES:
    Material Iconic Font symbols:
    https://zavoloklom.github.io/material-design-iconic-font/icons.html
*/
body {
    font-family: proxima-nova, sans-serif;
}

html {
    font-family: proxima-nova, sans-serif;
}

.h1, .h2, .h3, .h4, .h5, .h6 {
    font-family: futura-pt, sans-serif;
}

:root {
    /* --primary-color: #216C8A; /*EDITED*/
    --primary-color: #3bca9F;
    --success-color: #5cac7e;
    --text-link-color: #216C8A; /*EDITED*/
    --chart-amounts-main-color: #3bca9F;
}

.iti-card-billOverview-notDue {
    background-color: #5cac7e;
}

.iti-card-billOverview-pastDue {
    background-color: #b63b3b;
}


.card-header-text-button {   
    color: #216C8A;    
}

.iti-add-contact-item .iti-add-contact-item-label {
        color: #216C8A;/*EDITED*/       
 }

.iti-no-pointer {
    cursor: default;
}

/*start extended daily usage kendo overrides*/


/* end extended daily usage kendo overrides*/

.iti-edit-contact-detail-item {
    color: #216C8A !important;    
}

.edit-preference-item {
    color: #216C8A !important;    
}

.iti-contact-detail-icon-add {
    color: #216C8A;/*EDITED*/
    border: 2px solid #216C8A;/*EDITED*/    
}

.iti-contact-detail-icon {
     /*background-color: #216C8A;/*EDITED*/    
      background-color: #3bca9F;
}

.iti-icon-color-inverted {   
    color: #216C8A;/*EDITED*/    
}

.iti-badge-primary {
    background-color: #216C8A;/*EDITED*/
    color: white !important; /*edited*/
}

.iti-badge-success {
    background-color: #95c8aa; /*EDITED*/
    color: white; /*edited*/
}

.iti-badge-warning {
    background-color: #F7981D; /*EDITED*/
    color: #333333; /*Edited*/
}

.iti-badge-danger {
    background-color: #b63b3b; /*EDITED*/
    color: white; /*EDITED*/
}

.iti-badge-info {
    background-color: #fde5c6; /*edited*/
    color: #333333;/*EDITED*/
}

/*Kendo dropdown changes*/

.accountSearch .accountSearchComboBox .k-dropdown-wrap .k-icon.k-i-arrow-s:before {
    font-family: "Material-Design-Iconic-Font";
    }

.iti-generic-filter-combobox .k-dropdown-wrap .k-icon.k-i-arrow-s:before {   
    font-family: "Material-Design-Iconic-Font";
}

/*END Kendo dropdown changes*/
.iti-accountSearch-width {
    width: 200px;
}

.top-nav-button {
    display: inline-block;   
}

.iti-menu-body .navigation__dropdown a.navigation__dropdown__label:after {
    font-family: "Material-Design-Iconic-Font";
   }

.iti-icon-check-big:before {
    font-family: "Material-Design-Iconic-Font";
   
}

.iti-icon-cross-big:before {
    font-family: "Material-Design-Iconic-Font";
    
}

.iti-icon-alert-triangle-big:before {
    font-family: "Material-Design-Iconic-Font";
   
}

.accountsdropdown { 
    background: #216c8a;    
}

.btn-paging {
        color: #216C8A;
}

.btn-paging:hover:not(:disabled) {     
        background: #216C8A;
}

.iti-menu-admin {
    background-color: #42484f; /*EDITED*/
}

#accountSearchBar {
    width: 300px;
}

.ndSelectRegEntDropdown {
    width: 366px;
}

.iti-action-link {   
    color: #216C8A; /*EDITED*/    
}

/*redesign base classes*/

.iti-bill-recipient-address .iti-address-line {
    line-height: 2rem;
    font-size: 1.4rem;
}

.iti-back-to-top { 
    background: #216C8A;   
}

.iti-viewall-link {   
    border: none;    
    color: #216C8A;/*EDITED*/    
}
   
.iti-navigate-back {
     color: #216C8A;    
}

.iti-form .btn.btn-primary {
    background-color: #216C8A;
    /*TODO: use variable for primary button*/
}

.iti-form .btn-primary:disabled:hover {
    background-color: #216C8A;
   
}

.iti-form .btn.btn-link,
.btn.btn-link {
    color: #216C8A;   
}

.iti-logo-small {

    height: 36px;
    background: var(--primary-color);
    padding: 5px;
    border-radius: 4px;
}

/*TO FIX:*/
.iti-help-tooltip-button {
    font-family: roboto;    
}

.bs-popover-right,
.bs-popover-left,
.bs-popover-bottom,
.popover.bs-popover-top,
.popover.bs-popover-botton {
    background: #31363c;
    
}

.popover.bs-popover-right .arrow::before,
.popover.bs-popover-right .arrow::after {
    border-right-color: #31363c;
}

.popover.bs-popover-left .arrow::before,
.popover.bs-popover-left .arrow::after {
    border-left-color: #31363c;
}

.popover.bs-popover-top .arrow::before,
.popover.bs-popover-top .arrow::after {
    border-top-color: #31363c;
}

.popover.bs-popover-bottom .arrow::before,
.popover.bs-popover-bottom .arrow::after {
    border-bottom-color: #31363c;
}

.iti-date-selector .iti-date-selector-icon {
        color: #216C8A;
}

/* start wizards */

.iti-wiz-step-link {   
    color: #216C8A;   
}  

.iti-wiz-nav-full .dot.fill {
            background-color: #216C8A;           
}

.iti-wiz-steps .iti-wiz-step-link.active {
    color: #216C8A; 
}

.iti-wiz-body .btn.btn-link {
    color: #216C8A;
   }

/* end wizards */

.iti-modal .btn.btn-link {
    color: #216C8A;
}

.iti-info-card-header {
    color: #216C8A;    
}  

/* Login error styling*/


.logo-img {   
    border-radius: 0px !important;   
    border-radius: 50%;
}

.bgContainer {
    flex: auto;
    display: flex;
    align-items: baseline;
    justify-content: center;
    padding: 2rem 0;
    background-color: rgba(0, 48, 135, 0.60);
    background-blend-mode: multiply;
    /*background: url(https://waterbillportal-acc.baltimorecity.gov/img/Baltimore_Skyline_Banner.jpg);*/
    background: url(https://waterbillportalco-tst.baltimorecity.gov/img/Courthouse_summer_2016.jpg);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    margin: 0px;
    min-height: 100vh;
}
/* End login error styling*/

@media (min-width: 768px) {    
    .iti-menu-banner {
       /* background: #216C8A; /*EDITED*/
       background:#3bca9F;
    }
}


@media (min-width: 576px) {
    
    #accountSearchButton {
        font-size: 18px;
        outline: none !important;
        padding-right: 20px;
    }

     #accountSearchButton:after {
            content: "Select or Search Account";
            position: relative;
            display: inline;
            left: 20px;
            top: 15%;
     }

    #accountSearchBar {
        width: 366px;
    }

    .regentdropdownname {
        width: 220px;
    }

}

@media (max-width:575.9px) {
    .content:not(.content--boxed):not(.content--full) {
        padding: 30px 15px 0;
    }

    .iti-menu-content {
        padding: 5px 15px 0;
    }

    #billingPastDueBalance {
        font-size: 18px !important;
    }

    .card-primary-action-order {
        order: 3;
    }

    .iti-card-primary-action-order {
        order: 3;
    }

    .card-menu-order {
        order: 2;
    }

    .iti-card-menu-order {
        order: 2;
    }

    .iti-action-link {
        padding-left: 0;
        padding-top: 0;
        float: left;
        border: none;
        margin-top: 10px;
    }

    .card-header-text-button {
        padding-left: 0;
        padding-top: 0;
        float: left;
        border: none;
    }

        .card-header-text-button:hover {
            border: none;
            box-shadow: none;
            border-radius: 0;
        }

    #accountSearchButton {
        font-size: 24px;
    }

        #accountSearchButton:hover {
            cursor: pointer;
        }

        #accountSearchButton span {
            display: none;
        }

    #NavMenu_Overview {
        display: none;
    }

    #accountSearchBar {
        /*
        display: block;
        position: absolute;
        z-index: 1;
        width: 98vw;
        transform: translateX(-53%);*/
    }

    .iti-menu-header .navigation__dropdown {
        width: 100%;
    }

    .iti-billOverview-dueBalance-big {
        font-size: 3rem;
        font-weight: 700;
        position: initial;
    }

    .iti-billOverview-dueBalance-small {
        font-size: 2rem;
        font-weight: 700;
        position: initial;
    }

    .iti-paymentus-sm-iframe {
        margin-left: -20px;
        width: 110% !important;
    }
}


/* style this class to change the background of even/odd slots instead of the day labels */

.iti-scheduler-slot.today .iti-scheduler-slot-day {
    border: 3px solid #216C8A;
     color: #216C8A;
}

.extendeddailyusageActualReading {
    color: #216C8A;
}

.extendeddailyusageEstimatedReading {
    color: #216C8A;
}

.extendeddailyusageEstimatedPattern {
    Stroke: #216C8A;
    Stroke-width: 3;
}

.extendeddailyusageCompareEstimatedPattern {
      Stroke-width: 3;
}

.iti-text-toggle .iti-text-toggle-item {
    background: rgba(44, 152, 240, 0.5);
    cursor: pointer;
    position: absolute;
    text-align: center;
    padding: 5px;
    border-radius: 30px;
    color: #FFFFFF;
}

.iti-text-toggle .iti-text-toggle-active-item {
    z-index: 1;
    background: #FFFFFF;
    border: 2px solid #216C8A;
    color: #216C8A;
    font-weight: 700
}


/*NEW*/
.btn-info {
    background-color: #216C8A;
    border-color: #216C8A;
}

.btn-danger {
    background-color: #b63b3b;
    border-color: #b63b3b;
}

.badge-blue {
    color: #fff;
    background-color: #216C8A;
    border-color: #216C8A;
}

.page-item.active .page-link {
    z-index: 2;
    color: #fff;
    background-color: #216C8A;
    border-color: #216C8A;
}

.badge-green {
    color: #fff;
    background-color: #5cac7e;
    border-color: #5cac7e;
}

.alert-dark {
    color: #1b1e21;
    background-color: #cbcfd6;
    border-color: #cbcfd6;
}

.alert-success {
    background-color: #badac7;
    border-color: #b8e3c6;
    color: black;
}

.alert-info {
    color: black;
    background-color: #cedce3;
    border-color: #c5edf4;
    /* background-color: #fde5c6; */
    /* color: #333333; */
}

.border-info {
    border-color: #99b8c7 !important;
}

.alert-warning {
    /* color: black; */
    background-color: #f8c88a;
    border-color: #fceeca;
    /* opacity: 50%; */
    color: #333333;
}

.border-warning {
    border-color: #f7981d !important;
}

.border-danger {
    border-color: #7f1f1f !important;
}

.alert-danger {
    color: white !important;
    background-color: #b63b3b;
    border-color: #b63b3b;
}

.k-form-error, .k-text-error, .k-form-field-error .k-label {
    color: #b63b3b;
}

.k-input.k-invalid, .k-input.ng-invalid.ng-touched, .k-input.ng-invalid.ng-dirty {
    border-color: #b63b3b;
}

iti-meterreadings-shortlist .iti-item-last {
    display: none;
}

iti-meterreadings-page .iti-item-last {
    display: none;
}

iti-accountpayment-button {
    display: none
}

loc-usermanagement button.btn.btn-primary.btn-sm.float-right {
    display: none;
}

iti-account-contactinfo {
    display: none;
}