html {
    font-size: 14px;
}

@media (min-width: 768px) {
    html {
        font-size: 16px;
    }
}

html {
    position: relative;
    min-height: 100%;
}

/*body {
  margin-bottom: 60px;
}
*/
#global-load {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(255, 255, 255, 0.7); /* semi-transparent white */
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 9999; /* Ensure it's above other elements */
}
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}


.spinner-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    background-color: rgba(255, 255, 255, 0.1);
    backdrop-filter: blur(5px);
    -webkit-backdrop-filter: blur(5px);
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 2;
    display: none;
}
.spinner-overlay1 {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 2;
}


.spinner1 {
    width: 50px;
    height: 50px;
    border-radius: 50%;
    background: conic-gradient(#3a6ceb 0deg 180deg, #e3bdbd 180deg 360deg);
    animation: rotate 1s linear infinite;
    mask: radial-gradient(farthest-side, transparent calc(100% - 7px), black calc(100% - 15px));
}
.spinner2 {
    width: 50px;
    height: 50px;
    border-radius: 50%;
    background: conic-gradient(#3a6ceb 0deg 180deg, #e3bdbd 180deg 360deg);
    animation: rotate 0.50s linear infinite;
    mask: radial-gradient(farthest-side, transparent calc(100% - 7px), black calc(100% - 15px));
}
@keyframes rotate {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}
@keyframes slide {
    0% {
        transform: translateX(-25%);
    }

    100% {
        transform: translateX(25%);
    }
}

.mud-wasm {
    animation: slide 3s ease-in-out infinite alternate;
    background-image: linear-gradient(-60deg,#1E88E5 50%,#0069c0 50%);
    bottom: 0;
    left: -50%;
    opacity: .5;
    position: fixed;
    right: -50%;
    top: 0;
    z-index: -1
}

.mud-wasm-cont {
    left: 50%;
    padding: 10vmin;
    position: fixed;
    text-align: center;
    top: 50%;
    transform: translate(-50%,-50%);
    z-index: 1; /* Ensure logo appears above background */
}

@keyframes slide {
    0% {
        transform: translateX(-25%);
    }

    100% {
        transform: translateX(25%);
    }
}

.mud-wasm {
    animation: slide 3s ease-in-out infinite alternate;
    background-image: linear-gradient(-60deg,#1E88E5 50%,#0069c0 50%);
    bottom: 0;
    left: -50%;
    opacity: .5;
    position: fixed;
    right: -50%;
    top: 0;
    z-index: -1
}

@media print {
    body {
        margin: 0;
        padding: 0;
        justify-content: center;
        height: auto; /* Use auto height */
    }

    #print_form, #print_form * {
        visibility: visible; /* Show only the print form and its children */
    }

    #print_form {
        width: 100%; /* Full width */
        max-width: 800px; /* Limit maximum width */
        padding: 20px; /* Add some padding */
        box-sizing: border-box; /* Ensure padding is included in width */
    }

    /* Optional: Add more specific styles to improve print layout */
    #print_form {
        page-break-after: always; /* Prevent page breaks within the form */
    }

    /* Adjust any specific element styles for better print output */
    .form-control {
        border: none; /* Remove borders for a cleaner look */
        background: transparent; /* Ensure background is clear */
    }
}


.mud-wasm-cont {
    left: 50%;
    padding: 10vmin;
    position: fixed;
    text-align: center;
    top: 50%;
    transform: translate(-50%,-50%);
    z-index: 1; /* Ensure logo appears above background */
}
/* Custom tooltip */
.custom-tooltip .tooltip-inner {
    --bs-tooltip-bg: yellow;
    --bs-tooltip-color: red;
}

/* Danger tooltip */
.custom-tooltip-danger .tooltip-inner {
    background-color: #dc3545 !important;
    color: #fff !important;
}

/* Info tooltip */
.custom-tooltip-info .tooltip-inner {
    background-color: #17a2b8 !important;
    color: #fff !important;
}

/* Success tooltip */
.custom-tooltip-success .tooltip-inner {
    background-color: #28a745 !important;
    color: #fff !important;
}

/* Primary tooltip */
.custom-tooltip-primary .tooltip-inner {
    background-color: #007bff !important;
    color: #fff !important;
}

.astrisk {
    color: #dc3545;
}



.btn-active {
    background-color: #007bff;
    color: white;
}

#listContent {
    display: none;
}


.popover.clockpicker-popover.bottom.clockpicker-align-right {
    z-index: 1000000;
}

.popover.clockpicker-popover.bottom.clockpicker-align-left {
    z-index: 1000000;
}

span.clockpicker-am-pm-block {
    display: none;
}

div#ui-datepicker-div {
    z-index: 1000000 !important;
}

.toast {
    position: relative;
    /* Add any additional styling for the toast */
}

.toast-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0.5rem 1rem;
    background-color: #f8f9fa;
    border-bottom: 1px solid #e9ecef;
    border-top-left-radius: 0.25rem;
    border-top-right-radius: 0.25rem;
}

.close {
    position: absolute;
    top: 0.25rem;
    right: 0.25rem;
    padding: 0.5rem;
    background: none;
    border: none;
    font-size: 1.25rem;
    color: #000;
    cursor: pointer;
}

    .close:hover {
        color: #dc3545;
    }

.toast-body {
    padding: 1rem;
}

.offcanvas.offcanvas-end {
    z-index: 999999;
}





.autocomplete {
    position: relative;
    width: 100%;
    border: 1px solid #bfbfbf;
    border-radius: 5px;
}

    .autocomplete.valid.modified {
        outline: none !important;
        border: 1px solid #26b050;
    }

    .autocomplete.invalid {
        outline: none !important;
        border: 1px solid red;
    }

.autocomplete__controls {
    position: relative;
    cursor: text;
    display: flex;
}

.autocomplete__input {
    /*flex: 1;*/
    max-width: 100%;
    border: none;
    padding: .5rem;
    border-radius: 5px;
}

.autocomplete:focus-within {
    box-shadow: 0 0 0 0.2rem rgba(38,143,255,.5);
}

.autocomplete__input:focus {
    outline: none;
}

.autocomplete__input-multi:focus {
    outline: none;
    box-shadow: none;
}

.autocomplete__input-hidden {
    display: none;
}

.invalid {
    border-color: red !important;
}


.autocomplete__input-mask-wrapper {
    display: flex;
    width: 100%;
}

.autocomplete__input-multiselect-wrapper {
    display: flex;
    flex-direction: row;
    width: 100%;
    flex-wrap: wrap;
    max-height: 70px;
    overflow-y: auto;
}

.autocomplete__input-mask-wrapper--disabled {
    background-color: #e9ecef;
    cursor: not-allowed;
    border-radius: 5px 0 0 5px;
    color: grey;
    min-height: 40px;
}

    .autocomplete__input-mask-wrapper--disabled:focus {
        border: none;
    }

.autocomplete__input-mask {
    display: flex;
    align-items: center;
    flex: 1;
    border-radius: 5px 0 0 5px;
    padding: .5rem;
}

    .autocomplete__input-mask:focus {
        outline: none;
    }

.autocomplete__clear {
    width: 40px;
    display: flex;
    padding: .5rem;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: #dbdbdb;
}

    .autocomplete__clear:hover {
        color: #333333;
    }

.autocomplete__down-arrow path {
    fill: #424242;
}

.autocomplete__input-icon {
    width: 20px;
    display: flex;
    border-radius: 0 5px 5px 0;
    padding: .5rem;
    cursor: pointer;
    background: none;
}

    .autocomplete__input-icon:focus {
        outline: none;
        box-shadow: 0 0 0 0.2rem rgba(38,143,255,.5);
    }

    .autocomplete__input-icon:hover {
        background-color: #f5f5f5;
    }

        .autocomplete__input-icon:hover .autocomplete__down-arrow path {
            fill: #333333;
        }

.autocomplete__input-icon--disabled,
.autocomplete__input-icon--disabled:hover {
    background-color: #e9ecef;
    cursor: not-allowed;
}

    .autocomplete__input-icon--disabled .autocomplete__down-arrow path,
    .autocomplete__input-icon--disabled:hover .autocomplete__down-arrow path {
        fill: #9c9c9c;
    }

.autocomplete__multi-value {
    background-color: #dbdbdb;
    display: flex;
    align-items: center;
    min-width: 0px;
    box-sizing: border-box;
    border-radius: 2px;
    margin: .4rem 0 .4rem .4rem;
}

.autocomplete__multi-value-label {
    color: rgb(51, 51, 51);
    font-size: 85%;
    text-overflow: ellipsis;
    white-space: nowrap;
    box-sizing: border-box;
    border-radius: 2px;
    overflow: hidden;
    padding: 3px 3px 3px 6px;
}

.autocomplete__multi-value-clear {
    -webkit-box-align: center;
    align-items: center;
    display: flex;
    padding-left: 4px;
    padding-right: 4px;
    box-sizing: border-box;
    border-radius: 2px;
    background-color: transparent;
    border: 0;
    outline: none;
}

    .autocomplete__multi-value-clear:focus {
        outline: none;
    }

    .autocomplete__multi-value-clear:hover {
        background-color: rgb(212, 212, 212);
        color: rgb(222, 53, 11);
    }

.autocomplete__results {
    position: absolute;
    box-shadow: 0 5px 10px rgba(0,0,0,.2);
    border: 1px solid #dbdbdb;
    min-height: 2rem;
    max-height: 12rem;
    overflow-y: auto;
    z-index: 10;
    width: 100%;
    background: #fff;
}

.autocomplete__result,
.autocomplete__notfound,
.autocomplete__results-help-template,
.autocomplete__results-header,
.autocomplete__results-footer {
    padding: .5rem;
    border-top: 1px solid #fff;
    border-bottom: 1px solid #fff;
    text-align: start;
}

.autocomplete__selected-item {
    background-color: #dbdbdb;
}

.autocomplete__selected-item-highlighted {
    background-color: #d3e2f2;
}

.autocomplete__active-item,
.autocomplete__result:hover,
.autocomplete__result:focus {
    background-color: #007bff;
    border-top: 1px solid #007bff;
    border-bottom: 1px solid #007bff;
    color: #fff;
    cursor: pointer;
}

.autocomplete__loader {
    width: 24px;
    height: 24px;
    background-color: #333;
    border-radius: 100%;
    -webkit-animation: sk-scaleout 1.0s infinite ease-in-out;
    animation: sk-scaleout 1.0s infinite ease-in-out;
}

@-webkit-keyframes sk-scaleout {
    0% {
        -webkit-transform: scale(0)
    }

    100% {
        -webkit-transform: scale(1.0);
        opacity: 0;
    }
}

@keyframes sk-scaleout {
    0% {
        -webkit-transform: scale(0);
        transform: scale(0);
    }

    100% {
        -webkit-transform: scale(1.0);
        transform: scale(1.0);
        opacity: 0;
    }
}

.sticky-left tbody tr th:first-child {
    min-width: 110px;
    white-space: nowrap;
    padding-left: 5px;
    padding-right: 5px;
    font-weight: 600;
    position: sticky;
    left: -1px;
    z-index: 999;
    background: #f9f9f9;
}

.sticky-left thead tr th:first-child {
    min-width: 110px;
    white-space: nowrap;
    padding-left: 5px;
    padding-right: 5px;
    font-weight: 600;
    position: sticky;
    left: -1px;
    z-index: 9999;
    background: #f9f9f9;
}

.sticky__table table th:first-child {
    left: -1px !important;
}

.sticky__table thead th {
    position: sticky;
    top: -2px;
    z-index: 9;
}

.sticky__table {
    max-height: 500px;
    position: relative;
}

.app-sidebar {
    /*z-index: 9999;*/
    z-index: 1030;
}

.login_right input:autofill {
    box-shadow: inset 0 41px 2px #303846;
}

.badge-count {
    position: absolute;
    top: -5px;
    right: -4px;
    background-color: red;
    color: white;
    border-radius: 50%;
    padding: 0px 4px;
    font-size: 10px;
}

.SelectBox {
    padding: 0 !important;
}

.editable_box .form-control {
    padding: 1px 8px;
    line-height: normal;
    height: inherit;
}

.editable_box {
    align-items: center;
}

    .editable_box .action_btns {
        display: flex;
    }

.main-profile-cover .profile_pic i, .email_edit i {
    cursor: pointer;
}

.main-profile-cover .profile_pic {
    background: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer
}

    .main-profile-cover .profile_pic i {
        border: 1px solid var(--default-border);
    }

.award-image:hover .awards-trash .close__icon {
    position: absolute;
    top: -6px;
    right: -6px;
    background-color: #ff0000;
    color: #fff;
    border-radius: 50%;
    padding: 0px 4px;
    font-size: 10px;
    border: 1px solid #ddd;
    display: block;
    z-index: 9;
    cursor: pointer;
}

.award-image .awards-trash .close__icon {
    display: none;
}

.employee-card .card-header .card-title {
    margin-bottom: 0;
    text-decoration: underline;
    color: var(--primary-bg-color);
}

.upwork-filter .selectbox .validation-message {
    font-size: 12px;
    position: absolute;
}
/* For WebKit browsers (Chrome, Safari) */
input[type="month"]::-webkit-clear-button {
    display: none;
}

/* For Firefox */
input[type="month"]::-moz-clear {
    display: none;
}
/* For WebKit browsers (Chrome, Safari) */
input[type="date"]::-webkit-clear-button {
    display: none;
}

/* For Firefox */
input[type="date"]::-moz-clear {
    display: none;
}

/* For Edge */
input[type="date"]::-ms-clear {
    display: none;
}

.present.user_statusbox.d-flex {
    background: #fff;
    border-bottom-color: #ccc;
}


.leave_row.user_statusbox.d-flex {
    background: #d2fadf;
    border-color: #f8e8c6;
    color: green !important;
    border-bottom-color: green;
}

.halfday_row.user_statusbox.d-flex {
    background: #f8e8c6 !important;
    border-color: #f8e8c6;
    color: #ad780b !important;
    border-bottom-color: #ad780b;
}

.halfDayLeave_row.user_statusbox.d-flex {
    color: #1170e4 !important;
    background: #d0e2f7 !important;
    border-bottom-color: #1170e4 !important;
}

.absent_row.user_statusbox.d-flex {
    background: #f8ccd3 !important;
    border-color: #f8ccd3;
    color: #f5334f !important;
    border-bottom-color: #f5334f !important;
}


.user-gap {
    margin-bottom: 20px; /* Adjust this value as needed */
    border-top: 1px solid #e3e3e3; /* Optional: adds a line between user sections */
}

.user_statusbox {
    margin-bottom: 10px; /* Adjust the spacing between checkbox and name row and the table */
}

.access-denied-page {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100vh;
    background-color: #f8f9fa;
}

.access-denied-content {
    text-align: center;
    background-color: white;
    padding: 40px;
    border-radius: 8px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}

    .access-denied-content h1 {
        font-size: 3rem;
        margin-bottom: 20px;
        color: #dc3545; /* Red color */
    }

    .access-denied-content p {
        font-size: 1.2rem;
        margin-bottom: 30px;
        color: #6c757d; /* Gray color */
    }

.btn {
    text-decoration: none;
    padding: 10px 20px;
    font-size: 1rem;
    border-radius: 5px;
}

.btn-primary {
    background-color: #007bff;
    color: white;
}

    .btn-primary:hover {
        background-color: #0056b3;
    }

.offcanvas-footer.text-right {
    justify-content: flex-end;
}

.top_card .validation-message {
    position: absolute;
    border: 0;
    font-size: 14px;
}

/*CkEditor*/
.ck-editor__editable {
    height: 150px;
}


/*toottlip*/
.tooltip {
    z-index: 10000;
    position: absolute;
    pointer-events: none; 
}

.award_img .dashboard-awards {
    z-index: 1000; /* Higher number to bring the tooltip to the front */
    position: relative;
}

.offcanvas-backdrop.fade.show {
    z-index: 99999;
}

.offcanvas-backdrop.fade.show {
}


/* Apply rounded corners */
input.projectId_content {
    border: 1px solid lightgrey !important; /* Light blue border */
    border-radius: 5px; /* Adjust the radius as needed */
    transition: border-color 0.3s ease;
}

.selectbox .invalid-select {
    border: 1px solid red !important; /* Use !important to override other styles */
}

.empty-state {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100vh; /* Full height of the viewport */
}

.empty-state__content {
    text-align: center; /* Center the text */
}

/* Loader overlay specific to modal body */
.modal-body-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(255, 255, 255, 0.8); /* Semi-transparent background */
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 1050; /* Ensure it's above the modal content */
}

.loader {
    width: 3rem;
    height: 3rem;
    border: 0.25rem solid #f3f3f3; /* Light grey */
    border-top: 0.25rem solid #3498db; /* Blue */
    border-radius: 50%;
    animation: spin 1s linear infinite;
}

@keyframes spin {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}

/* Maintain the offcanvas behavior for sliding in from the right */
.ModalW500 {
    position: fixed;
    top: 0;
    right: 0;
    width: 500px;
    height: 100%;
    background-color: white;
    z-index: 1040; /* Default z-index for modals */
    overflow-y: auto;
    box-shadow: -2px 0 5px rgba(0, 0, 0, 0.5);
}

.sidemodal-loader {
    left: 50%;
    top: 50%;
    position: absolute;
    transform: translate(-50%, -50%);
}

/*LeadsTracker*/
.lead_tracker_filter .filter-left .selectbox {
    display: block;
}

.status_width {
    width: 130px;
}

.hidden {
    visibility: hidden;
}

/*.clear_link {
    align-self: center;
}
*/


.Lead_table tfoot tr td {
    font-weight: 600 !important;
}

.Lead_table .icon.tick img {
    width: 15px;
    height: 15px;
}

.counts_layout {
    display: flex;
    gap: 20px;
    margin-bottom: 20px;
}

.counts_content {
    background-color: var(--white);
    border-radius: 10px;
}

    .counts_content ul li {
        display: flex;
        justify-content: space-between;
    }

    .counts_content ul {
        padding: 0px;
    }

.count_header {
    padding: 10px 15px 10px;
    border-bottom: 1px solid #ddd;
    font-weight: 500;
    font-size: 0.75rem;
}

.counts_content ul li p {
    font-size: 0.688rem;
    margin-bottom: 3px;
}

    .counts_content ul li p + p {
        font-weight: 600;
    }

.counts_content ul li.count-open::before {
    background: #000000;
}

.counts_content ul li::before {
    z-index: 1;
    content: "";
    position: absolute;
    width: 6px;
    height: 6px;
    inset-inline-start: 1rem;
    inset-block-start: 1.25rem;
    border-radius: 50%;
    left: 15px;
    top: 8px;
    background-color: #000000;
}

.lead_tracker_layout .btn-list > .btn, .lead_tracker_layout .btn-link {
    font-size: 0.75rem;
}

.won_count {
    color: #13bfa6;
}

.counts_layout .platform-count-summary.counts_content {
    width: 21%;
}

.counts_layout .lead-count-summary.counts_content {
    width: 22%;
}

.counts_layout .salesPersonLead-count-summary.counts_content {
    width: 21%;
}

.counts_layout .AssignedPersonLead-count-summary.counts_content {
    flex: 1;
}

.counts_content.twoList ul {
    display: flex;
    flex-wrap: wrap;
}

.lead_tracker_layout .theme_table.theme_table_sm .table td,
.lead_tracker_layout .theme_table.theme_table_sm .table td a,
.lead_tracker_layout .btn-sm-badge,
.pagination_layout {
    font-size: 0.75rem;
}

.counts_layout .counts_content.twoList ul li:nth-of-type(odd) {
    border-right: 1px solid #e9ebec;
}

.counts_layout .counts_content.twoList ul li {
    width: 50%;
}

.counts_content ul li {
    list-style-type: none;
    display: flex;
    justify-content: space-between;
    font-family: "Poppins", sans-serif;
    position: relative;
    padding-left: 25px;
    padding: 3px 15px 3px 30px;
    border-top: 1px solid #e9ebec;
}

.lead_tracker_layout .selectbox p, .lead_tracker_layout .selectbox .form-control {
    font-size: 0.75rem;
}
/*
.add_lead_modal .modal-dialog {
    max-width: 1040px;
    padding: 10px;
}

.add_lead_modal .form-group label {
    width: 100%;
    text-align: left;
}

.add_lead_modal .form_flexBox_box {
    display: flex;
    flex-wrap: wrap;
    gap: 1%;
    padding-top: 5px;
}

.add_lead_modal .input-box {
    width: 21%;
}

    .add_lead_modal .input-box.client_name {
        width: 18%;
    }

    .add_lead_modal .input-box.client_Company_name {
        width: 20%;
    }

    .add_lead_modal .input-box.Sale_person {
        width: 16%;
    }

    .add_lead_modal .input-box.lead_platform {
        width: 15.2%;
    }

    .add_lead_modal .input-box.profile_width {
        width: 15%;
    }

    .add_lead_modal .input-box.Country_width {
        width: 21.5%;
    }

    .add_lead_modal .input-box.skills_row {
        flex: 1;
    }

    .add_lead_modal .input-box.first_offer {
        width: 19%;
    }

.add_lead_modal .offer_select {
    display: flex;
    align-items: center;
    border: 1px solid #c4cbdd;
    border-radius: 0.35rem;
    background: #fff;
}

    .add_lead_modal .offer_select p {
        margin: 0;
        background: #f1f1f1;
        padding: 2px 5px;
        min-height: 26px;
        height: 100%;
        font-weight: 500;
        border-radius: 0.35rem 0px 0px 0.35rem;
    }

.add_lead_modal .offer_value {
    display: flex;
    align-items: center;
}

    .add_lead_modal .offer_value .form-control, .offer_value select {
        border: 0;
        border-radius: 0;
        background: transparent;
        padding: 5px;
    }

    .add_lead_modal .offer_value .form-control {
        font-size: 0.813rem;
        border-left: 1px solid #ddd;
    }

.add_lead_modal .status-repeat-box h5 {
    margin: 0;
    font-weight: 500;
    font-size: 14px;
    position: absolute;
    left: 7px;
    top: -8px;
    background: #ffffff;
    padding: 0 5px;
    width: auto;
}
*/
.sale_stage_flex .input-box {
    width: inherit;
    flex: 1;
}



.sale_stage_flex .control_arrow_box {
    position: relative;
}


    .sale_stage_flex .control_arrow_box .form-control {
        width: 80%;
    }

.leadTableBtn {
    display: flex;
    gap: 7px;
}

    .leadTableBtn i {
        font-size: 16px;
    }

    .leadTableBtn .edit-anchor i {
        color: #26bf94;
    }

    .leadTableBtn a {
        cursor: pointer;
    }

    .leadTableBtn .delete-anchor i {
        color: var(--danger09);
    }

.lead_tracker_layout .btn-success-light:hover {
    background: #c1f3c8 !important;
    border-color: #13bfa6;
    color: #13bfa6 !important;
    opacity: 1;
}


.lead_tracker_layout .col_leadStatus .status-dropdown {
    width: 70px;
    font-size: 0.75rem !important;
    padding: 2px 5px;
}

.lead_tracker_layout .col_interviewStage,
.lead_tracker_layout .col_finalStage,
.lead_tracker_layout .col_techStage,
.lead_tracker_layout .col_saleStage {
    text-align: center;
}

/*.lead_tracker_layout .lead_tracker_filter .filter-right {
    align-self: center;
}*/

.lead_tracker_layout .status_container .btn-sm-badge {
    width: 60px;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    display: inline-block;
    position: relative;
    cursor: pointer;
    padding-right: 13px;
}

    .lead_tracker_layout .status_container .btn-sm-badge svg {
        vertical-align: middle;
        position: absolute;
        right: 3px;
        top: 5px;
    }

.bg_coldstatus {
    color: #ff22a7;
    background: #ffe9ed;
}

.bg_hotstatus {
    background-color: rgb(230 83 60 / 10%);
    color: #d34053;
}

.bg_wonstatus {
    background-color: #d5f9de;
}

.bg_warmstatus {
    color: #e0a01b !important;
    background: #f8e8c6;
}

.bg_deadstatus {
    background-color: rgb(12 12 12 / 10%);
}

.bg_wonstatus {
    background-color: #d5f9de;
    color: #13bfa6;
}



/*lead_title_layout */

.lead_title_layout .description_layout {
    background-color: #F8F8F8;
    padding: 10px;
    border: 1px solid #efefef;
    border-radius: 5px;
}

    .lead_title_layout .description_layout .group_Leadcomments {
        display: flex;
        font-size: 12px;
        color: #333333;
        gap: 10px;
        font-weight: 400;
        flex-wrap: wrap;
        font-style: italic;
    }

    .lead_title_layout .description_layout .label_bold {
        color: #4a4a4a;
        font-weight: 600;
        font-style: normal;
    }

.lead_title_layout .group_Leadcomments .lead-title {
    margin: 0 0 8px;
    font-size: 20px;
    display: flex;
    gap: 10px;
}

.lead_title_layout .job_description {
    margin-top: 12px;
}

.lead_title_layout .description_layout .job_desc_heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

.lead_title_layout .description_layout .comment_actions {
    display: flex;
    gap: 10px;
}

    .lead_title_layout .description_layout .comment_actions .edit_link,
    .lead_title_layout .description_layout .comment-actions .update_link {
        color: #46b39c;
    }

.lead_title_layout .description_layout .comment-actions button {
    background: transparent;
    border: none;
    padding: 0;
    font-size: 12px;
    display: inline-flex;
    gap: 2px;
    align-items: center;
    margin-top: 6px;
}

.lead_title_layout .description_layout h6 {
    font-size: 13px;
    margin: 0 0 6px;
    font-weight: 600;
}

.lead_title_layout .comment_actions .delete_link, .comment_actions .discard_link {
    color: #f06548;
}



.lead_title_layout .comment_actions button i {
    font-size: 25px;
}

.lead_title_layout .comment_actions button {
    display: flex;
    align-items: center;
    gap: 5px;
    border: 0;
    background-color: transparent;
}

.lead_title_layout .comment_actions .edit_link, .comment_actions .update_link {
    color: #46b39c;
}

.lead_title_layout .leave_comment_section {
    border-top: 1px dashed #e9ebec;
    margin-top: 16px;
    padding-top: 16px;
}

.lead_title_layout .leave_comment_heading h4 {
    margin: 0;
    font-size: 13px;
    border-bottom: 1px solid #e9ebec;
    padding-bottom: 10px;
    margin-bottom: 10px;
    color: rgb(33, 37, 41);
}

.lead_title_layout .comment_input_box {
    display: flex;
    gap: 10px;
    align-items: flex-end;
}

    .lead_title_layout .comment_input_box .comment_inner_input {
        flex: 1;
        position: relative;
    }

.lead_title_layout .comment_inner_input textarea, .comment_inner_input .textarea {
    background: rgb(243, 246, 249);
    font-size: 13px;
    width: 100%;
    max-width: inherit;
    padding: 8px 15px;
    height: 85px;
    border-radius: 3px !important;
    resize: vertical;
    border: 1px solid #ddd;
    outline: none;
    overflow: auto;
}

.lead_title_layout .comment_input_box button {
    padding: 7px 10px;
    height: 38px;
    font-size: 13px;
    color: #fff;
    outline: none;
    border: none;
    border-radius: 50px;
    box-shadow: 0px 5px 7px 1px rgba(0, 0, 0, 0.2);
    min-width: 38px;
}

.lead_title_layout .comment_list_main {
    padding-top: 10px;
    padding-left: 15px;
}

    .lead_title_layout .comment_list_main .comment_list_box {
        margin-top: 16px;
        display: flex;
        align-items: flex-start;
        gap: 10px;
        font-size: 13px;
    }

    .lead_title_layout .comment_list_main .user_image {
        height: 32px;
        width: 32px;
        overflow: hidden;
        border-radius: 50px;
        background: #ddd;
    }

.lead_title_layout .comment_list_box .user_comment {
    font-family: "Raleway", sans-serif;
    flex: 1;
}

.comment_list_box .user_name_date {
    font-size: 0.875rem;
    font-weight: 600;
    display: flex;
    gap: 10px;
    margin-bottom: 5px;
    align-items: center;
}

    .comment_list_box .user_name_date span {
        color: #878a99;
        font-size: 10px;
        font-style: italic;
        font-weight: 400;
    }

.comment_list_box .user_comment_desc {
    background: #f7f7ff;
    border: 1px solid #dddddd;
    padding: 10px;
    border-radius: 4px;
    color: #383838;
    font-weight: 500;
    line-height: 23px;
    font-size: 0.75rem;
}

.lead_title_layout .user_comment_desc_textarea {
    background: #f7f7ff;
    border: 1px solid #dddddd;
    padding: 10px;
    border-radius: 4px;
    color: #383838;
    font-weight: 500;
    line-height: 23px;
    font-size: 0.75rem;
}

.lead_title_layout .comment_list_box .user_comment_desc .mention_user {
    color: #0000ff;
    text-decoration: underline;
    font-family: "Poppins", sans-serif;
}

.Lead_table .total_row th {
    font-weight: 700 !important;
    padding-top: 7px !important;
    padding-bottom: 7px !important;
    background-color: #fff !important;
}

.datatable_theme .total_row th::before, .datatable_theme .total_row th::after {
    display: none;
}


.tooltip {
    color: rgb(var(--primary-rgb));
}

.entries_width {
    width: 70px;
}

.hover-effect:hover {
    transform: scale(1.01);
    transition: transform 0.2s ease-in-out;
}

.text-truncate {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

@keyframes bounceIn {
    0% {
        opacity: 0;
        transform: translateY(50px) scale(0.8); /* Start off-screen and small */
    }

    50% {
        opacity: 0.8;
        transform: translateY(-10px) scale(1.05); /* Overshoot for bounce effect */
    }

    100% {
        opacity: 1;
        transform: translateY(0) scale(1); /* Settle into place */
    }
}

.employee_team_content {
    opacity: 0;
    transform: translateY(50px) scale(0.8); /* Initial position */
    animation: none; /* No animation by default */
}

    .employee_team_content.show {
        animation: bounceIn 0.8s ease-out forwards; /* Normalize */
    }

.todo_content {
    opacity: 0;
    transform: translateY(50px) scale(0.8); /* Initial position */
    animation: none; /* No animation by default */
}

    .todo_content.show {
        animation: bounceIn 0.8s ease-out forwards; /* Normalize */
    }



.loader.hidden {
    opacity: 0;
    pointer-events: none;
}

.loader {
    opacity: 1;
    transition: opacity 0.3s ease-in-out;
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 9999;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.spinner {
    border: 4px solid rgba(0, 0, 0, 0.1);
    border-top: 4px solid #3498db;
    border-radius: 50%;
    width: 40px;
    height: 40px;
    animation: spin 1s linear infinite;
}

@keyframes spin {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}

/* No record section*/

.no-record-wrapper {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100vh; /* Full viewport height */
    background-color: #f9f9f9; /* Light background for contrast */
    text-align: center;
    flex-direction: column;
}

.no-record-content {
    max-width: 80%;
    padding: 20px;
    background: white;
    border-radius: 15px;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
    animation: slideIn 0.8s ease-out;
    text-align: center;
}

.animated-icon {
    font-size: 3rem;
    color: #ff4d4d;
    margin-bottom: 1rem;
    animation: pulse 1.5s infinite;
}

.NotFoundText {
    font-size: 1.8rem;
    color: #333;
    font-weight: bold;
    margin-bottom: 0.5rem;
}

.NotFoundSubText {
    font-size: 1rem;
    color: #666;
}

.notes_content {
    /* font-weight: 400;
    color: #333;
    font-size: 11px;
    font-style: italic;
    text-align: center;
    padding: 3px;
    margin-left: 20px;
    margin-right: 20px;
    margin-bottom: 2px;
    margin-top: -2px;*/
    font-weight: 400;
    color: #333;
    font-size: 11px;
    font-style: italic;
    text-align: left;
    padding: 0;
}


/* Slide-in animation */
@keyframes slideIn {
    from {
        transform: translateY(50px);
        opacity: 0;
    }

    to {
        transform: translateY(0);
        opacity: 1;
    }
}

/* Pulsating effect for the icon */
@keyframes pulse {
    0% {
        transform: scale(1);
    }

    50% {
        transform: scale(1.1);
    }

    100% {
        transform: scale(1);
    }
}

new_blackcolor {
    color: #000 !important;
}


/*Memo_Cursor*/
.memo_cursor{
    cursor : pointer;
}
.no-data-container {
    display: flex;
    justify-content: center; /* Center horizontally */
    align-items: center; /* Center vertically */
    height: 388px; /* Adjust height to match the graph area */
    width: 100%; /* Full width */
    text-align: center;
}

.no-data-message {
    font-size: 18px;
    color: #6c757d; /* Match the theme color */
    font-weight: bold;
    background-color: #f8f9fa; /* Light grey background */
    border: 1px solid #dee2e6; /* Subtle border */
    border-radius: 8px;
    padding: 15px 25px;
    box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1); /* Soft shadow for depth */
}
@media print {
    .no-print {
        display: none;
    }
}
.ck-editor__editable p {
    margin: 0; /* Removes paragraph margin */
    line-height: 1.2; /* Adjusts line height */
}
.attendance-table-responsive {
    max-height: calc(100vh - 300px);
}
body.custom-datepicker-open {
    overflow: hidden;
    padding-right:15px;
}
/*html body.modal-open {
    overflow: hidden !important;
    padding-right: 15px !important;
}

@-moz-document url-prefix() {
    html body.modal-open {
        padding-right: 0px !important;
    }
}*/

body::-webkit-scrollbar {
    width: 0px; 
}