@import url('https://fonts.googleapis.com/css2?family=Inter:wght@100;200;300;400;500;600;700;800;900&family=Manrope:wght@200;300;400;500;600;700;800&display=swap');

:root {
    --text-color: #3E4265;
    --white-color: #fff;
    --black-color: #000;
    --black2-color: #131022;
    --primary-color: #27AA9F;
    --primary-hover-color: #17665f;
    --primary-light-color: #27AA9F12;
    --secondary-color: #3D53A2;
    --secondary-hover-color: rgb(64, 89, 177);
    --natural-600-color: #9397AD;
    --light-color: #EEEEEE;
    --danger-color: #F04438;
    --success-color: #3BB77E;
    --warning-color: #F79009;
}

body {
    font-family: 'Inter', sans-serif;    
}

/* Common CSS */
img {
    max-width: 100%;
}

.h1,
.h2,
.h3,
.h4,
.h5,
.h6,
h1,
h2,
h3,
h4,
h5,
h6 {
    font-weight: 700;
    font-family: 'Inter', sans-serif;
}

/*Button CSS*/
.btn {
    outline: 0 !important;
    box-shadow: none !important;
    font-size: 14px;
    display: flex;
    align-items: center;
    text-align: center;
    justify-content: center;
}

.btn:not(.btn-sm) {
    padding: 7px 13px;
}

.btn-primary {
    background-color:#9798c6;
    border: 1px solid var(--primary-color);
    color: var(--white-color);
}

.btn-primary:hover,
.btn-primary:focus {
    background-color:#9798c6 !important;
    /* border: 1px solid var(--primary-hover-color); */
    color: var(--white-color);
}

.btn-primary-outline {
    background-color: var(--white-color);
    border: 1px solid rgba(39, 170, 159, 0.35);
    color: var(--primary-color);
}

.btn-primary-outline img {
    margin-right: 5px;
    filter: brightness(0) saturate(100%) invert(55%) sepia(48%) saturate(654%) hue-rotate(126deg) brightness(94%) contrast(82%);
    width: 16px;
    height: 16px;
}

.btn-primary-outline:hover,
.btn-primary-outline:focus {
    background-color: var(--light-color);
    border: 1px solid rgba(39, 170, 159, 0.35);
    color: var(--primary-color);
}


.btn-secondary {
    background-color: var(--secondary-color);
    border: 1px solid var(--secondary-color);
    color: var(--white-color);
}

.btn-secondary:hover,
.btn-secondary:focus {
    background-color: var(--secondary-hover-color);
    border: 1px solid var(--secondary-hover-color);
    color: var(--white-color);
}


.btn-yellow {
    background-color: var(--warning-color);
    border: 1px solid var(--warning-color);
    color: var(--white-color);
}

.btn-yellow:hover,
.btn-yellow:focus {
    background-color: #d47b07;
    border: 1px solid #d47b07;
    color: var(--white-color);
}



.btn-light-primary {
    background-color: var(--primary-light-color);
    border: 1px solid var(--primary-light-color);
    color: var(--primary-color);
}

.btn-light-primary:hover,
.btn-light-primary:focus {
    background-color: var(--primary-color);
    border: 1px solid var(--primary-color);
    color: var(--white-color);
}

.btn-light {
    background-color: var(--light-color);
    border: 1px solid var(--light-color);
    color: var(--black2-color);
}

.btn-white-primary {
    background-color: var(--white-color);
    border: 1px solid #27AA9F33;
    color: var(--primary-color);
}

.btn-white-primary:hover,
.btn-white-primary:focus {
    background-color: var(--primary-color);
    border: 1px solid var(--primary-color);
    color: var(--white-color);
}

/* Text CSS */
.text-primary {
    color: var(--primary-color) !important;
}

.text-danger {
    color: var(--danger-color) !important;
}

/* Form Control CSS */
.form-group {
    margin-bottom: 12px;
}

.form-group label,
.form-group .control-label {
    margin-bottom: 5px;
    color: #585C7B;
    font-size: 14px;
    font-weight: 500;
}

.form-group .required-asterisk {
    color: var(--danger-color);
}

.form-group .form-control {
    outline: 0;
    box-shadow: none;
    border-radius: 7px;
    border: 1px solid #E2E5F1;
    background: #FFF;
    padding: 8px 17px;
    color: #9397AD;
    font-family: 'Inter';
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
}

.form-group .form-control:hover,
.form-group .form-control:focus {
    border: 1px solid var(--primary-color);
}

.form-group .form-check .form-check-label {
    color: #585C7B;
    font-size: 14px;
}

.form-group-icon-start,
.form-group-icon-end {
    position: relative;
}

.form-group-icon-start .control-icon,
.form-group-icon-end .control-icon {
    color: #667085;
    font-size: 20px;
    position: absolute;
    top: 0px;
    bottom: 0;
    display: flex;
    align-items: center;
}

.form-group-icon-start .control-icon {
    left: 12px;
}

.form-group-icon-start .form-control {
    padding-left: 40px;
}

.form-group-icon-end .control-icon {
    right: 12px;
}

.form-group-icon-end .form-control {
    padding-right: 40px;
}

.form-group-password {
    position: relative;
}

.form-group-password .form-control {
    padding-right: 40px;
}

.form-group-password .btn-password {
    background-color: initial;
    border: 0;
    color: #667085;
    padding: 0;
    position: absolute;
    right: 20px;
    top: 0;
    bottom: 0;
}

.form-group-password .btn-password:hover {
    color: var(--primary-color)
}

.theme-forms select {
    -webkit-appearance: auto !important;
    padding-right: unset !important;
}



/* Status */
.status {
    background-color: var(--primary-color);
    color: var(--white-color);
    font-size: 13px;
    padding: 3px 9px;
    border-radius: 40px;
    margin-right: 3px;
    width: fit-content;
    block-size: fit-content;
}

.status.status-light-warning {
    background-color: #F7900912;
    color: #F79009;
}

.status.status-light-success {
    background-color: #12B76A12;
    color: #12B76A;
}

.status.status-danger {
    background-color: rgba(240, 68, 56, 0.07);
    color: #F04438;
}

.status.status-info {
    background-color: #F3F6FF;
    color: #3E4265;
}

.status.status-in-progress {
    background-color: rgba(11, 165, 236, 0.10);
    color: #0BA5EC;
}

/* Page Header */
.page-header {
    padding: 10px;
}

.page-header .page-header-left h4 {
    margin-bottom: 0;
    font-size: 18px;
}

.page-header-title h4 {
    margin-bottom: 0;
    font-size: 18px;
}

/* Modal */
.theme-modal .modal-content {
    border: 0;
    border-radius: 10px;
}

.theme-modal .modal-header {
    border-bottom: 0;
    padding: 20px 20px 0 20px;
    display: flex !important;
}

.theme-modal .modal-header .modal-title {
    font-size: 16px;
}

.theme-modal .modal-header .close {
    padding: 0;
    margin: 0;
    color: #667085;
    opacity: 1;
    outline: none;
    position: absolute;
    right: 20px;
    z-index: 22;
}

.theme-modal .modal-header .close:hover {
    color: var(--primary-color);
}

.theme-modal .modal-body {
    padding: 20px;
}

.theme-modal .modal-button {
    margin-top: 20px;
}

/* Theme CSS */
.table-theme {
    background-color: var(--white-color);
}

.table-theme thead th,
.table-theme thead td,
.table-theme body th,
.table-theme tbody td {
    padding: 10px;
    font-size: 14px;
    line-height: normal;
    vertical-align: middle;
}

.table-theme td .tbl-action-group .btn-action {
    padding-right: 10px;
    display: block;
}

.table-theme td .tbl-action-group .btn-action:last-child {
    padding-right: 0px;
}

.table-theme td .tbl-action-group i {
    font-size: 14px;
    line-height: normal;
    color: #667085;
}

.table-theme thead th,
.table-theme thead td {
    background-color: #9798c696;
    color: #3E4265;
    font-weight: 600;
    border: 0;
    border-bottom-width: 0;
}

.table-theme thead th:first-child {
    border-radius: 10px 0 0 10px;
}

.table-theme thead th:last-child {
    border-radius: 0 10px 10px 0;
}

.table-theme .inner-table-container thead th:first-child, .table-theme .inner-table-container thead th:last-child{
    border-radius: 0;
}

.table-theme tbody td {
    color: #585C7B;

}

.table-theme .tbl-action {
    width: 50px;
}

.table-theme .tbl-action-group {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
}

.table-theme .tbl-action-group .btn {
    padding: 0;
    border: 0;
    color: #585C7B;
}

.table-theme tbody tr:nth-child(1) td {
    border-top: 0;
}

.table-theme tbody tr:hover td {
    background-color: #9798c62b;
}

/* Dropdown CSS */
.dropdown-menu {
    box-shadow: 0px 10px 20px 0px #455A641A;
    padding: 8px;
    border: 1px solid #E2E5F1;
}

.dropdown-menu .dropdown-item {
    padding: 6px 8px;
    border-radius: 4px;
    font-size: 14px;
}

.dropdown-menu .dropdown-item img {
    margin-right: 10px;
}

.dropdown-menu .dropdown-item:hover {
    background-color: #F3FBFA;
    color: var(--primary-color);
}

.dropdown-toggle::after {
    display: none;
}

/* Authentication  */
.auth-header {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 25px;
    z-index: 9;
    background-color: transparent;
}

.auth-header .header-logo img {
    height: 50px
}

.auth-header .header-button {
    display: flex;
    align-items: center;
}

.auth-header .header-button p {
    margin-bottom: 0;
    margin-right: 15px;
}

.authentication {
    margin-top: 0px;
}

.authentication .auth-outer {
    display: flex;
    flex-direction: row;
    min-height: calc(100vh - 0px);

}

.authentication .auth-left {
    flex: 0 0 50%;
    max-width: 50%;
    background-color: #F0F9F8;
    padding: 110px 40px 40px 40px;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
}

.authentication .auth-right {
    flex: 0 0 50%;
    max-width: 50%;
    padding: 100px 50px 30px 50px;
    display: flex;
    align-items: center;
    position: relative;
    background-color: var(--white-color);
}

.authentication .auth-right .auth-forms-outer {
    width: 100%;
}

.authentication .auth-card {
    width: 100%;
    margin: 0 auto;
}

.authentication .auth-card .auth-titlebar {
    margin-bottom: 24px;
}

.authentication .auth-card .auth-titlebar h4 {
    font-size: 24px;
    color: #131022;
    margin-bottom: 3px;
}

.authentication .auth-card .auth-titlebar p {
    color: #3E4265;
    margin-bottom: 0;
}

.authentication .auth-card .btn {
    width: 100%;
    padding: 8px 16px;
}

.authentication .auth-forms .form-group .form-control {
    height: 42px;
}

.auth-card #ForgotPassword {
    margin-bottom: 0;
    margin-top: 15px;
}

.auth-card #ForgotPassword a {
    font-weight: 500;
    color: var(--primary-color);
}


.auth-card #SignUpForm_SignUpForm_Password_Holder {
    margin: 0 -15px;
    display: flex;
    flex-direction: row;
}



.auth-card #SignUpForm_SignUpForm_Surname_Holder,
.auth-card #SignUpForm_SignUpForm_FirstName_Holder {
    width: 100% !important;
}

.auth-card .fieldgroup-field,
.auth-card .fieldgroup-field {
    flex: 0 0 50%;
    max-width: 50%;
    padding: 0 15px;
}

.auth-card .middleColumn.fieldgroup {
    margin-left: -15px;
    margin-right: -15px;
}


.auth-card #Password_Password_Holder,
.auth-card #Password_ConfirmPassword_Holder {
    flex: 0 0 50%;
    max-width: 50%;
    padding: 0 15px;
}

.auth-card #SignUpForm_SignUpForm_Password_Holder>label {
    display: none;
}

/* Dashboard CSS */
.card-address-outer {
    background-color: #FAFBFC;
    border-radius: 8px;
    padding: 10px;
    margin-bottom: 20px;
}

.card-box-header {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    margin-top: 10px;
    margin-bottom: 10px;
}

.card-box-header .card-box-title {
    color: var(--natural-600-color);
    font-size: 14px;
    text-transform: uppercase;
    margin-bottom: 0;
    font-weight: 500;
}

.card-address {
    border: 0;
    margin-bottom: 12px;
}

.card-address:nth-last-child(1) {
    margin-bottom: 0;
}

.card-address .card-header {
    border-bottom: 0;
    background-color: transparent;
    padding: 10px 10px;
    display: flex;
    flex-direction: row;
    align-items: center;
    padding-right: 19px;
}

.card-address .card-header h4 {
    margin: 0;
    font-size: 16px;
    color: #131022;
    margin-right: 10px;
}

.card-address .card-body {
    padding: 0 12px 12px;
}

.card-address .card-body .address-details {
    font-size: 14px;
    color: #585C7B;
}

.card-address .card-body .address-details {
    margin-bottom: 5px;
}

.card-address .card-body .address-details:nth-last-child(1) {
    margin-bottom: 0;
}

.card-address .card-body .address-details label {
    margin-bottom: 0;
    color: #9397AD;
    margin-right: 3px;
}

.card-address .card-body .address-details span {
    color: #3E4265;
    font-weight: 500;
}

.card-address .status-box {
    display: flex;
}

.card-address .address-status {
    background-color: var(--primary-color);
    color: var(--white-color);
    font-size: 13px;
    padding: 3px 9px;
    border-radius: 40px;
    margin-right: 3px;

}

.card-address .address-status.status-billing {
    background-color: var(--primary-color);
    color: var(--white-color);
}

.card-address .address-status.status-shipping {
    background-color: var(--secondary-color);
    color: var(--white-color);
}

.card-address .dropdown {
    position: absolute;
    right: 5px;
    top: 10px;
}

.card-address .dropdown .dropdown-toggle {
    padding: 0;
    position: absolute;
    right: 0;
    top: 0;
}

.card-address .dropdown-menu {
    box-shadow: 0px 10px 20px 0px #455A641A;
    padding: 8px;
    border: 1px solid #E2E5F1;
}

.card-address .dropdown-menu .dropdown-item {
    padding: 6px 8px;
    border-radius: 4px;
    font-size: 14px;
}

.card-address .dropdown-menu .dropdown-item:hover {
    background-color: #F3FBFA;
    color: var(--primary-color);
}

.card-address .dropdown-toggle::after {
    display: none;
}

.row-summary {
    margin-right: -6px;
    margin-left: -6px;
}

.row-summary .col-summary {
    padding-right: 6px;
    padding-left: 6px;
}

.card-summary {
    border: 0;
    padding: 10px;
    border-radius: 8px;
    margin-bottom: 0px;
}

.card-summary:hover {
    box-shadow: 0px 20px 20px 0px #0000000A;
}

.card-summary .card-body {
    display: flex;
    flex-direction: row;
}

.card-summary .card-footer {
    border: 0;
    background-color: transparent;
}

.card-summary .card-footer .card-link {
    font-size: 14px;
}

.card-summary .card-body,
.card-summary .card-footer {
    padding: 0;
}

.card-summary .card-body .summary-number {
    font-size: 34px;
    font-weight: 600;
    margin-right: 12px;
    color: var(--primary-color);
}

.card-summary .card-body .summary-details h6 {
    margin-bottom: 0;
    font-size: 16px;
}

.card-summary .card-body .summary-details p {
    color: #9397AD;
    margin-bottom: 0;
}

.card-summary .card-footer {
    margin-top: 10px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.card-summary .card-footer span {
    background-color: #27AA9F17;
    color: var(--primary-color);
    height: 34px;
    width: 34px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
    border-radius: 50%;
}

.card-summary:hover span {
    background-color: var(--primary-color);
    color: var(--white-color);
}

.card-dashboards {
    border: 0;
    background-color: #FAFBFC;
    border-radius: 8px;
}

.card-dashboards .card-header {
    padding: 0;
    border-bottom: 0px;
    background-color: #FAFBFC;
}

.card-dashboards .nav-tab-outer .nav-tabs {
    border-bottom: 1px solid #E2E5F1;
}

.nav-tab-outer .nav-tabs .nav-link {
    padding: 7px 14px;
    background-color: transparent;
    color: #585C7B;
    border: 0;
    position: relative;
    outline: 0;
    font-size: 14px;
}

.nav-tab-outer .nav-tabs .nav-link.active::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 1px;
    background-color: var(--primary-color);
}

/* Main Header CSS */
.main-header,
.main-footer {
    display: none;
}

/* header */
.page-header-title {
    display: flex;
    align-items: center;
}


.topbar-user button {
    padding: 0px;
}


/* header */

/* tab */

.page-header-tab {
    padding-left: 13px;
}

.page-header-tab-content {
    display: flex;
    align-items: center;
    padding: 3px;
    border: 1px solid #E2E5F1;
    border-radius: 5px;
}

.page-header-tab-content .page-header-tab-pill {
    display: flex;
    padding: 8px 13px;
    justify-content: center;
    align-items: center;
    color: #585C7B;
    text-align: center;
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: 18px;
    border-radius: 5px;
}

.page-header-tab-content .page-header-tab-pill.active {
    background-color: var(--primary-color);
    color: var(--white-color);
}

.page-header-tab-content .page-header-tab-pill:hover {
    text-decoration: unset;
}

/* tab */



.card-dashboards .card-body {
    padding: 0px;
}

.fliter-dropdown {
    max-width: 214px;
    width: 100%;
}




.quote_filter {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    margin-bottom: 20px;
     padding-right: 10px;

}

.quote_filter-right-gap{
    padding-left: 15px;
}

.quote_filter .filter-search {
     width: 99%;
    margin-top: 10px  !important;
    margin-left: 2px !important;
}

.quote_filter .filter-search.quote-shorting {
    width: 20%;
}


.quote_filter form {
    display: flex;
    align-items: center;
}

.quote_filter form .form-group {
    margin-bottom: 0px;
    margin-right: 10px;
}

.quote_filter form .form-control {
    padding: 9px 12px;
    border-radius: 7px;
    background: #F6F6F6;
    border: 0px;
    color: #3E4265;
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
    height: auto;
    min-height: 37px;
    text-overflow: ellipsis;
}

.quote_filter form .form-control:focus,
.quote_filter form .form-control:hover {
    border: 0px;
}

.quote_filter form .btn {
    padding: 0px 10px;
    height: auto;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 37px;
}

.quote_filter form .btn img {
    width: 15px;
    height: 15px;
    margin-right: 0;
    min-width: 15px;
}


.quote_filter form .form-control.search {
    padding-left: 36px;
     /* max-width: 214px; */
    width: unset !important;
    width: 100% !important;
}

.input-fix,
.quote_filter form .icon-group {
    position: relative;
}


.quote_filter form .input-fix .form-control.fx-input {
    padding-left: 37px;

}

.quote_filter form .input-fix .form-control.sort-input {
    padding-left: 65px;

}

.quote_filter form .input-fix .form-control.price-input {
    padding-left: 53px;

}

.quote_filter form .icon-group img {
    position: absolute;
    left: 12px;
    top: 50%;
    transform: translateY(-50%);
    filter: brightness(0) saturate(100%) invert(44%) sepia(6%) saturate(1477%) hue-rotate(183deg) brightness(96%) contrast(86%);
    width: 17px;
    height: 17px;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center center;

}

.input-fix .input-fix-text {
    position: absolute;
    left: 12px;
    top: 50%;
    transform: translateY(-50%);
    color: rgba(62, 66, 101, 0.60);
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
    z-index: 2;
}

.control-icon i {
    font-size: 17px;
}

.quote-shorting-tab .quote-shorting-tab-content {
    display: flex;
    align-items: center;
    list-style: none;
    padding-left: 0px;
    margin-bottom: 0px;
}

.quote-shorting-tab .quote-shorting-tab-item {
    padding: 7px 10px;
    border-right: 1px solid #E2E5F1;
    background: #F6F6F6;
}

.quote-shorting-tab .quote-shorting-tab-item:last-child {
    border-right: 0px;
    border-top-right-radius: 7px;
    border-bottom-right-radius: 7px;
}

.quote-shorting-tab .quote-shorting-tab-item:first-child {
    border-top-left-radius: 7px;
    border-bottom-left-radius: 7px;
}

.quote-shorting-tab .quote-shorting-tab-item .quote-shorting-tab-link.active img {
    filter: brightness(0) saturate(100%) invert(54%) sepia(74%) saturate(401%) hue-rotate(126deg) brightness(89%) contrast(92%);
}

.quote-shorting {
    display: flex;
    align-items: center;
    justify-content: flex-end;
}

.quote-shorting .quote-shorting-tab {
    margin-right: 8px;
}


.main-custom-select select {
    -webkit-appearance: none !important;
    padding-right: 54px !important;
}

.main-custom-select {
    position: relative;
}

.main-custom-select::before {
    content: "";
    position: absolute;
    right: 12px;
    top: 50%;
    transform: translateY(-50%);
    background-image: url(/assets/images/select-arrow.svg);
    width: 15px;
    height: 15px;
}


.quote-grid-card {
    padding: 20px;
    border-radius: 8px;
    border: 1px solid #EFF2FC;
    background: #FFF;
    display: flex;
    align-items: center;
}

.quote-grid-card-deatils {
    width: 100%;
}

.quote-grid-card .quote-grid-card-title {
    display: flex;
    align-items: flex-start;
}

.quote-grid-card .quote-grid-card-title .quote-grid-card-image {
    margin-right: 11px;
}

.quote-grid-card .quote-grid-card-title .quote-grid-card-image img {
    width: 38px;
    height: 38px;
}

.quote-grid-card .quote-grid-card-title .quote-grid-card-title-text .quote-grid-card-title-text-wrapper {
    display: flex;
    align-items: center;
    margin-bottom: 7px;
}

.quote-grid-card .quote-grid-card-title .quote-grid-card-title-text h2 {
    color: #131022;
    font-size: 18px;
    font-style: normal;
    font-weight: 500;
    line-height: 160%;
    margin-bottom: 0px;
    margin-right: 9px;
}

.quote-grid-card .quote-grid-card-title .quote-grid-card-title-text .status {
    margin-right: 9px;
}


.status-default {
    background: #F3F6FF;
    color: #3E4265;
    margin-right: 0px;
}

.status-warning {
    background: rgba(247, 144, 9, 0.07);
    color: #F79009;
    margin-right: 0px;
}

.quote-grid-card .quote-grid-card-title .quote-grid-card-title-text .quote-quantity {
    color: #3E4265;
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    line-height: 160%;
    margin-bottom: 0px;
}

.quote-grid-card .quote-grid-card-title .quote-grid-card-title-text .quote-description {
    color: rgba(62, 66, 101, 0.60);
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 19.8px;
    margin-bottom: 0px;
}

.quote-grid-card .quote-grid-card-title {
    margin-bottom: 20px;
}

.quote-id-status,
.quote-id-status .quote-status-report {
    display: flex;
    align-items: center;
}

.quote-id-status .quote-id h3 {
    color: #131022;
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
    text-decoration-line: underline;
    margin-bottom: 0px;
}

.quote-id-status .quote-status-report .quote-status {
    padding: 0 18px;
    position: relative;
}

.quote-id-status .quote-status-report .quote-status::before {
    position: absolute;
    top: 50%;
    right: -7px;
    width: 16px;
    height: 1px;
    background-image: url(/assets/images/Line2.png);
    content: "";
    transform: translateY(-50%);
}

.quote-id-status .quote-status-report .quote-status:last-child {
    padding-right: 0px;
}

.quote-id-status .quote-status-report .quote-status:last-child::before {
    content: none;
}

.quote-grid-card .quote-date-image-action {
    display: flex;
    align-items: center;
    padding-right: 20px;
}

.quote-grid-card .quote-date-image-action .quote-date-image {
    padding-right: 20px;
    border-right: 1px solid #EFF2FC;
}

.quote-grid-card .quote-date-image-action .quote-date-image h6 {
    color: #3E4265;
    text-align: right;
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
    margin-bottom: 8px;
    white-space: pre;
}

.quote-grid-card .quote-date-image-action .quote-date-image .quote-grid-image img {
    width: 171px;
    height: 83px;
    border-radius: 8px;
    background-size: cover;
}

.quote-grid-card .quote-grid-action p {
    color: #9397AD;
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: 19.8px;
    margin-bottom: 5px;
    white-space: pre;
}

.quote-grid-card .quote-grid-action h4 {
    color: #3E4265;
    font-size: 23px;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
    margin-bottom: 1px;
    white-space: pre;
}

.quote-grid-card .quote-grid-action span {
    color: #585C7B;
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
    margin-bottom: 14px;
    display: block;
}

.quote-grid-card .quote-grid-action {
    padding-left: 20px;
}

.quote-grid-card .three-dotdrop-down {
    position: absolute;
    right: 11px;
    top: 8px;
}

.quote-grid-card .three-dotdrop-down .dropdown-toggle {
    padding: 0px;
}

.quote-grid-action-btn .tbl-action-group {
    display: flex;
    align-items: center;
}

.quote-grid-action-btn .tbl-action-group a {
    padding: 0px;
    margin: 0 7px;
    display: flex;
    width: 21px;
}

.quote-grid-action-btn .tbl-action-group a:first-child {
    margin-left: 0px;
}

.quote-grid-action-btn .tbl-action-group a img {
    width: 100%;
    height: 21px;
    object-fit: contain;
    object-position: center center;
}

.quote-grid-card {
    margin-bottom: 24px;
}


/* quote-show */
.page-content .content-area.content-area-quote-show {
    padding: 0px 0px;
}

.content-area-quote-show {

    border-top: 1px solid #EFF2FC;
}

.quote-show-all {
    width: 100%;
    max-width: 300px;
    height: 100%;
}

.quote-show-all .quote-show-all-header {
    padding: 8px 10px;
    border-bottom: 1px solid #EFF2FC;
}

.quote-show-all .quote-show-all-header h2 {
    color: #3E4265;
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    line-height: 160%;
    margin-bottom: 0px;
}

.quote-show-all-list .nav-tabs {
    /* height: calc(100vh - 183px);
    overflow: auto; */
}

.quote-show-all .quote-show-all-list-card {
    padding: 10px;
    border-bottom: 1px solid #EFF2FC;
}

.quote-show-all .quote-show-all-list-card .quote-show-all-list-price-title {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.quote-show-all .quote-show-all-list-card .quote-show-all-list-price-title h3 {
    color: #3E4265;
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: 160%;
    margin-bottom: 0px;
}

.quote-show-all .quote-show-all-list-card .quote-show-all-list-price-title h4 {
    color: #3E4265;
    text-align: right;
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: 160%;
    margin-bottom: 0px;
}

.quote-show-all .quote-show-all-list-card .quote-show-all-list-ref-status {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.quote-show-all .quote-show-all-list-card .quote-show-all-list-ref-status .quote-show-all-list-ref {
    display: flex;
    align-items: center;
}

.quote-show-all .quote-show-all-list-card .quote-show-all-list-ref-status .quote-show-all-list-ref span {
    display: block;
    color: #9397AD;
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 160%;
    padding: 0 7px;
    position: relative;
}

.quote-show-all .quote-show-all-list-card .quote-show-all-list-ref-status .quote-show-all-list-ref span:first-child {
    padding-left: 0px;
}

.quote-show-all .quote-show-all-list-card .quote-show-all-list-ref-status .quote-show-all-list-ref span:last-child {
    padding-right: 0px;
}

.quote-show-all .quote-show-all-list-card .quote-show-all-list-ref-status .quote-show-all-list-ref span::before {
    content: "";
    position: absolute;
    top: 50%;
    right: 0;
    transform: translateY(-50%);
    width: 1px;
    height: 100%;
    background-color: #E2E5F1;
}

.quote-show-all .quote-show-all-list-card .quote-show-all-list-ref-status .quote-show-all-list-ref span:last-child::before {
    content: none;
}

.quote-show-all-list .nav {
    border-bottom: 0;
    width: 100%;
    border-radius: 0;
}

.quote-show-all-list .nav .nav-item {
    width: 100%;
    border-radius: 0;
    border: 0;
    background-color: transparent;
}

.quote-show-all-list .nav .nav-item .nav-link {
    background-color: transparent;
    border-radius: 0;
    border: 0;
    padding: 0;
}

.quote-show-all-list .nav .nav-item .nav-link.active .quote-show-all-list-card {
    background-color: #E6F6F5;
}


.quote-show-page-row {
    display: flex;
    height: 100%;
}

.quote-show-all-data {
    width: 100%;
    height: 100%;
    border-left: 1px solid #EFF2FC;
}



.quote-show-all-header-action,
.quote-show-all-header-title,
.quote-show-all-details-header {
    display: flex;
    align-items: center;
}

.quote-show-all-details-header {
    justify-content: space-between;
    padding: 8px 13px;
}

.quote-show-all-header-title a {
    width: 32px;
    height: 32px;
    border-radius: 16px;
    border: 1px solid #EFF2FC;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-right: 10px;
}

.quote-show-all-header-title h3 {
    color: #3E4265;
    font-size: 18px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
    margin-bottom: 0px;
}

.quote-show-all-header-action .quote-show-all-header-action-icon img,
.quote-show-all-header-title .quote-show-all-header-action-icon img {
    width: 17px;
    height: 17px;
}

.quote-show-all-header-action .quote-show-all-header-action-icon:hover,
.quote-show-all-header-title .quote-show-all-header-action-icon:hover {
    background-color: var(--primary-light-color);
}

.quote-show-all-header-action .quote-show-all-header-action-icon {
    width: 32px;
    height: 32px;
    border-radius: 4px;
    border: 1px solid #EFF2FC;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-left: 10px;
    padding: 0;
}

.quote-show-collapse {
    border-bottom: 1px solid #EFF2FC;
    padding: 10px 17px;
    cursor: pointer;
}

.your-quote-card {
    margin: 25px 17px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    padding: 10px;
    border-radius: 7px;
    background: #FAFBFC;
}

.your-quote-card-image img {
    width: 85px;
    height: 85px;
    margin-bottom: 10px;
}

.your-quote-card-text p {
    text-align: center;
    color: #3E4265;
    text-align: center;
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: 23.8px;
}



.quotation {
    margin: 0 25px;
}

.quotation-row {
    display: flex;
    margin-left: -7px;
    margin-right: -7px;
}

.quotation-col {
    display: flex;
    padding-left: 7px;
    padding-right: 7px;
}

.quotation-col-table {
    width: 60%;
}

.quotation-table {
    border-radius: 8px;
    background: var(--natural-50, #FAFBFC);
    padding: 15px;
}

.quotation-table ul {
    padding: 0;
    list-style: none;
}

.quotation-table {
    width: 100%;
}

.quotation-table ul li {
    padding: 10px 0px;
    width: 100%;
    border-bottom: 1px solid rgba(200, 204, 241, 0.20);
}


.quotation-table ul li a span {
    color: #9397AD;
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    margin-bottom: 0px;
    display: block;
    width: 140px;
    margin-right: 17px;
}

.quotation-table ul li a {
    color: #3E4265;
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
    margin-bottom: 0px;
    display: flex;
    align-items: center;
}

.quotation-col-image {
    width: 40%;
}

.quotation-table-title h4 {
    color: #9397AD;
    font-size: 13px;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
    text-transform: uppercase;
    margin-bottom: 16px;
}

.quotation-image {
    width: 100%;
    height: auto;
    border-radius: 8px;
    overflow: hidden;
}

.quotation-image img {
    width: 100%;
}

.your-plan-table {
    padding: 0 15px;
    margin-bottom: 25px;
}

.btn.btn-primary img,
.btn.btn-secondary img {
    margin-right: 5px;
    filter: brightness(0) saturate(100%) invert(100%) sepia(4%) saturate(7437%) hue-rotate(211deg) brightness(105%) contrast(97%);
    width: 16px;
    height: 16px;
}

.your-plan-table-title {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 18px;
}

.your-plan-table-title h3 {
    color: var(--natural-600, #9397AD);
    font-family: Inter;
    font-size: 13px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
    text-transform: uppercase;
    margin-bottom: 0px;
}

.your-plan-btn-grp {
    display: flex;
    align-items: center;
}

.your-plan-btn-grp .btn {
    margin-left: 10px;
}

.new-notification {
    position: relative;
}

.new-notification span {
    position: absolute;
    right: -6px;
    top: -6px;
    width: 12px;
    height: 12px;
    color: #FFF;
    font-size: 10px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    background-color: var(--primary-color);
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 6px;
}

.your-plan-card {
    padding: 14px;
    border-radius: 8px;
    background: #FAFBFC;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

.your-plan-payment-row {
    display: flex;
    align-items: flex-start;
    /* margin-left: -9px;
    margin-right: -9px; */
    justify-content: space-between;
}

.your-plan-payment-col {

    padding-left: 9px;
    padding-right: 9px;
}

.paymet-address-col {
    max-width: 27%;
    width: 100%;
}

.paymet-requirement-col {
    max-width: 46%;
    width: 100%;
}

.your-plan-payment-card .your-plan-payment-card-title {
    color: #7A7B89;
    font-size: 18px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
    margin-bottom: 11px;
    border-bottom: 1px solid black;
}


.your-plan-payment-details {
    border-radius: 7px;
    border: 1px solid #EFF2FC;
    background: #FFF;
    padding-top: 10px;
    overflow: hidden;
    position: relative;
}

.your-plan-payment-details.status-paid {
    padding-top: 25px;
}


.your-plan-payment-details.status-paid .status-paid-tag {
    color: #12B76A;
    font-family: 'Inter';
    font-size: 12px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
    margin-bottom: 0px;
    position: absolute;
    text-align: center;
    transform: rotate(-45deg);
    width: 60px;
    background: #E7F8F0;
    top: 5px;
    left: -16px;
    padding: 2px 0px;
}

.your-plan-payment-details ul {
    padding: 0 20px;
    list-style: none;
    margin-bottom: 20px;


}

.your-plan-payment-details ul li {
    margin-bottom: 9px;
}

.your-plan-payment-details ul li:last-child {
    margin-bottom: 0px;
}

.your-plan-payment-details ul li a span {
    color: var(--natural-800, #3E4265);
    text-align: left;
    line-height: normal;
    font-weight: 400;
    display: block;
    padding-right: 10px;
    font-size: 14px;
}

.your-plan-payment-details ul li a {
    color: var(--natural-700, #585C7B);
    font-weight: 600;
    font-size: 12px;
    font-style: normal;
    line-height: normal;
    text-align: right;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.your-plan-payment-total {
    padding: 10px;
    background: #E6F6F5;
    min-height: 37PX;

}

.your-plan-payment-total a {
    color: #3E4265;
    font-size: 14px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.your-plan-delivery-address-details .your-plan-delivery-address-title {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
}

.your-plan-delivery-address-details .your-plan-delivery-address-title h4 {
    color: #3E4265;
    font-size: 14px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
    margin-bottom: 0px;
}

.your-plan-delivery-address-details .your-plan-delivery-address-title a {
    display: flex;
    align-items: center;
}


.your-plan-delivery-address-details .your-plan-delivery-address-title a img {
    width: 14px;
    height: 14px;
}

.your-plan-delivery-address-details .your-plan-delivery-address-title {
    margin-bottom: 5px;
}

.your-plan-delivery-address-details p {
    color: rgba(62, 66, 101, 0.55);
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 17px;
    margin-bottom: 0px;
}

textarea.form-control,
.your-plan-specific-requirement .form-control {
    border-radius: 7px;
    border: 1px solid #E2E5F1;
    background: #FFF;
    resize: none;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
}

.your-plan-delivery-address-title-card {
    border-radius: 7px;
    background: #FFF;
    padding: 25px 20px 25px 20px;
}

.custom-select-drop-down select.form-control {
    -webkit-appearance: none;
    -moz-appearance: none;
    -o-appearance: none;
    appearance: none;
}

.custom-select-drop-down select.form-control,
.your-plan-delivery-address-details-drop-down .dropdown .form-control {
    border-radius: 7px;
    border: 1px solid #E2E5F1;
    background: #FFF;
    padding: 6px 17px;
    display: flex;
    align-items: center;
    color: #9397AD;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    position: relative;
}

.your-plan-delivery-address-details-drop-down .dropdown .form-control:hover {
    color: #9397AD;
}

.custom-select-drop-down {
    position: relative;
}



.custom-select-drop-down::before,
.your-plan-delivery-address-details-drop-down .dropdown .form-control::before {
    content: "";
    position: absolute;
    right: 17px;
    top: 50%;
    transform: translateY(-50%);
    width: 17px;
    height: 17px;
    background-image: url(/assets/images/select-arrow.svg);
    z-index: 2;
}

.your-plan-delivery-address-details-drop-down .dropdown .form-control img {
    width: 17px;
    height: 17px;
    margin-right: 10px;
}


.your-plan-delivery-address-details-drop-down .dropdown-menu {
    padding: 0px;

}

.your-plan-delivery-address-details-drop-down .dropdown-menu .dropdown-address-title {
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-bottom: 1px solid #EFF2FC;
    background: #F3FBFA;
    padding: 10px;
}

.your-plan-delivery-address-details-drop-down .dropdown-menu .dropdown-address-title h6 {
    color: #000;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 20.8px;
    margin-bottom: 0px;
}

.your-plan-delivery-address-details-drop-down .dropdown-menu .dropdown-address-title .dropdown-add-new-address-title {
    color: #3E4265;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 20.8px;
    text-decoration: none;
    display: flex;
    align-items: center;
}

.your-plan-delivery-address-details-drop-down .dropdown-menu .dropdown-address-title .dropdown-add-new-address-title img {
    width: 12px;
    height: 12px;
    margin-right: 7px;
}

.your-plan-delivery-address-details-drop-down .dropdown-menu {
    max-width: 287px;
    width: 100%;
}

.your-plan-delivery-address-details-drop-down .dropdown-menu .dropdown-all-address-list .dropdown-item {
    color: #9397AD;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 20.8px;
    padding: 10px;
    display: flex;
    align-items: center;
    white-space: pre-line;
}

.quote-show-collapse-title {
    color: #3E4265;
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
    margin-bottom: 0px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.quote-show-collapse-title.collapsed img {
    width: 21px;
    height: 21px;
    transform: rotate(-90deg);
}

.quote-show-collapse-title img {
    width: 21px;
    height: 21px;
    transform: rotate(-180deg);
}

.quote-show-collapse-card {
    border: 0px;
    border-radius: 0px;
    padding: 10px 17px;
}

.quote-show-collapse-data ul {
    list-style: none;
    padding: 0;
    margin: 0px;
}

.quote-show-collapse-data ul li a {
    display: flex;
    align-items: center;
    text-decoration: none;
}

.quote-show-collapse-data ul li a .quote-show-collapse-date-time p {
    color: #9397AD;
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    margin-bottom: 0px;
    margin-right: 10px;
}

.quote-show-collapse-created-project img {
    width: 28px;
    height: 28px;
    margin-right: 8px;
}

.quote-show-collapse-created-project p {
    color: #27AA9F;
    font-size: 12px;
    font-style: normal;
    font-weight: 500;
    line-height: normal;
    margin-bottom: 0px;
}

/* quote-show */



footer {
    position: fixed;
    bottom: 0;
    right: 0;
    left: 250px;
}

.footer-wrapper {
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-top: 1px solid #EFF2FC;
    background: #FAFBFC;
    padding: 7px 25px;
}

.footer-wrapper .footer-details h6 {
    color: #3E4265;
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    line-height: 160%;
    margin-bottom: 0px;
}

.footer-contact a {
    color: #585C7B;
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 160%;
    margin-bottom: 0px;
    text-decoration: none;
}


.footer-link a {
    color: #585C7B;
    font-size: 12px;
    font-style: normal;
    font-weight: 500;
    line-height: 160%;
    text-decoration: none;
}

.btn.dropdown-toggle {
    position: relative;
}

.btn.dropdown-toggle::before {
    content: "";
    position: absolute;
    top: 50%;
    right: 10px;
    transform: translateY(-50%);
    background-image: url(/assets/images/select-arrow.svg);
    width: 16px;
    height: 16px;
    filter: brightness(0) saturate(100%) invert(100%) sepia(0%) saturate(2%) hue-rotate(309deg) brightness(112%) contrast(101%);
}

.btn.dropdown-toggle.custom-dropdown {
    padding-right: 29px;
}

.dropdown .dropdown-item .dropdown-item-icon {
    filter: brightness(0) saturate(100%) invert(7%) sepia(6%) saturate(2254%) hue-rotate(169deg) brightness(92%) contrast(81%);
}

.dropdown .dropdown-item:hover .dropdown-item-icon {
    filter: brightness(0) saturate(100%) invert(50%) sepia(92%) saturate(347%) hue-rotate(126deg) brightness(95%) contrast(88%);
}

.custom-pagination {
    position: fixed;
    bottom: 60px;
    left: 60px;
    right: 0;
    border-top: 1px solid #E1E6EF;
    background: #FFF;
    padding: 5px 17px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.custom-pagination-wrapper {
    display: flex;
    align-items: center;
}

.custom-pagination-wrapper .form-group {
    margin-bottom: 0px;
}

.custom-pagination-wrapper nav {
    margin-right: 15px;
}

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

.custom-pagination .pagination .page-item.arrow .page-link {
    border-radius: 4px;
    border: 1px solid var(--neutral-neutral-300, #E1E6EF);
    padding: 0px;
}

.custom-pagination .pagination .page-item.arrow .page-link {
    padding: 4px;
}

.custom-pagination .pagination .page-item.arrow .page-link img {
    width: 24px;
    height: 24px;
}

.custom-pagination .pagination .page-item.arrow .page-link img {
    width: 24px;
    height: 24px;
}

.custom-pagination .pagination .page-item.number {
    padding: 4px;
}

.custom-pagination .pagination .page-item.number .page-link {
    width: 24px;
    height: 24px;
    padding: 0px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 0px;
    background-color: transparent;
}


.custom-pagination .custom-pagination-page-number p {
    color: #57637D;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    letter-spacing: 0.1px;
    margin-bottom: 0px;
}



/* CHECKBOX */
.form-check {
    display: flex;
    align-items: center;
}

.form-check-input {
    appearance: none;
    width: 17px;
    height: 17px;
    border-radius: 3px;
    border: 1px solid #D4D7E5;
    cursor: pointer;
    margin-right: 10px;
}

.form-check-input:checked {
    background-color: var(--primary-color);
    border-color: var(--primary-color);
}

.form-check-label {
    font-weight: bold;
    color: #333;
    font-size: 16px;

}

.form-check-input {
    position: relative;
}


.form-check-input:checked::before {
    position: absolute;
    content: "";
    left: 5px;
    top: 2px;
    width: 5px;
    height: 10px;
    border: solid white;
    border-width: 0 2px 2px 0;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
}

/* CHECKBOX */

/* delete popup */
.delete-popup {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    text-align: center;
}

.delete-popup img {
    width: 44px;
    height: 44px;
    margin-bottom: 12px;
}

.delete-popup h3 {
    color: #3E4265;
    text-align: center;
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: 140%;
    margin-bottom: 12px;
}

.delete-popup p {
    color: #585C7B;
    text-align: center;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 160%;
    margin-bottom: 12px;
}

.delete-button {
    display: flex;
    align-items: center;
    justify-content: end;
}

/* delete popup */

.quote-form-card {
    border-radius: 8px;
    padding: 0px;
    background-color: #F7F7F7;
}

.quote-title-card {
    border-top-right-radius: 8px;
    border-top-left-radius: 8px;
    padding: 10px 17px;
    background-color: #E6F6F5;
}

.quote-inner-card {
    padding: 17px;
}


.main-delete-popup {
    max-width: 461px !important;
}


/* otp form */
.otp-container {
    display: flex;
    align-items: center;
    margin-bottom: 30px;
    gap: 10px;
    justify-content: space-between;
}

.otp-container .form-control {
    border: 1px solid #D4D7E5;
    min-height: 70px;
    width: 100%;
    min-width: 70px;
    padding: 10px;
    text-align: center;
    max-width: 70px;
    font-size: 20px;
    font-weight: 600;
    border-radius: 10px;
}

.otp-container .form-group {
    /* margin-right: 15px; */
    margin-bottom: 0px;
}


.backto-page-link img {
    margin-right: 6px;
}

.backto-page-link {
    display: flex;
    align-items: center;
    color: #585C7B;
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    line-height: 160%;
    text-decoration: unset;
    margin-top: 40px;
}

.backto-page-link:hover {
    color: #585C7B;
    text-decoration: unset;
}

/* otp form */

.address-custom-modal .row {
    margin-right: 0px;
    margin-left: 0px;
    padding-right: 0px;
    padding-left: 0px;
}

.address-custom-modal .row>.col-12 {
    width: 100%;
    max-width: 100%;
    flex: 100%;
    padding: 0;
}

.address-custom-modal .theme-forms {
    display: flex;
    align-items: center;
    margin-right: -15px;
    margin-left: -15px;
    flex-wrap: wrap;
}

.address-custom-modal .theme-forms .addNew-address-btn,
.address-custom-modal .theme-forms .edit-save-button {
    margin-left: 15px;
}

.form-check label {
    margin-bottom: 0px;
}

.form-check input {
    margin-top: 0;
}

#SignUpForm #FirstNameSurname .middleColumn {
    display: flex;
}

#Form_VerificationForm .fieldgroup-field {
    width: 100%;
    max-width: 100%;
}

/* .card-address .dropdown .dropdown-toggle::before {
    content: none;
} */

.quote_filter select {
    appearance: none;
}


#ProfileForm #FirstNameSurname .middleColumn {
    display: flex;
    width: 100%;
    margin-left: -15px;
    margin-right: -15px;
}

#ProfileForm #FirstNameSurname .middleColumn .fieldgroup-field {
    width: 100% !important;
}

#ProfileForm #FirstNameSurname .middleColumn .fieldgroup-field {
    padding-left: 15px;
    padding-right: 15px;
}

#ProfileForm #FirstNameSurname .middleColumn .fieldholder-small {
    width: 100% !important;
}


.form-group.readonly {
    display: flex;
    flex-direction: column;
}

.form-group.readonly .readonly {
    display: block;
    width: 100%;
    height: calc(1.5em + 0.75rem + 2px);
    padding: 0.375rem 0.75rem;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    color: #495057;
    background-color: #ebebeb;
    background-clip: padding-box;
    border: 1px solid #ced4da;
    border-radius: 0.25rem;

}

.alert .alert-inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    max-height: 25vh;
    overflow-y: scroll;
    line-break: anywhere;
    width: max-content;
    max-width: 104%;
}



.alert-success-icon {
    padding: 4px;
    border-radius: 14px;
    border: 1px solid #BEE5C8;
    background: #EBF7EE;
    box-shadow: 0px 20px 30px 0px rgba(0, 0, 0, 0.22);
}

.alert-success-icon .close-image {
    width: 28px;
    min-width: 28px;
    height: 28px;
}

.alert-success-icon .success-image {
    border-radius: 12px;
    background: var(--system-success, #12B76A);
    padding: 10px;
    margin-right: 10px;
}

.alert-success-icon p {
    margin-bottom: 0px;
    color: #131022;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
}

.alert-success-icon p {
    margin-bottom: 0px;
    color: #131022;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
}





.alert-danger-icon {
    padding: 4px;
    border-radius: 14px;
    border: 1px solid #F5C5BB;
    background: #FCEDEA;
    box-shadow: 0px 20px 30px 0px rgba(0, 0, 0, 0.22);
}

.alert-danger-icon .close-image {
    width: 28px;
    min-width: 28px;
    height: 28px;
}

.alert-danger-icon .danger-image {
    border-radius: 12px;
    background: #F04438;
    padding: 10px;
    margin-right: 10px;
}

.alert-danger-icon p {
    margin-bottom: 0px;
    color: #131022;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
}

.alert-danger-icon p {
    margin-bottom: 0px;
    color: #131022;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
}



.alert-warning-icon {
    padding: 4px;
    border-radius: 14px;
    border: 1px solid #FADEAF;
    background: #FEF7EA;
    box-shadow: 0px 20px 30px 0px rgba(0, 0, 0, 0.22);
}

.alert-warning-icon .close-image {
    width: 28px;
    min-width: 28px;
    height: 28px;
}

.alert-warning-icon .warning-image {
    border-radius: 12px;
    background: #F79009;
    padding: 10px;
    margin-right: 10px;
}

.alert-warning-icon p {
    margin-bottom: 0px;
    color: #131022;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
}

.alert-warning-icon p {
    margin-bottom: 0px;
    color: #131022;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
}

.alert-info-icon {
    padding: 4px;
    border-radius: 14px;
    border: 1px solid #B4D2F3;
    background: #E5EFFA;
    box-shadow: 0px 20px 30px 0px rgba(0, 0, 0, 0.22);
}



.alert-info-icon .close-image {
    width: 28px;
    min-width: 28px;
    height: 28px;
}

.alert-info-icon .info-image {
    border-radius: 12px;
    background: #0BA5EC;
    padding: 10px;
    margin-right: 10px;
}

.alert-info-icon p {
    margin-bottom: 0px;
    color: #131022;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
}

.alert-info-icon p {
    margin-bottom: 0px;
    color: #131022;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
}


.alert .close {
    outline: navajowhite;
}

.alert-top-center {
    position: fixed;
    z-index: 1050;
    left: 0;
    right: 0;
    top: 5%;
    max-width: 500px;
    margin: 0 auto;
}




/* search form  */


.quote_filter form .theme-forms {
    display: flex;
    align-items: flex-start;
    width: 90%;
    flex-wrap: wrap;
}

.quote_filter form .theme-forms .form-group {
    margin-bottom: 10px;
}

.quote_filter form .form-group label,
.quote_filter form .field.dropdown label,
.quote_filter form .field.text label {
    display: none;

}

.quote_filter form .field.dropdown,
.quote_filter form .field.text {
    margin-bottom: 0px;
    margin-right: 10px;
}

/* search form  */


.quote-inner-card .theme-forms {
    display: flex;
    flex-wrap: wrap;
    margin-left: -15px;
    margin-right: -15px;
}


.quote-inner-card .form-edit-btn {
    margin-left: 15px;
    margin-right: 15px;
    margin-top: 10px;
}


.fiter-dropdown {
    max-width: 214px;
    width: 100%;
}



.filter-search .theme-forms {
    width: 100% !important;
}


.filter-search .theme-forms .fx-input {
    max-width: 120px !important;
}

.filter-search .theme-forms .date {
    max-width: 150px !important;
}

.filter-search .theme-forms .Customer {
    max-width: 150px !important;
}

.filter-search .theme-forms .fiter-dropdown {
    max-width: 70px !important;
}



.quote-edit-modal-form .quote-edit .quote-title-card {
    padding: 10px 0px;
    background-color: transparent;
}

.quote-edit-modal-form .quote-edit .quote-form-card {
    border-radius: 0px;
    padding: 0px;
    background-color: transparent;
}

.quote-edit-modal-form .quote-edit .quote-form-card .quote-inner-card .theme-forms {
    display: flex;
    flex-wrap: wrap;
    margin-left: -0;
    margin-right: -0;
}

.quote-edit-modal-form .quote-edit .quote-form-card .quote-inner-card {
    padding: 0px !important;
}

.quote-edit-modal-form .quote-edit .quote-form-card .quote-inner-card .theme-forms .form-group {
    padding-left: 10px !important;
    padding-right: 10px !important;
}



.dropdown-menu {
    width: max-content;
}

.dropdown-menu .dropdown-item:hover img {
    filter: brightness(0) saturate(100%) invert(50%) sepia(82%) saturate(392%) hue-rotate(126deg) brightness(96%) contrast(85%);
}


.quote-show-all-status {
    margin-left: 10px;
}

.your-plan-delivery-address-title-card ul {
    margin: 0;
    padding: 0px;
    list-style: none;
}



.your-plan-delivery-address-title-card ul li {
    color: var(--natural-700, #585C7B);
    font-weight: 600;
    font-size: 12px;
    font-style: normal;
    line-height: normal;
    text-align: right;
    display: flex;
    align-items: center;
    margin-top: 5px;
    color: #3E4265;
    margin-bottom: 9px;
}

.your-plan-delivery-address-title-card ul li span {
    font-weight: 400;
    margin-right: 5px;
    color: #9397AD;
    font-size: 14px;
}

.sample-row .paymet-address-col {
    max-width: 33.33%;
    width: 100%;
}


.sample-despatched,
.payment-received,
.sample-approved {
    display: flex;
    padding: 7px;
    width: 100%;
    margin-bottom: 16px;
}

.sample-despatched-img,
.payment-received-img,
.sample-approved-img {
    margin-right: 5px;
}

.sample-despatched-img img,
.payment-received-img img,
.sample-approved-img img {
    width: 24px;
    min-width: 24px;
    height: 24px;
}

.sample-despatched-text h6,
.payment-received-text h6,
.sample-approved-text h6 {
    color: #27AA9F;
    font-family: 'Inter';
    font-size: 14px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
    margin-bottom: 4px;
}

.sample-despatched-text,
.payment-received-text,
.sample-approved-text {
    margin-right: 5px;
}

.payment-pending-btn,
.sample-despatched-btn {
    display: flex;
    align-items: center;
}

.payment-pending-btn .btn,
.sample-despatched-btn .btn {
    margin-right: 5px;
}

.sample-despatched-btn .btn,
.payment-received-btn .btn,
.sample-approved-btn .btn {
    white-space: nowrap;
}

.sample-despatched-text p,
.payment-received-text p,
.sample-approved-text p {
    color: #9397AD;
    font-family: Inter;
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 20.4px;
    margin-bottom: 0px;
}

.sample-despatched-wrapper,
.payment-received-wrapper,
.sample-approved-wrapper {
    display: flex;
    align-items: center;
    width: 100%;
    justify-content: space-between;
}


/* .page-content.no-pagenation  {
    height: calc(100vh - 142px);
}

.page-content.no-pagenation .quote-show-all-data {
    height: calc(100vh - 142px);
    overflow: auto;
} */




.page-content.no-pagenation .content-area {
    height: calc(100vh - 141px);
    overflow-y: auto;
}

.page-content.no-pagenation .content-area .quote-show-all {
    height: calc(100vh - 145px);
    overflow-y: auto;
}

.page-content.no-pagenation .content-area .quote-show-all-data {
    height: calc(100vh - 145px);
    overflow-y: auto;
}









.tbl-sorting {
    cursor: pointer;
    padding-right: 20px;
    position: relative;
}

.tbl-sorting::after,
.tbl-sorting::before {
    content: '';
    position: absolute;
    right: 5px;
    font-size: 10px;
    color: #98a2b3;
    opacity: 0.4;
    line-height: 8px;
    font-family: bootstrap-icons;
}

.tbl-sorting::before {
    content: '\F235';
    bottom: 50%;
}

.tbl-sorting::after {
    content: '\F229';
    top: 50%;
}

.tbl-sorting.sorting-asc::before {
    opacity: 1;
}

.tbl-sorting.sorting-desc::after {
    opacity: 1;
}


.sample-form-wrapper {
    padding: 21px 25px;
}

.span-none .required-asterisk {
    display: none;
}

.lable-none label {
    display: none;
}

.from-title {
    color: var(--natural-800, #3E4265);
    font-family: Inter;
    font-size: 14px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
    margin-bottom: 12px;
    padding-left: 10px;
    padding-right: 10px;

}

.form-normal-text {
    color: #3E4265;
    font-family: 'Inter';
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 15.6px;
    margin-bottom: 12px;
}


.sample-form-card .theme-forms {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    margin-left: -10px;
    margin-right: -10px;
}

.sample-form-card .address-btn {
    padding-left: 10px;
    padding-right: 10px;
}

.sample-form-card .theme-forms .form-group {
    padding-left: 10px;
    padding-right: 10px;
}

.theme-forms .btn {
    font-size: 16px;
    margin-bottom: 12px;
}

.sample-total-card {
    padding-left: 10px;
    padding-right: 10px;
}

.sample-total-card>.fieldgroup {
    padding-left: 0;
    padding-right: 0;
    padding-top: 10px;
    padding-bottom: 0px;
    border-radius: 7px;
    border: 1px solid #EFF2FC;
    background: #FFF;
}

.sample-total-card .fieldholder-small {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 10px;
    margin-bottom: 10px;
}

.sample-total-card .fieldholder-small label {
    color: #585C7B;
    font-family: 'Inter';
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    margin-bottom: 0px;
}

.sample-total-card .fieldholder-small span {
    color: #3E4265;
    text-align: right;
    font-family: 'Inter';
    font-size: 12px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
}

.sample-total-inner-data .fieldholder-small {
    margin-bottom: 0px;
    padding: 10px;
    background-color: #E6F6F5;
}

.sample-total-inner-data .fieldholder-small span,
.sample-total-inner-data .fieldholder-small label {
    color: #3E4265;
    font-family: 'Inter';
    font-size: 14px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
}

.sample-form-card .theme-forms .action {
    margin-left: 10px;
}

.smaple-card-image {
    border-radius: 8px;
    background: var(--natural-50, #FAFBFC);
    height: 428px;
}

.smaple-card-image {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
}


.quote_filter .order-jr{
    position: relative;
}
.quote_filter .common-from-input-width{
  width: 12%;
}
.quote_filter .order-jr span{
    position: absolute;
    left: 12px;
    top: 50%;
    transform: translateY(-50%);
}
.quote_filter .order-jr input{
    padding-left: 36px;
}

.quotation-col-table form{
    width: 100%;
}

.main-nav {
    background-color: #fff0 !important;
}
.file-label {
    margin-bottom: 0 !important;
}

/* Responsive CSS */
/* @media screen and (max-width: 992px) {
    .main-content{
        padding-left: 20% !important;
    }
} */
@media screen and (min-width: 992px) {
    .modal-md {
        max-width: 580px;
    }
    /* .main-content{
        padding-left: 20% !important;
    } */
}

@media screen and (min-width: 1300px) {

    .navbar-menu {
        width: 220px;
    }
    /* .main-content{
        padding-left: 12% !important;
    } */
    .authentication .auth-card {
        width: 500px;
        margin: 0 auto;
    }
}

@media screen and (min-width: 1600px) {
    .card-address-outer {
        padding: 15px;
    }
}

.handover-submit-btn {
    bottom: 10px;
    right: 25px;
}







/* Orders */



.custom-content-align {
        padding-left: 2.6rem !important;
        margin-left: 2rem !important;
}

 .delivery-details, .jrc-details {
    margin-top: 10px;
    padding: 10px;
    background-color: #f8f9fa;
    border-radius: 4px;
    position: absolute;
    z-index: 1000;
    min-width: 300px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.15);
    right: 6%;
  }
  .delivery-details{
    right: 4%;
  }
  
  .delivery-details table, .jrc-details table {
    margin-bottom: 0;
  }
  
  .delivery-toggle, .jrc-toggle {
    cursor: pointer;
    text-decoration: none;
    color: #0d6efd;
  }
  
  .delivery-toggle:hover, .jrc-toggle:hover {
    text-decoration: underline;
  }
    .main-content {
    margin-left: 250px;
  }


  /* handover  */

  .custom-margin-handhover-align{
        padding-left: .5rem !important;
            margin-left: 1rem !important;
  }

.custom-padding{
  padding-left:50px !important;
}
.content-area{
  padding:0px !important;
  padding-right: 15px !important;
}
.list-custom-css{
  padding-right:0px !important;
}
/* Table header and data alignment */
.table-theme thead th {
  text-align: center;
  vertical-align: middle;
  padding: 1rem 0.5rem;
}
.table-theme tbody td {
  text-align: center;
  vertical-align: middle;
  padding: 0.75rem 0.5rem;
}
/* Grid-based action button layout */
.tbl-action-group {
  display: grid;
  grid-auto-flow: row;
  gap: 0.75rem;
  width: 100%;
}
.tbl-action-group .btn {
  border: 1px solid #ddd;
  border-radius: 4px;
  padding: 0.4rem 0.5rem;
  font-size: 0.9rem;
  transition: all 0.2s ease;
}
.tbl-action-group .btn:hover {
  border-color: #999;
}
.gap-3 {
  gap: 0.75rem !important;
}

.row{
  margin-right:0px !important;
}



/* handhover viewsection */


  #layout-wrapper {
    overflow-x: hidden;
    max-width: 100%;
  }
  .layout-wrapper {
    overflow-x: hidden;
    max-width: 100%;
  }
  .main-content {
    overflow-x: hidden;
    max-width: 100%;
    width: 100%;
  }
  .page-content {
    overflow-x: hidden;
    max-width: 100%;
    width: 100%;
    box-sizing: border-box;
  }
  .content-area {
    overflow-x: hidden;
    max-width: 100%;
  }
  .quote-show-page {
    overflow-x: hidden;
    max-width: 100%;
  }
  .record-custom-padding{
    padding-right:0px !important;
    padding-left:10px !important;
  }
  .quote-show-all-data {
    overflow-x: hidden;
    max-width: 100%;
  }
  .inner-table-container {
    overflow-x: auto;
    max-width: 100%;
  }
  table.table-theme {
    width: 100%;
  }
  .pl-7{
    padding-left: 2rem !important;
  }
.custom-margin-20 {
  margin-top: 20px;
}

.custom-margin-10 {
  margin-top:10px;
}


.button-flex {
    display: flex !important;
    gap: 20px;
  
}

.custom-top-bottom{
    padding-top: 20px;
    padding-bottom: 20px;
    padding-right: 20px;
}

.button-align {
    display: flex;
    gap: 10px;
}

.card-align{
      margin-left: 30px;
    margin-top: 20px;
}

.button-width{
    width: 150px;
}






/* menubar mediaquery  */

@media only screen and (min-width: 320px) and (max-width: 767px) {
   

.breadcrumb-nav{
width: auto;
border-top:none;
}
   
    .app-menu { 
        height: auto !important;
    }

    .mobile-responsive-title {
        font-size: 16px ;
        margin: 0px;
    }

        .navbar-header {
        /* padding: 0 calc(4.5rem * .5) 0 calc(8.5rem * .5) !important; */
        padding-left: 70px !important;
    padding-right: 10px !important;
    }

    .navbar-header {
        align-items: center !important;
    }

    .page-header-button{
        font-size: 10px;
    }

    .content-areas{
        padding-right: 20px !important;
    }

    .quote_filter form .form-group{
  margin-right: 0px !important;
}

.custom-pagination{
    bottom:50px !important;
}

.quote_filter {
    padding-right: 0px  ;
}

}


@media only screen and (min-width: 768px) and (max-width: 1023px)  {
    .quote_filter form .form-group{
  margin-right: 0px !important;
}

.breadcrumb-nav{
width: auto;
border-top:none;
}

.custom-pagination{
    bottom:50px !important;
}

.quote_filter {
    padding-right: 0px  ;
}
}