/*
Click nbfs://nbhost/SystemFileSystem/Templates/Licenses/license-default.txt to change this license
Click nbfs://nbhost/SystemFileSystem/Templates/ClientSide/css.css to edit this template
*/
/* 
    Created on : Jul 17, 2025, 11:00:38 PM
    Author     : Deepu
*/


/* Hide Arrows On Number Input - Chrome, Safari, Edge, Opera */
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

/* Firefox */
input[type=number] {
    -moz-appearance: textfield;
}


/*  Header and sidebar sections  style edits - Start  */
.page-main-header {
    max-height: 85px;
}

.page-main-header .main-header-right .main-header-left {
    padding: 15px 20px !important;
}

.page-wrapper.compact-wrapper .page-body-wrapper .page-body {
    margin-top: 84px !important;
}

.logo-wrapper a {
    display: block;
}

.page-wrapper .page-main-header .main-header-right .nav-right>ul {
    top: 105px;
}

.logo-wrapper img {
    height: 55px;
}

.page-wrapper .page-body-wrapper .page-body {
    padding-bottom: 15px !important;
}

.page-wrapper.compact-wrapper .page-body-wrapper header.main-nav .main-navbar .nav-menu {
    height: calc(100vh - 205px);
}

.page-wrapper.compact-wrapper .page-body-wrapper header.main-nav .sidebar-main-title {
    display: none !important;
}

@media screen and (max-width: 991px) {
    .page-wrapper.compact-wrapper .page-body-wrapper header.main-nav {
        top: 85px !important;
        width: 310px !important;
    }

    .page-wrapper.compact-wrapper .page-body-wrapper header .sidebar-user h6 {
        padding-left: 0 !important;
        text-align: center !important;
    }

    .page-wrapper.compact-wrapper .page-body-wrapper header .sidebar-user p {
        padding-left: 0;
        display: block;
        text-align: center;
        max-width: 100% !important;
    }
}

@media screen and (max-width: 767px) {
    .page-wrapper.compact-wrapper .page-body-wrapper header.main-nav .main-navbar .nav-menu {
        height: calc(100vh - 188px) !important;
    }
}

@media screen and (max-width: 480px) {
    .page-wrapper.compact-wrapper .page-body-wrapper .page-body {
        margin-top: 75px !important;
    }

    .page-wrapper .page-main-header {
        height: 75px;
    }

    .page-wrapper.compact-wrapper .page-body-wrapper header.main-nav {
        top: 75px !important;
    }

    .logo-wrapper img {
        height: 45px !important;
    }
}

@media screen and (max-width: 575px) {
    .page-wrapper .page-main-header .main-header-right .nav-right>ul {
        top: 75px;
    }
}

/*  Header and sidebar sections  style edits - End */
.appoiment-activity {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 24px;
}

.appoiment-activity h3 {
    font-size: 18px;
    font-weight: 600;
    margin: 0 0 15px 0;
}

.appoiments-blocks,
.activity-blocks {
    background-color: #fff;
    border: 1px solid #e6edef;
    padding: 20px 10px 20px 20px;
}

.appoiment-list-holder,
.activity-list-holder {
    padding: 0 10px 0 0;
    overflow-y: scroll;
    max-height: 400px;
}

.appoiment-list-holder::-webkit-scrollbar-track .activity-list-holder::-webkit-scrollbar-track {
    -webkit-box-shadow: none;
    background-color: #F5F5F5;
    border-radius: 5px;
}

.appoiment-list-holder::-webkit-scrollbar,
.activity-list-holder::-webkit-scrollbar {
    width: 5px;
    background-color: #F5F5F5;
    border-radius: 5px;
}

.appoiment-list-holder::-webkit-scrollbar-thumb,
.activity-list-holder::-webkit-scrollbar-thumb {
    background-color: #0d47a1;
    border: 2px solid #0d47a1;
    border-radius: 5px;
}

.appoiment-list-holder {
    overflow-y: auto;
}

.appoiments-blocks .appoiment-list {
    background: rgba(13, 72, 161, 0.1);
    padding: 10px;
    position: relative;
    margin: 0 0 15px 0;
}

.appoiments-blocks .card_heading {
    display: flex;
    justify-content: space-between;
    flex-direction: row-reverse;
    align-items: flex-start;
}

.appoiments-blocks .label-sm {
    font-size: 10px;
    padding: 0 5px;
    text-transform: uppercase;
    border-radius: 5px;
    line-height: 18px;
}

.label-sm.confirmed {
    background-color: #86d88b;
    color: #fff;
}

.label-sm.pending {
    background-color: #e66060;
    color: #fff;
}

.label-sm.followup {
    background-color: #e2be2e;
    color: #fff;
}

.appoiments-blocks .appoiment-list h6,
.activity-blocks .activity-list h6 {
    margin: 0 0 5px 0;
}

.appoiments-blocks .card_date {
    font-size: 14px;
    margin: 10px 0 0 0;
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    color: #666666;
}

.appoiments-blocks .card_date i {
    margin-right: 5px;
}

.appoiments-blocks .card_subline,
.activity-blocks .card_subline {
    color: #666666;
}

.activity-blocks .activity-list {
    display: flex;
    gap: 20px;
    margin: 15px 0 0 0;
}

.activity-blocks .notify-icon {
    width: 32px;
    height: 32px;
    font-size: 14px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    background: rgba(13, 72, 161, 0.1);
    color: #0d47a1;
}

.activity-blocks .activity-content {
    width: calc(100% - 32px);
}

.activity-blocks .activity-list h6 {
    margin: 0 0 8px 0;
}

.activity-blocks .notify_date {
    display: block;
    font-size: 12px;
    color: #b5b5b5;
    margin: 5px 0 0 0;
}

@media screen and (max-width: 1200px) {
    .appoiment-activity {
        grid-template-columns: repeat(1, 1fr);
    }
}

@media screen and (max-width: 575px) {

    .appoiments-blocks,
    .activity-blocks {
        padding-right: 10px;
        padding-left: 10px;
    }

    .activity-blocks .activity-list {
        gap: 15px;
    }
}


/** Labels Style **/
.acc_active {
    font-size: 11px;
    line-height: 24px;
    background: linear-gradient(0deg, rgba(119, 233, 125, 1) 0%, rgba(152, 245, 156, 1) 100%);
    color: #179d1c;
    padding: 0px 12px;
    border-radius: 16px;
    display: inline-block;
    font-weight: 500;
    text-transform: uppercase;
    border: solid 1px #78da7e;
    text-shadow: 1px 0px 1px rgba(255, 255, 255, 0.8);
}

.acc_inactive {
    font-size: 11px;
    line-height: 24px;
    background: linear-gradient(0deg, rgb(255 169 169) 0%, rgb(255 209 205) 100%);
    color: #ce3232;
    padding: 0px 12px;
    border-radius: 16px;
    display: inline-block;
    font-weight: 500;
    text-transform: uppercase;
    border: solid 1px #daa9a9;
    text-shadow: 1px 0px 1px rgba(255, 255, 255, 0.8)
}

/** Status Commom Styles **/

.quote_approved,
.quote_rejected,
.new_pending,
.completed,
.assigned {
    font-size: 11px;
    line-height: 24px;
    padding: 0px 12px;
    border-radius: 16px;
    display: inline-block;
    font-weight: 500;
    text-transform: uppercase;
    text-shadow: 1px 0px 1px rgba(255, 255, 255, 0.8);
    border-style: solid;
    border-width: 1px;
}

.quote_approved {
    background: linear-gradient(0deg, rgba(119, 233, 125, 1) 0%, rgba(152, 245, 156, 1) 100%);
    color: #179d1c;
    border-color: #78da7e;
}

.quote_rejected {
    background: linear-gradient(0deg, rgb(255 169 169) 0%, rgb(255 209 205) 100%);
    color: #ce3232;
    border-color: #daa9a9;
}

.new_pending {
    background: linear-gradient(0deg, #FFCC17 0%, #FFE073 100%);
    color: #64510F;
    border-color: #ECD22A;
}

.completed {
    background: linear-gradient(0deg, #B1B1B1 0%, #BEBEBE 100%);
    color: #434343;
    border-color: #B3B3B3;
}

.assigned {
    background: linear-gradient(0deg, #5E40BE 0%, #8768EA 100%);
    color: #EAE5FA;
    border-color: #5530CB;
}


/* Login */
.logo___holder {
    text-align: center;
    margin-bottom: 15px;
    padding-bottom: 15px;
    border-bottom: solid 1px #e6ecf5;
}

.logo___holder img {
    height: 55px;
}

.engineeer_multiselect {
    padding: 20px;
    background-color: #f3f7fe;
    border-radius: 10px;
    border: solid 1px #e6ecf5;
}

.joblisting {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.joblisting .selection_item {
    display: flex;
    align-items: flex-start;
}

.joblisting .custom-control-input {
    display: none;
}

.joblisting .custom-control-label {
    width: 100%;
    height: 100%;
    max-width: 420px;
    align-items: center;
    display: flex;
    padding: 10px 20px;
    background-color: #f3f3f3;
    border: 1px solid #e3e3e3;
    border-radius: 10px;
    cursor: pointer;
    user-select: none;
    transition: all 0.3s ease;
    font-size: 14px;
    font-weight: 400;
    color: #333;
}

.joblisting .custom-control-input:checked+.custom-control-label {
    background-color: #0d47a1;
    color: white;
    border-color: #083983;
}

.status_no,
.status_yes {
    display: block;
    margin: 0 auto;
    width: 24px;
    height: 24px;
    line-height: 22px;
    text-align: center;
    border-radius: 50%;
    font-size: 12px;
    font-weight: 400;
}

.status_no {
    background: #ffc5c5;
    color: #ff4f4f;
    border: solid 1px #ff9696;
}

.status_yes {
    background: #6affb5;
    color: #01a442;
    border: solid 1px #65de95;
}

.boxx__items {
    padding: 30px 20px;
    background: #f5f7fb;
    border: solid 1px #d7ddeb;
    border-radius: 10px;
    margin-bottom: 20px;
}

.idhilight {
    color: #083983;
    font-weight: 600;
    font-style: italic;
}


.post-details-right {
    text-align: right;
}

.post-details-right .post-id {
    display: block;
    font-size: 15px;
    color: #59667a;
    margin-bottom: 5px;
}

.post-details-right .post-id strong {
    color: #0D47A1;
    font-weight: 700;
}

.idhilight {
    color: #e26156;
    font-style: italic;
    margin-left: 5px;
}

@media screen and (max-width: 992.98px) {

    .post-details-right .post-id,
    .post-details-right .post-id strong {
        font-size: 16px;
    }
}

@media screen and (max-width: 575.98px) {
    .post-details-right {
        text-align: left;
    }

    .post-details-right {
        margin-top: 10px;
    }
}

.two-col-btns {
    display: flex;
    justify-content: space-between;
    padding-top: 15px;
    margin-top: 15px;
    border-top: solid 1px #dde5f1;
}

@media screen and (max-width: 575.98px) {
    .two-col-btns {
        gap: 10px;
        flex-direction: column;
    }
}

.quote-details-list {
    margin: 20px 0 0 0;
}

.quote-details-list h3 {
    font-size: 20px;
    font-weight: 500;
    margin: 0 0 15px 0;
}

.quote-details-list .status_no,
.quote-details-list .status_yes {
    margin: 0;
}

.quote-details-list .list-item {
    display: flex;
    align-items: flex-start;
    padding: 15px 0;
    margin: 0;
    border-bottom: solid 1px #EAE5FA;
}

.quote-details-list .list-item:last-child {
    border-bottom: none;
    padding-bottom: 0;
}

.quote-details-list .list-item .list-label {
    flex: 0 0 200px;
    color: #59667a;
    font-weight: 500;
    margin: 0 15px 0 0;
}

.quote-details-list .list-item .item-result {
    display: flex;
    align-items: center;
    gap: 10px;
}

@media (max-width: 1600px) {
    .quote-details-list h3 {
        font-size: 18px;
    }
}

@media screen and (max-width: 991.98px) {
    .quote-details-list .list-item {
        flex-direction: column;
    }

    .quote-details-list .list-item .list-label {
        flex: 0 0 auto;
        margin: 0 0 10px 0;
    }
}


.sent-quote-form h3 {
    font-size: 20px;
    margin: 0 0 15px 0;
}

.sent-quote-form .quote-amount {
    max-width: 320px;
}

.sent-quote-form .note-sm {
    font-size: 16px;
    color: #59667a;
    line-height: 100%;
    margin-bottom: 15px;
}

.quote__checklist {
    padding-top: 15px;
    margin-top: 15px;
    border-top: solid 1px #dde5f1;
    display: flex;
    justify-content: space-between;
    gap: 10px 15px;
}

@media (max-width: 1600px) {
    .sent-quote-form h3 {
        font-size: 18px;
    }
}

@media (max-width: 768px) {
    .quote__checklist {
        flex-direction: column;
        justify-content: left;
    }
}



.assign-engineer h3,
.assign-engineer-scheduled h3 {
    font-size: 20px;
    margin: 0 0 15px 0;
}

.assign-engineer .engineer-dropdown {
    max-width: 100%;
    margin-bottom: 20px;
}

.assign-engineer .avail-result {
    padding: 20px;
    border-radius: 8px;
    text-align: center;
    margin-top: 20px;
}

.assign-engineer .avail-result p {
    font-size: 16px;
    font-weight: 500;
    line-height: 110%;
}

@media (max-width: 1600px) {
    .assign-engineer h3 {
        font-size: 18px;
    }
}

@media screen and (max-width: 991.98px) {
    .assign-engineer .avail-result p {
        font-size: 14px;
    }
}

.eng--available {
    border: solid 1px #45ae6f;
    background-color: #65de95;
}

.eng--not_available {
    border: solid 1px #ff6b6b;
    background-color: #f79f9f;
}

.button-white {
    display: inline-block;
    background-color: transparent;
    color: #fff;
    font-weight: 600;
    box-shadow: 0 0 0 2px rgb(255, 255, 255);
    padding: 10px 20px;
    margin: 5px 0 0 0;
    border-radius: 5px;
    transition: 0.3s ease-in-out;
}

.button-white:hover {
    background-color: #fff;
    color: #113821;
}

/*Success page*/
.success-container {
    max-width: 768px;
    margin: 0 auto;
    padding: 20px;
}

/* .logo-wrapper {
    padding: 0 0 20px 0;
    margin: 0 0 20px 0;
    text-align: center;
    position: relative;
} */

.logo-wrapper {
    padding: 0 0 20px 0;
    margin: 34px 0 20px 45px;
    text-align: center;
    position: relative;
    width: 100%;
}

.toggle-sidebar {
    position: relative;
    z-index: 50;
}

.logo-wrapper::after {
    content: "";
    background: linear-gradient(90deg, rgba(221, 229, 240, 0.00) 0%, #DDE5F0 50%, rgba(221, 229, 240, 0.00) 100%);
    width: 100%;
    height: 1px;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
}

.logo-wrapper img {
    height: 55px;
}

.success-page h1 {
    font-size: 28px;
    font-weight: 600;
    margin: 10px 0 0 0;
    text-align: center;
    color: #45AE6F;
}

.message__icon {
    display: inline-block;
}

.box_body {
    padding: 30px;
    border-radius: 20px;
    background: rgba(178, 187, 200, 0.1);
}

@media (max-width: 600px) {
    .box_body {
        padding: 10px 20px;
    }
}

.success-container .box_heading {
    text-align: center;
    padding-bottom: 30px;
}

.success-container .box_body li {
    display: flex;
    justify-content: space-between;
    padding: 15px 0;
    border-bottom: dashed 1px #b5b5b5;
    color: #59667a;
}

.success-container .box_body li:last-child {
    border-bottom: none;
}

.success-container .list_detail {
    text-align: right;
}

.page-decline h1 {
    color: #FF6B6B;
}





/* 19-08-2025 */



.custom-quote h4 {
    font-weight: 600;
    margin-bottom: 30px;
}

.custom-quote h6 {
    display: flex;
    align-items: center;
    gap: 3px;
    font-size: 13px;
}

.input--field {
    display: flex;
    flex-direction: column;
}

.input--field svg {
    width: 13px;
    height: 13px;
}



.quote-input-container {
    display: flex;
    justify-content: space-between;
}

.quot-tax-option {
    display: flex;
    justify-content: flex-end;
    margin: 30px 0;
}


.quot-tax-option .form-select {
    width: 200px;
}

.quot--table {
    width: 100%;
}

.quot--table table {
    width: 100%;
    border: solid 1px #dde5f1;
    border-collapse: collapse;
}

.quot--table table tr th {
    padding: 5px 10px;
    color: #59667a;
    background: rgb(87 98 115 / 9%);
}


.quot--table table tr td {
    padding: 5px 10px;
}


.quot--table table tr td {

    border: solid 1px #dde5f1;


}


.quot--table table tr td button {
    background: none;
    border: none;
    outline: none;
    line-height: 0;
}

.quot--table table tr td svg {
    width: 16px;
    height: 16px;
}

.quot--table table .add--row {
    color: #2871de;
    font-size: 13px;
    font-weight: 600;
}

.quot-note-section {
    margin-top: 40px;
    padding: 30px 0;
    display: flex;
    justify-content: space-between;
}


.quot-note-section textarea {
    height: 84px;
    width: 500px;
    max-width: 100%;
    resize: none;
}

@media only screen and (max-width: 1400px) {
    .quot-note-section textarea {
        height: 84px;
        width: 335px;
        max-width: 100%;
        resize: none;
    }

}

@media only screen and (max-width: 1700px) {
    .quot-note-section textarea {

        max-width: 100%;

    }
}

.quot-note-section .total-container {
    /* display: flex;
    align-items: center; */
    max-width: 400px;
    width: 100%;
}


@media only screen and (max-width: 1400px) {
    .quot-note-section textarea {

        max-width: 325px;

    }
}

.quot-note-section .total-container .total,
.quot-note-section .total-container .grand-total {
    display: flex;
    justify-content: space-between;
}


.grand-total {
    padding-top: 8px;
    margin-top: 7px;
    border-top: solid 1px #dde5f1;
}

.quot-cta {
    display: flex;
    justify-content: flex-end;
}




.recent-quot {}


.recent-quot h5 {
    font-weight: 700;
}


.recent-quot-content {
    display: none;
}

.quot-list-header {
    padding: 8px 5px 5px 5px;
    background: rgb(87 98 115 / 9%);

}

.quot-list-header label {
    margin: 0;
    padding: 5px 12px;
}

.recent-quot-toggle .item {
    margin-bottom: 7px;
}

.quot-list-text--area label {
    border-left: solid 1px #dde5f1;
}



@media only screen and (max-width: 1700px) {
    .quot-list-text--area label {
        font-size: 13px;
    }

}

.quot-list-text--area {
    display: flex;
    flex-wrap: wrap;
    width: 100%;
    justify-content: space-around;
    gap: 8px;
}


@media only screen and (max-width: 1260px) {
    .quot-list-text--area {
        flex-direction: column;
        gap: 0;
    }
}


label.history_expdate {
    min-width: 240px;
    font-weight: 500;
}

label.history_id {
    min-width: 100px;
    font-weight: 500;
}

label.history_gtotal {
    min-width: 240px;
    font-weight: 500;
}

label.history_senton {
    min-width: 240px;
    font-weight: 500;
}



@media only screen and (max-width: 1400px) {
    label.history_expdate {
        min-width: 188px;
    }

    label.history_gtotal {
        min-width: 171px;
    }

    label.history_id {
        min-width: 82px;
    }

    label.history_expdate {
        min-width: 188px;

    }

    .boxx__items {
        padding: 17px 9px;
    }

}

.recent-quot-toggle .item .quot-list-header {
    display: flex;
    justify-content: space-between;

}

.quot-list-cta {
    display: flex;
    align-items: center;
    gap: 8px;
}

.quot-list-cta button {
    border: none;
    outline: none;
    background: none;
    line-height: 0;
    transition: all 0.2s ease-in-out;

}

.quot-list-cta button svg {
    width: 17px;
    height: 17px;
    line-height: 0;
    color: #59667a;
}


.quot-list-cta .quote-open.active {
    transform: rotate(180deg);
}


.recent-quot-toggle .recent-quot-content {
    padding: 5px 12px;
    background: #fff;

}

.recent-quot-toggle .recent-quot-content .quot-note-section .quot-note {
    width: 400px;
}

.quot-list-footer {
    display: flex;
    gap: 10px;
    justify-content: space-between;
    padding-top: 15px;
    padding-bottom: 10px;
    border-top: solid 1px #dde5f1;
}



.quot-list-footer label,
.quot-list-footer span {
    display: flex;
    align-items: center;
    gap: 6px;
    margin: 0;
    padding: 5px 12px;
    font-size: 13px;
}

.quot-list-footer label svg,
.quot-list-footer span svg {
    width: 13px;
    height: 13px;
}

.quot-list-footer .respond {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    width: 28px;
    height: 28px;
    border-radius: 100%;


}


.quot-list-footer .respond.yes {
    background: rgb(50, 201, 36);
}


.quot-list-footer .respond.no {
    background: rgb(201, 36, 36);
}

.quot-list-footer .respond svg {
    font-weight: 600;
    color: #fff;
    width: 21px;
    height: 21px;

}


.quot-list-buttons {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    padding: 20px 0 17px 0;
    border-top: solid 1px #dde5f1;
}

.quot-list-buttons button {
    display: flex;
    align-items: center;
    gap: 5px;
}

.quot-list-buttons button svg {
    width: 16px;
    height: 16px;
}


.custom--error {
    text-align: center;
    padding: 16px;
    border: solid 1px #ff6b6b;
    background-color: #f79f9f;
    border-radius: 8px;
}


.custom--error p {
    font-size: 16px;
    font-weight: 500;
    line-height: 110%;
}




.custom--calendar {
    display: flex;
    justify-content: flex-end;
    align-items: flex-end;
    flex-direction: column;
    width: 100%;

}


.custom--calendar .custom--calendar-area {
    width: 100%;
    max-width: 100%;
    border: solid 1px #dde5f1;
}

.custom--calendar-heading {
    margin-bottom: 10px;
}

.custom--calendar-heading,
.custom--calender-dates {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    align-items: center;
    font-size: 12px;
    font-weight: 600;
    color: #59667a;
    border-bottom: solid 1px #dde5f1;

}

.calender-dropdown {
    background: #fff;
    padding: 9px;
}

.custom--calendar-title,
.dates {
    display: flex;
    width: 100%;
    text-align: center;
    justify-content: center;
    align-items: center;
    height: 50px;
}

.dates {
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    position: relative;
}

.date-info {
    position: absolute;
    bottom: 2px;
    right: 8px;
}


/* .date-info .infos {
    width: 200px;
    padding: 6px;
    border-radius: 5px;
    background: #fff;
    border: #e3e3e3 solid 1px;
    top: 6px;
    left: 6px;
    position: absolute;
    text-align: left;
    z-index: 50;
}

.date-info .infos label {
    margin: 0;
}

.date-info svg {
    height: 16px;
    width: 16px;
    color: #c70808c2;
} */

.date-info section {
    display: flex;
}

.dates:hover {
    background: #fff;
}




.dates.available {
    background: #48ff683d;
}

.dates.not-available {
    background: #ff48483d;
}

.calender-dropdown {
    display: flex;
    justify-content: flex-end;
    gap: 9px;

}

.calender-dropdown .form-select {
    width: 130px;
}

.custom--calendar-heading {
    background: rgb(87 98 115 / 9%);
}


.calender-note {
    display: flex;
    align-self: start;

    padding: 15px;
}

.calender-note label {
    display: flex;
    align-items: center;
    gap: 5px;
    margin: 0;
}


.calender-note label span {
    display: inline-block;
    width: 17px;
    height: 17px;
    background: #ff48483d;

}

.quot-note-section .total-container .total,

.quot-note-section .total-container .grand-total {
    margin: 0 0 5px 0;
}





.quot-note-section .total-container .total input,
.quot-note-section .total-container .grand-total input {
    background: #fff;
    border: none !important;
    outline: none !important;
    box-shadow: none !important;
    text-align: right;
    background: #f5f7fb;
}

.quot-note-section .total-container label {
    background: #f5f7fb;
    width: 210px;
}


#quoteHistory .quot-note-section .total-container label {
    background: #ffffff;
}

.total label:nth-of-type(2) {
    text-align: right;

}



.addrowow__button {
    margin-top: 15px;
}

.addrowow__button .add--row {
    color: #2871de;
    font-size: 13px;
    font-weight: 600;
    border: none;
    background: none;
}


div#send--quote--message .alert {
    margin-bottom: 15px;
}

div#history_alerts .alert {
    margin-bottom: 15px;

}



.custom-form-field-assign-engineer {
    display: flex;
    align-items: center;
}

.custom-form-field-assign-engineer .form-label {
    margin: 0;
    width: 180px;
}

.timeslots label {
    font-size: 13px;
    color: #59667a;
    margin: 0;
    cursor: pointer;
    line-height: 21px;
}

.timeslots {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
}

.timeslots>div {
    width: 186px;
    margin: 0 !important;
    padding: 0;
}

.timeslots>div label {
    text-align: center;
    width: 100%;
    padding: 8px 0;
    background-color: #f3f3f3;
    border: 1px solid #e3e3e3;
    border-radius: 8px;
}



.slot__section .form-check {
    padding: 0;
}

.slot__section .form-check .form-check-input {
    display: none;
}

.slot__section .form-check:has(input:checked) label {
    background-color: #0d47a1;
    color: white;
    border-color: #083983;
    cursor: pointer;
}





.timeslots .not--available input[type="checkbox"] {
    pointer-events: none;
    opacity: 0.3;
    cursor: not-allowed;
}

.timeslots .not--available label {
    pointer-events: none;
    opacity: 0.3;
    cursor: not-allowed;
    word-break: keep-all;
}

.timeslots .not--available {
    cursor: not-allowed;
}


/* #slot--section {
    margin-top: 16px;
    padding: 16px;
    border: solid 1px #dde5f1;
} */


.calender--events {
    padding: 16px;
    background: #fff;
    border: solid 1px #dde5f1;

}

.calender--events .client-details-area {
    flex-direction: column;
}


.calender--events .client-details-area .name--details {
    margin-left: 0;
    margin: 0 0 16px 0;
}

.calender--events .client-details-area .name--details .calender--events-field {
    margin: 0;
}

.calender--events .client-details-area {
    gap: 4px;
}






.calender--events-heading {
    /* text-align: center; */
}


.calender--events-field {
    color: #59667a;
    margin-bottom: 12px;
}


@media only screen and (max-width: 991px) {
    .calender--events-field {
        flex-direction: column;

    }
}


.calender--events-field label {
    font-size: 14px;
    display: flex;
    align-items: center;
    gap: 4px;
    color: #59667a;
    line-height: normal;
}

.calender--events-field label svg {
    width: 16px;
    height: 16px;
}

.calender--events-field span {
    display: block;
    font-size: 13px;
    font-weight: 500;
    color: #6d7b91;
    line-height: 20px;
}

.calender--events-field span a {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 14px;
    font-weight: 500;
    color: #6d7b91;
}

.calender--events-field span a svg {
    width: 16px;
    height: 16px;

}


.client-details-area {
    display: flex;
    gap: 16px;
}

@media only screen and (max-width: 991px) {
    .client-details-area {
        flex-direction: column;
    }
}

.client-details-area .address--area {
    width: 60%;
}

.client-details-area .name--details {
    width: auto;
    margin-left: auto;
    /* min-width: 230px; */
}

@media only screen and (max-width: 991px) {
    .client-details-area .name--details {
        margin-left: 0;
    }
}

.calender--events-item {
    padding: 16px;
    border: solid 1px #dde5f1;
    border-radius: 4px;
    margin-bottom: 10px;
}


.calender--assigned-engineer {
    margin-bottom: 12px;
    background-color: #f3f3f3;
    border: 1px solid #e3e3e3;
    padding: 8px 20px;
    border-radius: 8px;
}

.calender--assigned-engineer span {
    font-weight: 400;

}

.calender--assigned-engineer .title {
    /* font-weight: 600; */
    font-size: 15px;
}

.calender--assigned-engineer section {
    line-height: normal;
}

.calender--assigned-engineer section p {
    line-height: normal;
    margin: 0;
}


.calender--assigned-engineer .name {
    font-weight: 600;
    font-size: 14px;
    margin: 0 0 4px 0;
}

.calender--assigned-engineer .name .total {
    /* font-weight: 700; */

}

.calender--assigned-engineer .time {
    font-weight: 400;
    font-size: 12px;
    font-style: italic;
}



.engineer-scheduled-area {
    background-color: #fff;
    border: 1px solid #e3e3e3;
    padding: 16px;
    border-radius: 8px;
    margin: 16px 0;
}

.engineer-scheduled-details .calender--events-field label {
    margin: 0;
    line-height: normal;
    flex-shrink: 0;
    align-self: flex-start;
}


.engineer-scheduled-details .calender--events-field {
    display: flex;
    align-items: center;
    gap: 8px;
}


.engineer-scheduled-details .calender--events-field.name {
    width: 370px;
}

.engineer-scheduled-details {
    display: flex;

}

@media only screen and (max-width: 991px) {
    .engineer-scheduled-details {
        flex-direction: column;
        align-items: flex-start;

    }

    .engineer-scheduled-details .calender--events-field {
        align-items: flex-start;
    }
}


.no-document-generated,
.no-comments-genetated,
.no-message {
    display: flex;
    align-items: center;
    justify-content: center;
    align-items: center;
}

.no-document-generated,
.document-generated,
.comments-genetated,
.no-comments-genetated,
.no-message {

    margin-bottom: 12px;
    background-color: #f3f3f3;
    border: 1px solid #e3e3e3;
    padding: 10px 20px;
    margin: 15px 0;
    border-radius: 8px;
    font-weight: 600;
}

.document-generated {
    display: flex;
    align-items: center;
}

.document-generated .document-name {
    display: flex;
    align-items: center;
    gap: 16px;
    font-size: 14px;
    font-weight: 600;
    width: 360px;
}


.document-generated button {
    display: flex;
    align-items: center;

    gap: 4px;
    border: none;
    outline: none;
    border-radius: 100%;
    font-weight: 500;
    color: #fff;
    background: #0d47a1;
    flex-shrink: 0;
}

.document-generated button svg {
    width: 14px;
    color: #fff;
    font-weight: 600;

}

.document-generated .create-date {
    display: flex;
    align-items: center;
    gap: 8px;
    color: #6d7b91;
    margin-left: auto;
    font-size: 13px;
}


.comments-genetated p {
    font-size: 14px;
    font-weight: 400;
    padding-left: 12px;
    margin: 0 0 12px 0;
    position: relative;

}

.comments-genetated p:after {
    content: '';
    top: 8px;
    left: 0;
    width: 6px;
    height: 6px;
    background: #0d47a1;
    border-radius: 100%;
    position: absolute;
}

.comments-genetated p .date {
    display: block;
    font-size: 12px;
    color: #6c6c6c;
    line-height: normal;
}


.new--comments {}


.new--comments textarea {
    width: 100%;
    padding: 6px;
    height: 80px;
    resize: none;
    border: none;
    border: 1px solid #e3e3e3;
    border-radius: 4px;
}

.new--comments-cta {
    display: flex;
    justify-content: flex-end;
    margin: 18px 0 0 0;
}






.engineer-scheduled-area .job__date {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 6px;
    margin: 21px 0 16px 0;
    padding: 15px 0;
    background: #dadcff;
    border-radius: 6px;
}

.engineer-scheduled-area .job__date h3 {
    font-size: 17px;
    font-weight: 500;
    margin: 0;
    line-height: 18px
}

.engineer-scheduled-area .job__date svg {
    width: 16px;
    height: 16px
}

.engineer__job {
    border: 1px solid #e3e3e3;
    padding: 16px;
    border-radius: 4px;
    margin: 0 0 32px 0;
    position: relative;
}

button.trash-engineer__job {
    top: 8px;
    right: 8px;
    position: absolute;
    border: none;
    background: none;
    padding: 0;
}


button.trash-engineer__job svg {
    width: 18px;
    color: #6a6a6a;
}


button.trash-engineer__job:hover svg {
    color: red;
}


.job_note {
    margin: 16px 0 0 0;
}



.calender--assigned-engineer svg {
    display: inline-block;
    width: 14px !important;
    height: 14px;
    vertical-align: middle;
}


.calender--assigned-engineer time {
    display: inline-block;
    width: 17px !important;
}


div#map {
    border-radius: 8px;
}

div#map {
    border-radius: 14px;
    border: solid #fff 5px;
}



#ajax-content h4 {
    font-weight: 600;
    font-size: 20px;
}


@media (max-width: 1600px) {
    #ajax-content h4 {
        font-size: 18px;
    }
}





span.custom--label {
    color: #6583b1;
}

.jobs--required-list li {
    color: #59667a;
}

.custom--comment-list {
    margin: 0 0 0 10px;
}

.custom--comment-list li {
    position: relative;
    padding: 0 0 0 13px;
    margin-bottom: 5px;
    color: #6583b1;
    font-weight: 500;
}


.custom--comment-list li:after {
    content: '';
    position: absolute;
    top: 8px;
    left: 0;
    width: 6px;
    height: 6px;
    background: #6583b1;
    border-radius: 100%;
}

.map--button {
    height: 38px;
    display: flex;
    align-items: center;
    /* height: 50px; */
}

.map--button svg {
    height: 15px;
    line-height: 0;
    padding: 0 6px 0 0;
    flex-shrink: 0;
}


.jobdone-items-container {
    padding: 12px;
    border-radius: 5px;
    border: #d7d7d7 solid 1px;
}

.jobdone-items {
    padding: 12px;
    background: #fff;
    border-radius: 5px;
    border: #d7d7d7 solid 1px;
}

.jobdone-items:not(:last-of-type) {
    margin-bottom: 8px;
}

.jobdone-heading {
    background: rgb(162, 190, 233);
    margin-bottom: 8px;
}

.jobdone-items-container .document-generated {
    flex-direction: column;
    align-items: flex-start;
}

.jobdone-items-container .document-generated {
    flex-direction: column;
    align-items: flex-start;
    margin-top: 5px;
}

.jobdone-items-container .document-generated .create-date {
    justify-content: space-between;
    margin: 0;
    width: 100%;
}

.jobdone-items-container .download__document {
    border-radius: 5px;
}



.details--page-heading {
    font-size: 17px;
    text-align: center;
    font-weight: 700;
    border-radius: 5px 5px 0 0;
    margin-top: 15px;
    padding: 5px 5px 3px 5px;


}


.details--page-content {
    padding: 0 10px;
    background: #fff;
    border-bottom: #dedede solid 1px;
    border-left: #dedede solid 1px;
    border-right: #dedede solid 1px;
    border-radius: 0 0 5px 5px;
}

/* d */
.details--page-heading.d {
    background: rgb(219, 219, 219);
}

/*s */
.details--page-heading.s {
    background: #f89c51;
    color: #773803;
}


/*a */
.details--page-heading.a {
    background: #AFE1AF;
    color: rgb(3, 46, 46);
}

/*p */
.details--page-heading.p {
    background: #7e89fc;
    color: #040945;
}


/*v */
.details--page-heading.v {
    background: #fc7e7e;
    color: #5b0404;
}



.page-details-table-area {
    border: #dedede solid 1px;
    border-radius: 5px;
    background: #fff;
    position: relative;
}

.xeroInvoice {
    position: absolute;
    top: 2px;
    right: 7px;
}

a.xeroInvoice svg {
    width: 16px;
}





.page-details-table-area .quot-note-section {
    margin-top: 0px;
    justify-content: flex-end;
}

.page-details-table-area .quot-note-section .total {
    background: #fff;
}

.page-details-table-area .quot-note-section .total-container label {
    background: none;
}

.page-details-table-area .quot-note-section .total-container .grand-total {
    border-bottom: #dedede solid 1px;
}

.history--note-container {

    padding: 0;
}


.history--note-container .quot--table {
    background: #fff;
    max-height: 350px;
    overflow: auto;
}

.history--note-container .quot-note-section {
    margin: 0;
    flex-direction: column;
    gap: 12px;
    padding-bottom: 0;
}

.history--note-container .cta {
    display: flex;
    justify-content: flex-end;

}



.history--note-container .quot-note-section .input--field {
    width: 100%;
    margin-bottom: 15px;
}

.history--note-container .quot-note-section textarea {
    width: 100%;
    max-width: 100%;
}


.details--table-area .quot--table .details--page-heading {
    display: inline-block;
    font-size: 12px;
    font-weight: 600;
    border-radius: 30px;
    padding: 3px 12px;
    margin: 6px 0;
    width: auto;
}

.custom-pagination {
    margin: 30px 0;
}

.custom-pagination ul {
    display: flex;
    justify-content: flex-end;
    gap: 6px;
}


.custom-pagination ul li button {
    display: block;
    padding: 5px;
    min-width: 30px;
    border: 5px;
    background: rgba(84, 147, 241, 0.345);
    font-weight: 500;
    border-radius: 6px;


}

.custom-pagination ul li button.active,
.custom-pagination ul li button:hover {
    background: #0d47a1;
    color: #fff;
}


.quot-note-section .total-container label {
    background: none;
}


/* 05-11-2025 */
.invoiceListing .item {
    position: relative;
    overflow: hidden;
}


.invoiceListing .quot-list-text--area {
    gap: 0;
}



.invoiceListing .quot-list-text--area .statuslabel {
    position: absolute;
    top: 1px;
    left: 0;
    padding: 0;
}


.invoiceListing .quot-list-text--area .statuslabel .details--page-heading {
    font-size: 11px;
    text-align: center;
    font-weight: 500;
    border-radius: 5px 0 0 0;
    /* margin-top: 35px; */
    padding: 4px 5px 2px 5px;
}


.invoiceListing .quot-list-header {
    padding: 22px 5px 15px 5px;
}




.invoiceListing label.history_expdate {
    min-width: 177px;
    font-weight: 500;
}


.invoiceListing label.history_gtotal {
    min-width: 180px;
    font-weight: 500;
}

.invoiceListing label.history_senton {
    min-width: 180px;
    font-weight: 500;
}

.invoiceListing .quot-list-header label {
    margin: 0;
    padding: 5px 5px;
}

.invoiceListing .quot-list-cta svg {
    width: 17px;
}

.invoiceListing .quot-list-cta a {
    line-height: 0;
}

.refreshButtondiv {
    margin: 20px 0;
    display: flex;
    justify-content: flex-end;
}

.refreshButtondiv .refreshButton svg {
    color: #0b5ed7;
}

.refreshButtondiv .refreshButton {
    background: none;
    border: none;

}

.invoiceListing .quot-note-section {
    justify-content: flex-end;
}

@media only screen and (max-width: 1380px) {
    .invoiceListing label.history_gtotal {
        min-width: 163px;
    }

    .invoiceListing label.history_senton {
        min-width: 163px;
    }


}


/* loader */
/* div#loading-image-invoice {
    margin: 0 0 14px 0;
    text-align: center;
    display: none;
}

div#loading-image-invoice img {
    width: 50px;
} */

div.loadingImageSection {
    margin: 0 0 14px 0;
    text-align: center;
    display: none;
}

div.loadingImageSection img {
    width: 50px;
}

.page-main-header .nav-right .nav-menus li {
    flex-shrink: 0;
}

.page-main-header .nav-right .nav-menus li.xeroConnection {
    flex-shrink: 1;
    width: 100%;
    margin: 0;
    box-shadow: none;
    outline: none;
    border: none;
    background: none !important;
}

.xero--logo--connected {
    width: 53px;
    margin-left: auto;
}

.xero--logo--connected img {
    width: 100%;
}


.xero--notconnected {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    background: linear-gradient(135deg, #ff416c, #ff4b2b);
    border-radius: 8px;
    height: 39px;
    gap: 7px;
}

.xero--notconnected p,
.xero--notconnected a {
    color: #fff;
    font-weight: 600;
    font-size: 15px;
    line-height: normal;
    margin: 0;
}

.xero--notconnected svg {
    color: #fff !important;
    stroke: #fff;
}


.xero--notconnected a {
    text-decoration: underline;
}

tr.noInvoices td {
    text-align: center;
}

div#headingStatus {
    padding: 0;
}


.jobdone-items-container {
    margin-bottom: 15px;
    height: 100%;
    background: #fff;
}

.col-12.col-md-6 {
    margin: 0 0 15px 0;
}



#jobsCompleted .completedjobsdocs {
    max-height: 253px;
    overflow: auto;
    margin: 0 0 10px 0;
}


.completedjobscomments .custom--comment-list {
    max-height: 212px;
    overflow: auto;
    margin-top: 5px;
}



h5.quoteformheading {
    text-align: center;
    margin: 1px 0 20px 0;
    font-weight: 400;
    font-size: 18px;
}

.addl___info {
    flex-shrink: 0;
    margin: 0 20px;
    font-size: 11px;
    background-color: #cde9ff;
    padding: 5px 10px;
    border-radius: 7px;
}


span.package_expired {
    background: #ffcccc;
    color: #f31919;
    padding: 4px 8px;
    border-radius: 6px;
    font-size: 13px;
}


span.package_not_expired {
    background: #b0fdba;
    color: #158b08;
    padding: 4px 8px;
    border-radius: 6px;
    font-size: 13px;
}

span.doc__nature {
    background: #b6ddff;
    color: #0958ad;
    padding: 2px 8px;
    border-radius: 6px;
    font-size: 12px;
}



/* 12-08-2026 */
@media screen and (max-width: 991px) {
    .d-lg-none.mobile-toggle.pull-right.w-auto {
        position: absolute;
        right: 0;
        margin: 6px 0 0 0;
    }

    .main-header-right.row.m-0 {
        width: 100%;
    }

    .main-header-left {
        width: 100% !important;
    }

    .logo-wrapper {
        width: auto !important;
        margin-left: 0;
    }

    .page-main-header .main-header-right .toggle-sidebar {
        margin: 0 30px 0 0;
    }

    .page-wrapper .page-main-header .main-header-right .nav-right>ul {
        top: 84px !important;
    }
}


@media screen and (max-width: 545px) {
    .page-wrapper .page-main-header .main-header-right .nav-right>ul {
        flex-direction: column;
        padding: 25px 15px !important;
    }

    ul.nav-menus.open {

        background: #fff !important;
    }



    .xeroConnection>div {
        flex-direction: column;
        height: auto;
        padding: 15px;
    }

    .page-wrapper .page-main-header .main-header-right .nav-right>ul {
        top: 195px !important;
        background: #fff;
    }

    .page-main-header .nav-right .nav-menus li.xeroConnection {
        background: #fff !important;
    }
}


@media screen and (max-width: 991px) {
    .footer {
        margin-left: 0;
    }
}

.page-wrapper .page-main-header .main-header-right a.text-dark {
    display: none !important;
}