/* default-button */
.default-button {
    min-height: 40px;
    padding: 4px 20px;
    font-size: 16px;
    font-weight: 400;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    background: var(--theme__color1);
    border-radius: 6px;
    transition: 0.3s;
    border: none;
    cursor: pointer;
    /*width: 13rem;
    height:4rem;*/
}

    .default-button:hover {
        color: #fff;
        background: #ff7b2a;
    }

.default-button--theme2 {
    background: var(--theme__color2) !important;
}

    .default-button--theme2:hover {
        background: #0d1a29 !important;
    }

.default-button--theme-green {
    background: #4CAF50;
}

.report-range {
    min-width: 310px !important;
}

/* default-input */
.default-input {
    padding: 0 15px 0 15px !important;
    min-width: 100px !important;
    min-height: 40px !important;
    background: #F9F9FA;
    width: 100%;
    border: none;
    border-radius: 5px !important;
    color: #656565;
    font-size: 14px;
    align-items: center;
    display: block;
}

    .default-input.theme-filled {
        background: var(--theme__color1);
        color: #fff;
        width: initial;
        min-width: 160px;
    }

        .default-input.theme-filled::after {
            border-color: #fff !important;
        }

        .default-input.theme-filled .list {
            color: var(--theme__color1);
        }

.default-input--big {
    height: 160px !important;
    padding: 17px 15px 0 15px !important;
    resize: none;
}

.default-input--mid {
    height: 80px !important;
    padding: 15px 0px 0 0px !important;
    resize: none;
}

.default-input-bg {
    background: #F9F9FA !important;
}

.default-input--dot-border {
    border: 1px dashed rgba(0, 0, 0, 0.788) !important;
    /* background-image: url("data:image/svg+xml,%3csvg width='100%25' height='100%25' xmlns='http://www.w3.org/2000/svg'%3e%3crect width='100%25' height='100%25' fill='none' stroke='%23333' stroke-width='1' stroke-dasharray='4%2c 4' stroke-dashoffset='0' stroke-linecap='square'/%3e%3c/svg%3e"); */
}

.default-input--bordered {
    border: 1px solid rgba(101, 101, 101, 0.158);
    background: transparent;
}

.bg-default-input {
    background: #F9F9FA;
}


/* custom-dropdown */
.custom-menu-dropdown {
    opacity: 0;
    visibility: hidden;
    transition: 0.2s;
}

    .custom-menu-dropdown.active {
        opacity: 1;
        visibility: visible;
    }



/* .bootstrap-datetimepicker-widget {
    background: red !important;
    height: 500px !important;
    width: 500px !important;
}
.bootstrap-datetimepicker-widget  * {
    background-color: blue;
    height: 500px;
    border: 5px solid black;
    color: #000;
    padding: 30px;

} */


/* default-box-card */
.default-box {
    background: #fff;
    box-shadow: 0px 10px 30px #0000001A;
    border-radius: 6px;
}



/* dropzon */
.dropzone {
    position: relative;
}

    .dropzone .dz-message {
        display: none !important;
    }

    .dropzone.dz-drag-hover {
        background-image: url("data:image/svg+xml,%3csvg width='100%25' height='100%25' xmlns='http://www.w3.org/2000/svg'%3e%3crect width='100%25' height='100%25' fill='none' rx='6' ry='6' stroke='rgb(255, 145, 77)' stroke-width='5' stroke-dasharray='4%2c 0' stroke-dashoffset='0' stroke-linecap='square'/%3e%3c/svg%3e");
        border-radius: 6px;
        border: none !important;
    }

    .dropzone.dz-started {
    }

        .dropzone.dz-started .custom-design {
            opacity: 0;
        }

    .dropzone .custom-design {
        padding: 20px;
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        display: flex;
        flex-direction: column;
        align-items: center;
        text-align: center;
        pointer-events: none;
    }

        .dropzone .custom-design h4 {
            margin: 0 0 8px !important;
            font-size: 20px !important;
            font-weight: 600 !important;
            color: #1B2C3F !important;
            opacity: 0.5;
        }

        .dropzone .custom-design p {
            font-size: 16px;
            font-weight: 400;
            color: #1B2C3F;
            opacity: 0.5;
        }
/* dropzon-end */








/* checkbox-model */
.checkbox-model {
    appearance: none;
    height: 20px;
    width: 20px;
    position: relative;
    flex-shrink: 0;
}

    .checkbox-model::before {
        height: 100%;
        width: 100%;
        position: absolute;
        top: 0;
        left: 0;
        content: '';
        display: block;
        border: 1px solid #DFDFDF;
    }

    .checkbox-model::after {
        font-size: 17px;
        padding: 2px 0 0;
        height: 100%;
        width: 100%;
        position: absolute;
        top: 0;
        left: 0;
        content: '\f00c';
        font-family: "Font Awesome 5 Pro";
        background: var(--theme__color1);
        color: #fff;
        display: flex;
        align-items: center;
        justify-content: center;
        border: 1px solid var(--theme__color1);
        opacity: 0;
        transition: 0.3s;
    }

    .checkbox-model:checked::after {
        opacity: 1;
    }


/* checkbox-box-model */
.checkbox-box-model {
    --color: #6F6F6F;
    appearance: none;
    height: 20px;
    width: 20px;
    position: relative;
}

    .checkbox-box-model::before {
        content: '';
        position: absolute;
        height: 100%;
        width: 100%;
        top: 50%;
        left: 50%;
        transform: translate(-50%,-50%);
        border: 2px solid var(--color);
        display: block;
    }

    .checkbox-box-model::after {
        content: '';
        position: absolute;
        height: 50%;
        width: 50%;
        top: 50%;
        left: 50%;
        transform: translate(-50%,-50%);
        background: var(--color);
        display: block;
        opacity: 0;
        transition: 0.3s;
    }

    .checkbox-box-model:checked::after {
        opacity: 1;
    }

.checkbox-model--theme2 {
    --color: #7CCBF1;
}

.checkbox-model--theme3 {
    --color: #F39F9F;
}

.checkbox-model--theme4 {
    --color: #C2E4BC;
}

.checkbox-model--theme5 {
    --color: #DFC5E8;
}

.checkbox-model--theme6 {
    --color: #FFF184;
}

.checkbox-model--theme7 {
    --color: #7BC7C3;
}

.checkbox-box-model--blue-theme {
    --color: #0075FF;
}

.checkbox-model--page-theme1 {
    --color: var(--theme__color1);
}

.checkbox-box-model-outer-light::before {
    border-color: grey !important;
}

/* letter-checkbox */
.letter-checkbox {
    height: 38px;
    width: 38px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 5px;
    position: relative;
    z-index: 1;
    cursor: pointer;
    margin-right: 10px;
}

    .letter-checkbox input {
        height: 100%;
        width: 100%;
        position: absolute;
        top: 0;
        left: 0;
        z-index: -1;
        appearance: none;
        border-radius: inherit;
        transition: 0.3s;
        cursor: pointer;
    }

        .letter-checkbox input::before {
            content: '';
            height: 100%;
            width: 100%;
            position: absolute;
            top: 0;
            left: 0;
            background: #F9F9FA;
            border-radius: inherit;
            transition: 0.3s;
        }

        .letter-checkbox input:checked::before {
            background: var(--theme__color1);
        }

    .letter-checkbox span {
        transition: 0.3s;
        pointer-events: none;
    }

    .letter-checkbox input:checked ~ span {
        color: #fff;
    }




/* date-picker */
.Zebra_DatePicker_Icon_Wrapper {
    width: 100%;
}

.Zebra_DatePicker {
    background: var(--theme__color2);
}

    .Zebra_DatePicker .dp_daypicker th {
        background: var(--theme__color1);
        border: none;
        color: #fff;
    }

    .Zebra_DatePicker .dp_body .dp_selected {
        background: var(--theme__color1);
    }

    .Zebra_DatePicker .dp_body td {
        background: #fff;
    }

    .Zebra_DatePicker .dp_body tr:nth-child(2) td {
        border-top: none;
    }

    .Zebra_DatePicker .dp_body td:hover {
        background: #fff;
        color: var(--theme__color1);
    }

    .Zebra_DatePicker .dp_body .dp_weekend {
        background: rgb(250, 250, 250);
    }

    .Zebra_DatePicker .dp_body .dp_disabled {
        background: #fff;
        color: #ccc;
        cursor: text;
    }

/* checkbox-switch */
.checkbox-switch {
    appearance: none;
    height: 20px;
    width: 40px;
    position: relative;
    border: none;
}

    .checkbox-switch::before {
        height: 100%;
        width: 100%;
        position: absolute;
        top: 0;
        left: 0;
        content: '';
        display: block;
        background: #d8d8d8;
        border-radius: 30px;
        transition: 0.3s;
    }

    .checkbox-switch:checked::before {
        background: var(--theme__color1);
    }

    .checkbox-switch::after {
        --offset: 5px;
        height: 12px;
        aspect-ratio: 1 / 1;
        border-radius: 50%;
        position: absolute;
        top: 50%;
        left: calc(100% - var(--offset));
        transform: translate(-100%, -50%);
        content: '';
        background: #fff;
        display: block;
        transition: 0.3s;
    }

    .checkbox-switch:checked::after {
        transform: translate(0, -50%);
        left: var(--offset);
    }

.switch {
    position: relative;
    display: inline-block;
    width: 90px !important;
    height: 32px;
}

    .switch input {
        display: none;
    }

.slider {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #e6e6e6;
    -webkit-transition: .4s;
    transition: .4s;
    border-radius: 34px;
}

    .slider:before {
        position: absolute;
        content: "";
        height: 26px;
        width: 26px;
        left: 4px;
        bottom: 4px;
        background-color: white;
        -webkit-transition: .4s;
        transition: .4s;
        border-radius: 50%;
    }

input:checked + .slider {
    background-color: #FF914D;
}

input:focus + .slider {
    box-shadow: 0 0 1px #2196F3;
}

input:checked + .slider:before {
    -webkit-transform: translateX(26px);
    -ms-transform: translateX(26px);
    transform: translateX(55px);
}

/*------ ADDED CSS ---------*/
.slider:after {
    content: 'OFF';
    color: white;
    display: block;
    position: absolute;
    transform: translate(-50%,-50%);
    top: 50%;
    left: 50%;
    font-size: 10px;
    font-family: Verdana, sans-serif;
}

input:checked + .slider:after {
    content: 'ON';
}

/*--------- END --------*/


/* ui-range-slider */
.ui-slider-handle {
}

    .ui-slider-handle .slider-tooltip {
        position: absolute;
        top: -38px;
        left: 0;
        background: #fff;
        display: flex;
        height: 30px;
        width: 30px;
        left: -4px;
        display: flex;
        align-items: center;
        justify-content: center;
        border-radius: 4px;
        opacity: 0;
    }

.ui-state-active .slider-tooltip {
    opacity: 1;
}

.ui-slider-horizontal {
    height: 5px;
    border: none;
}

.ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default {
    background: #fff;
    border: 3px solid #FF7B2A;
    height: 15px;
    width: 15px;
    border-radius: 50%;
}


/* multi-select-input */
.ss-main .ss-single-selected, .ss-main .ss-multi-selected {
    height: 100%;
    padding: 0px;
    border: none;
    background-color: transparent;
    padding-top: 3px;
    padding-bottom: 3px;
}

    .ss-main .ss-multi-selected .ss-values .ss-value {
        background: var(--theme__color1);
        align-items: center;
        padding-right: 10px;
    }

        .ss-main .ss-multi-selected .ss-values .ss-value .ss-value-delete {
            order: -1;
            margin-right: 7px;
        }


/* date-range-picker */
.daterangepicker .ranges li.active {
    background-color: transparent;
    color: #0075FF;
}

.daterangepicker .drp-buttons .btn-primary {
    background: var(--theme__color1);
    border: none;
}

.daterangepicker td.active, .daterangepicker td.active:hover {
    background: var(--theme__color1);
}


/* small-tools */
.flex-grow {
    flex-grow: 1;
}

.no-shrink {
    flex-shrink: 0;
}

.left-0 {
    left: 0;
}

.underline {
    text-decoration: underline !important;
}

.h-initial {
    height: initial !important;
}

.w-initial {
    width: initial !important;
}

.w-0 {
    width: 0 !important;
}

.space-nowrap {
    white-space: nowrap;
}

.hidden-scroll {
    overflow-y: auto !important;
    -ms-overflow-style: none !important; /* IE and Edge */
    scrollbar-width: none !important; /* Firefox */
}

    .hidden-scroll::-webkit-scrollbar {
        display: none !important;
    }

.pseudo-before-none::before {
    display: none !important;
}

.pseudo-after-none::after {
    display: none !important;
}

.pseudo-none::before,
.pseudo-none::after {
    display: none !important;
}

.click-none {
    pointer-events: none;
}

.table-fixed {
    table-layout: fixed;
}

.default-transition {
    transition: 0.3s;
}

.radius-0 {
    border-radius: 0 !important;
}

.flip {
    transform: rotateY(180deg);
}

.flip-x {
    transform: rotateX(180deg);
}

.rotate1_8 {
    transform: rotate(45deg) !important;
}

.rotate2_8 {
    transform: rotate(90deg) !important;
}

.rotate3_8 {
    transform: rotate(135deg) !important;
}

.rotate4_8 {
    transform: rotate(180deg) !important;
}

.rotate5_8 {
    transform: rotate(225deg) !important;
}

.rotate6_8 {
    transform: rotate(270deg) !important;
}

.rotate7_8 {
    transform: rotate(315deg) !important;
}

.rotate8_8 {
    transform: rotate(360deg) !important;
}

.left-100 {
    left: 100%;
}

.border-right-1 {
    border-right: 1px solid #E6E6E6;
}

.shadow-none {
    box-shadow: none !important;
    text-shadow: none !important;
}

/* bg */
.bg-theme1 {
    background: var(--theme__color1) !important;
}

.bg-theme2 {
    background: var(--theme__color2) !important;
}

.bg-theme3 {
    background: var(--theme__color3) !important;
}

.bg-theme4 {
    background: var(--theme__color4) !important;
}

.bg-green {
    background: #00A65A;
}

/* hover--bg */
.hover-bg-theme1:hover {
    background: var(--theme__color1) !important;
}

.hover-bg-theme2:hover {
    background: var(--theme__color2) !important;
}

.hover-bg-theme3:hover {
    background: var(--theme__color3) !important;
}

.hover-bg-theme4:hover {
    background: var(--theme__color4) !important;
}


/* fonts */
.font1 {
    font-family: var(--font1);
}

.font2 {
    font-family: var(--font2);
}

.font3 {
    font-family: var(--font3);
}

.font4 {
    font-family: var(--font4);
}


/* text-color */
.color-white {
    color: #fff !important;
}

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

.color-theme1 {
    color: var(--theme__color1) !important;
}

.color-theme2 {
    color: var(--theme__color2) !important;
}

.color-theme3 {
    color: var(--theme__color3) !important;
}

.color-theme4 {
    color: var(--theme__color4) !important;
}


/* text-align */
.text-left {
    text-align: left !important;
}

.text-right {
    text-align: right !important;
}

.text-center {
    text-align: center !important;
}

.text-justified {
    text-align: justify !important;
}


/* font-weights */
.fw-300 {
    font-weight: 300 !important;
}

.fw-400 {
    font-weight: 400 !important;
}

.fw-500 {
    font-weight: 500 !important;
}

.fw-600 {
    font-weight: 600 !important;
}

.fw-700 {
    font-weight: 700 !important;
}

.fw-800 {
    font-weight: 800 !important;
}


/* nice-number */
.nice-number {
    position: relative;
    width: 90px !important;
    background: #F9F9FA;
    border: none;
}

    .nice-number button {
        position: absolute;
        top: 0;
        right: 0;
        border: none;
        height: 50%;
        width: 28px;
        z-index: 3;
        background: transparent;
        color: transparent;
        border-left: 1px solid rgba(112, 112, 112, 0.164);
    }

        .nice-number button:nth-of-type(1) {
        }

        .nice-number button::before {
            position: absolute;
            top: 50%;
            left: 50%;
            transform: translate(-50%,-50%);
            color: rgb(99, 99, 99);
            font-size: 11px;
        }

        .nice-number button:nth-of-type(1)::before {
            content: '\f077';
            font-family: "Font Awesome 5 Pro";
        }

        .nice-number button:nth-of-type(2) {
            top: initial;
            bottom: 0;
        }

            .nice-number button:nth-of-type(2)::before {
                content: '\f078';
                font-family: "Font Awesome 5 Pro";
            }

    .nice-number input {
        width: 70px !important;
        height: 40px;
        padding: 0 15px;
    }



/* nice-select-edit */
.nice-select {
    height: fit-content;
    min-height: initial;
    line-height: 1;
    padding: 0 20px 0 0;
    float: none;
    display: inline-flex;
    border: none;
    align-items: center;
    padding: 10px 12px !important;
}

@media (max-width: 1399px) {
    .nice-select {
        padding: 8px 10px !important;
    }
}

.nice-select:after {
    margin-top: -2px;
}

.nice-select .list .option,
.nice-select.open .list .option {
    font-size: 16px;
    line-height: initial;
    min-height: initial;
    padding: 10px 15px;
    min-width: 50px;
}

.nice-select .option.selected {
    font-weight: inherit;
}

.nice-select .list {
    border-radius: 2px;
    min-width: 100%;
}

.nice-select.drop-up .list {
    top: auto !important;
    bottom: calc(100% + 4px);
}

@media (max-width: 767px) {
    .nice-select .list .option,
    .nice-select.open .list .option {
        font-size: 16px;
        line-height: initial;
        min-height: initial;
        padding: 8px 12px;
        min-width: 50px;
    }
}





/* important */
#scrollUp {
    background-image: url("../images/base/top.png");
    bottom: 20px;
    right: 20px;
    width: 38px; /* Width of image */
    height: 38px; /* Height of image */
    color: transparent;
}


/* full-calender */
#calendar {
    width: 100%;
    max-width: initial;
    max-height: 100%;
}

.fc .fc-toolbar.fc-header-toolbar {
    padding: 15px 16px;
    margin: 0;
}

.fc .fc-toolbar-title {
    font-size: 24px;
    font-weight: 400;
}

.fc .fc-col-header-cell-cushion {
    padding: 7px 0;
    background: #F3F4F5;
    width: 100%;
    font-weight: 400;
}

.fc .fc-button {
    padding: 0 10px 3px;
}

.fc-h-event, .fc-v-event {
    background: #F39F9F;
    border-color: transparent;
}

.fc-daygrid-event-dot, .fc .fc-list-event-dot {
    border-color: var(--theme__color2);
}

.fc-view-harness {
    overflow: auto;
}

.fc-daygrid, .fc-timegrid {
    min-width: 1000px !important;
}

.fc-dayGridMonth-button, .fc-timeGridWeek-button, .fc-timeGridDay-button, .fc-listMonth-button {
    background: #F3F4F5 !important;
    border: none !important;
    color: var(--theme__color2) !important;
    border-radius: 5px !important;
    min-width: 60px;
}

    .fc-dayGridMonth-button.fc-button-active, .fc-timeGridWeek-button.fc-button-active, .fc-timeGridDay-button.fc-button-active, .fc-listMonth-button.fc-button-active {
        border-radius: 5px !important;
        background: var(--theme__color2) !important;
        color: #fff !important;
    }

.fc-timeGridWeek-button, .fc-timeGridDay-button, .fc-listMonth-button {
    margin-left: 10px !important;
}


@media (max-width: 767px) {
    .fc .fc-toolbar.fc-header-toolbar {
        flex-wrap: wrap;
        position: relative;
    }

        .fc .fc-toolbar.fc-header-toolbar .fc-toolbar-chunk:nth-child(3) {
            margin: 15px 0 0;
            padding: 15px 0 0;
            border-top: 1px dashed #cccccc;
            width: 100%;
            order: 5;
        }

            .fc .fc-toolbar.fc-header-toolbar .fc-toolbar-chunk:nth-child(3) .fc-button-group {
                width: 100%;
            }

        .fc .fc-toolbar.fc-header-toolbar .fc-toolbar-chunk:nth-child(2) {
            position: absolute;
            top: 15px;
            left: 50%;
            transform: translateX(-50%);
        }


        .fc .fc-toolbar.fc-header-toolbar .fc-toolbar-chunk:nth-child(1) {
            width: 100%;
            display: flex;
            justify-content: space-between;
        }

    .fc-today-button {
        order: -1;
    }

    .fc-today-button {
        margin: 0 !important;
    }
}


@media (max-width: 575px) {
    .fc .fc-toolbar-title {
        font-size: 18px;
    }

    .fc .fc-toolbar.fc-header-toolbar .fc-toolbar-chunk:nth-child(2) {
        top: 20px;
    }

    .fc-prev-button {
        padding: 0 !important;
    }

    .fc-next-button {
        padding: 0 !important;
    }
}

/* Css for card design */
.card {
    padding: 1rem;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
    border-radius: 10px;
}

.card-header {
    padding: 1rem;
    margin-bottom: 0rem;
    background-color: transparent;
}

.section-title {
    margin-top: 0rem !important;
    margin-bottom: 0rem !important;
}

.filter-ddl {
    height: 41px;
    font-size: 16px;
}

.card-footer {
    padding: 1rem;
    background-color: transparent;
}
/* End Card Design */
/* Css for Data Table */
.bg-primary {
    background-color: var(--theme__color1) !important;
}

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

.pagination {
    display: flex !important;
    /*padding-left: 57rem !important;*/
}

.dataTables_wrapper .dataTables_paginate {
    display: flex !important;
    justify-content: space-between;
    width: 100%;
}

/*.table-striped > tbody > tr:nth-of-type(odd) {
    --bs-table-accent-bg: #FFF5F3;
    color: var(--bs-table-striped-color);
}*/

.table-hover > tbody > tr:hover {
    --bs-table-accent-bg: #0000001A;
    font-weight: 600;
    font-size: 1.05rem;
    transition: all 0.3s ease;
}

.table-hover > tbody > tr:hover .text-primary {
    color: #1B2C3F !important;
    font-weight: 600;
    font-size: 1.5rem;
    transition: all 0.3s ease;
}

.dataTables_length label {
    font-weight: 100 !important;
}

.dataTables_length select {
    width: 6rem !important;
    border-radius: 0.5rem !important;
    height:3rem;
}

/* End Datatable */
/*===================================================================================================*/
/*Modal Popup New Design In Payors list page*/
.newpopup {
    background: white !important;
    border-radius: 16px !important;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.1) !important;
    padding: 10px !important;
    max-width: 450px !important;
    width: 90% !important;
    position: relative !important;
    overflow: hidden !important;
}

    .newpopup .newpopupicon {
        width: 60px !important;
        height: 60px !important;
        border-radius: 50% !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        margin: 0 auto 20px !important;
        color: white !important;
        font-size: 24px !important;
        font-weight: bold !important;
    }

    .newpopup .newpopuptitle {
        color: #2c3e50 !important;
        font-size: 2.5rem !important;
        margin-bottom: 12px !important;
        text-align: center !important;
        font-weight: 600 !important;
    }

    .newpopup .newpopuptext {
        color: black !important;
        line-height: 1.6 !important;
        margin-bottom: 5px !important;
        text-align: center !important;
        font-size: 16px !important;
        border-top: 1px solid #e5e5e5 !important;
        padding: 10px !important;
    }

    .newpopup .newpopupbuttons {
        display: flex !important;
        gap: 12px !important;
        justify-content: center !important;
    }

    .newpopup .newpopupbuttonprimary {
        color: white !important;
        border: none !important;
        padding: 14px 28px !important;
        border-radius: 8px !important;
        font-weight: 600 !important;
        cursor: pointer !important;
        transition: all 0.3s ease !important;
        font-size: 14px !important;
    }

    .newpopup .newpopupbuttonsecondary {
        background: #001f3f !important;
        color: white !important;
        border: none !important;
        padding: 14px 28px !important;
        border-radius: 8px !important;
        font-weight: 600 !important;
        cursor: pointer !important;
        transition: all 0.3s ease !important;
        font-size: 14px !important;
    }

    .newpopup .newpopupbuttonprimary:hover {
        transform: translateY(-2px) !important;
        box-shadow: none !important;
    }

    .newpopup .newpopupbuttonsecondary:hover {
        background: #001f3f !important;
        transform: translateY(-2px) !important;
    }

    .newpopup .newpopupclose {
        position: absolute !important;
        top: 15px !important;
        right: 15px !important;
        background: none !important;
        border: none !important;
        font-size: 20px !important;
        cursor: pointer !important;
        color: #bdc3c7 !important;
        transition: all 0.3s ease !important;
        width: 30px !important;
        height: 30px !important;
        border-radius: 50% !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
    }

        .newpopup .newpopupclose:hover {
            color: #7f8c8d !important;
            transform: scale(1.1) !important;
            background: #f8f9fa !important;
        }

/* SUCCESS POPUP */
.newpopupsuccess::before {
    content: '' !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    height: 4px !important;
    background: linear-gradient(90deg, #27ae60, #2ecc71) !important;
}

.newpopupsuccess .newpopupicon {
    background: var(--theme__color1) !important;
}

.newpopupsuccess .newpopupbuttonprimary {
    background: var(--theme__color1) !important;
    box-shadow: none !important;
}

    .newpopupsuccess .newpopupbuttonprimary:hover {
        box-shadow: none !important;
    }

/* WARNING POPUP */
.newpopupwarning::before {
    content: '' !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    height: 4px !important;
    background: linear-gradient(90deg, #f39c12, #e67e22) !important;
}

.newpopupwarning .newpopupicon {
    background: var(--theme__color1) !important;
}

.newpopupwarning .newpopupbuttonprimary {
    background: var(--theme__color1) !important;
    box-shadow: none !important;
}

    .newpopupwarning .newpopupbuttonprimary:hover {
        box-shadow: none !important;
    }

/* ERROR POPUP */
.newpopuperror::before {
    content: '' !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    height: 4px !important;
    background: linear-gradient(90deg, #e74c3c, #c0392b) !important;
}

.newpopuperror .newpopupicon {
    background: var(--theme__color1) !important;
}

.newpopuperror .newpopupbuttonprimary {
    background: var(--theme__color1) !important;
    box-shadow: none !important;
}

    .newpopuperror .newpopupbuttonprimary:hover {
        box-shadow: none !important;
    }

/* DEFAULT/ORANGE POPUP (Your original theme) */
.newpopupdefault::before {
    content: '' !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    height: 4px !important;
    background: linear-gradient(90deg, #ff6b35, #ff8c42) !important;
}

.newpopupdefault .newpopupicon {
    background: var(--theme__color1) !important;
}

.newpopupdefault .newpopupbuttonprimary {
    background: var(--theme__color1) !important;
    box-shadow: none !important;
}

    .newpopupdefault .newpopupbuttonprimary:hover {
        box-shadow: none !important;
    }

/* Responsive Design */
@media (max-width: 768px) {
    .newpopup {
        margin: 20px !important;
        padding: 30px !important;
    }

        .newpopup .newpopupbuttons {
            flex-direction: column !important;
        }

        .newpopup .newpopupbuttonprimary,
        .newpopup .newpopupbuttonsecondary {
            width: 100% !important;
        }
}


/*End Popup New Design*/

/*NEW POPUP DESIGN LIST IN REMINDERS PAGE*/

.newemailpreviewpopup-dialog {
    max-width: 600px !important;
    margin: 1.75rem auto !important;
}

.newemailpreviewpopup-content {
    border-radius: 12px !important;
    border: none !important;
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.15) !important;
    overflow: hidden !important;
}

.newemailpreviewpopup-wrapper {
    position: relative !important;
    background: #fff !important;
}

.newemailpreviewpopup-close {
    position: absolute !important;
    top: 25px !important;
    right: 20px !important;
    z-index: 1000 !important;
    background: rgba(255, 255, 255, 0.2) !important;
    border-radius: 50% !important;
    width: 35px !important;
    height: 35px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    color: white !important;
    text-decoration: none !important;
    transition: all 0.3s ease !important;
}

    .newemailpreviewpopup-close:hover {
        background: rgba(255, 255, 255, 0.3) !important;
        transform: scale(1.1) !important;
        color: white !important;
    }

    .newemailpreviewpopup-close i {
        font-size: 16px !important;
        color: white !important;
    }

.newemailpreviewpopup-head {
    background: var(--theme__color1) !important;
    padding: 25px 30px !important;
    margin: 0 !important;
    border-bottom: none !important;
}

    .newemailpreviewpopup-head h2 {
        color: white !important;
        font-size: 24px !important;
        font-weight: 600 !important;
        margin: 0 !important;
        text-align: center !important;
        text-shadow: 0 1px 2px rgba(0, 0, 0, 0.1) !important;
    }

.newemailpreviewpopup-form {
    background: #f8f9fa !important;
    padding: 30px !important;
    margin: 0 !important;
}

.newemailpreviewpopup-row {
    margin: 0 !important;
}

.newemailpreviewpopup-col {
    padding: 0 !important;
    margin-bottom: 25px !important;
}

    .newemailpreviewpopup-col:last-child {
        margin-bottom: 0 !important;
    }

.newemailpreviewpopup-input-wrapper {
    position: relative !important;
}

.newemailpreviewpopup-label {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    margin-bottom: 10px !important;
    font-weight: 600 !important;
    color: #333 !important;
    font-size: 14px !important;
}

    .newemailpreviewpopup-label span {
        color: #555 !important;
        font-size: 14px !important;
    }

.newemailpreviewpopup-input {
    width: 100% !important;
    padding: 12px 16px !important;
    border: 2px solid #e1e5e9 !important;
    border-radius: 8px !important;
    font-size: 14px !important;
    color: #333 !important;
    background: white !important;
    transition: all 0.3s ease !important;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05) !important;
    font-family: inherit !important;
    resize: none !important;
}

    .newemailpreviewpopup-input:focus {
        outline: none !important;
        border-color: #ff6b35 !important;
        box-shadow: 0 0 0 3px rgba(255, 107, 53, 0.1) !important;
        transform: translateY(-1px) !important;
    }

    .newemailpreviewpopup-input:hover {
        border-color: #ff8c42 !important;
        box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1) !important;
    }

.newemailpreviewpopup-textarea {
    min-height: 200px !important;
    line-height: 1.6 !important;
    padding: 16px !important;
    font-family: inherit !important;
    resize: vertical !important;
    min-height: 150px !important;
    max-height: 400px !important;
}

.newemailpreviewpopup-input::placeholder {
    color: #999 !important;
    opacity: 1 !important;
    font-style: italic !important;
}

.newemailpreviewpopup-input[readonly] {
    background: #f8f9fa !important;
    cursor: not-allowed !important;
    opacity: 0.8 !important;
}

    .newemailpreviewpopup-input[readonly]:hover {
        border-color: #e1e5e9 !important;
        box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05) !important;
        transform: none !important;
    }

/* Animation for Modal Appearance */
.newemailpreviewpopup-content {
    animation: newemailpreviewpopupSlideIn 0.3s ease-out !important;
}

@keyframes newemailpreviewpopupSlideIn {
    from {
        transform: translateY(-50px) !important;
        opacity: 0 !important;
    }

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

/* Responsive Design */
@media (max-width: 768px) {
    .newemailpreviewpopup-dialog {
        max-width: 95% !important;
        margin: 1rem auto !important;
    }

    .newemailpreviewpopup-head {
        padding: 20px !important;
    }

        .newemailpreviewpopup-head h2 {
            font-size: 20px !important;
        }

    .newemailpreviewpopup-form {
        padding: 20px !important;
    }

    .newemailpreviewpopup-close {
        top: 10px !important;
        right: 15px !important;
        width: 30px !important;
        height: 30px !important;
    }
}
.newemailpreviewpopup-footer {
    background: #f8f9fa !important;
    border-top: 1px solid #e9ecef !important;
    padding: 20px 30px !important;
    text-align: center !important;
    margin: 0 !important;
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    gap: 15px !important;
}

.newemailpreviewpopup-footer-note {
    text-align: center !important;
    color: #666 !important;
    font-size: 14px !important;
    margin-bottom: 15px !important;
    font-style: italic !important;
}

@media (max-width: 768px) {
    .newemailpreviewpopup-footer {
        flex-direction: column !important;
        gap: 10px !important;
        padding: 15px 20px !important;
    }
}

/*END DESIGN OF REMINDERS PAGE */

/*New Design For Popup With Form*/

.newpopupwithform-dialog {
    max-width: 600px !important;
    margin: 1.75rem auto !important;
}

.newpopupwithform-content {
    border-radius: 12px !important;
    border: none !important;
    box-shadow: 0 20px 40px rgba(0, 0, 0, 0.15) !important;
    overflow: hidden !important;
}

.newpopupwithform-wrapper {
    position: relative !important;
    background: #fff !important;
}

.newpopupwithform-close {
    position: absolute !important;
    /*top: 20px !important;*/
    top: 15px !important;
    right: 20px !important;
    z-index: 1000 !important;
    background: rgba(255, 255, 255, 0.2) !important;
    border-radius: 50% !important;
    width: 35px !important;
    height: 35px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    color: white !important;
    text-decoration: none !important;
    transition: all 0.3s ease !important;
}

    .newpopupwithform-close:hover {
        background: rgba(255, 255, 255, 0.3) !important;
        transform: scale(1.1) !important;
        color: white !important;
    }

    .newpopupwithform-close i {
        font-size: 16px !important;
        color: white !important;
    }

.newpopupwithform-head {
    background: var(--theme__color1) !important;
    /*padding: 25px 30px !important;*/
    padding: 16px 30px !important;
    margin: 0 !important;
    border-bottom: none !important;
}

    .newpopupwithform-head h2 {
        color: white !important;
        font-size: 24px !important;
        font-weight: 600 !important;
        margin: 0 !important;
        text-align: center !important;
        text-shadow: 0 1px 2px rgba(0, 0, 0, 0.1) !important;
    }

.newpopupwithform-buttons {
    display: flex !important;
    gap: 12px !important;
    justify-content: center !important;
}

.newpopupwithform-buttonprimary {
    background: var(--theme__color1) !important;
    color: white !important;
    border: none !important;
    padding: 14px 28px !important;
    border-radius: 8px !important;
    font-weight: 600 !important;
    cursor: pointer !important;
    transition: all 0.3s ease !important;
    font-size: 14px !important;
}

.newpopupwithform-buttonsecondary {
    background: #001f3f !important;
    color: white !important;
    border: none !important;
    padding: 14px 28px !important;
    border-radius: 8px !important;
    font-weight: 600 !important;
    cursor: pointer !important;
    transition: all 0.3s ease !important;
    font-size: 14px !important;
}

.newpopupwithform-buttonprimary:hover {
    transform: translateY(-2px) !important;
    box-shadow: none !important;
}

.newpopupwithform-buttonsecondary:hover {
    background: #001f3f !important;
    transform: translateY(-2px) !important;
}
/*END Design For Popup With Form*/

/*NEW POPUP DESIGN FOR SWAL*/

.newpopup-swal {
    background: white !important;
    border-radius: 16px !important;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.1) !important;
    padding: 10px !important;
    max-width: 450px !important;
    width: 90% !important;
    position: relative !important;
    overflow: hidden !important;
}

.newpopupicon-swal {
    width: 60px !important;
    height: 60px !important;
    border-radius: 50% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin: 0 auto 20px !important;
    color: white !important;
    font-size: 24px !important;
    font-weight: bold !important;
}

.newpopuptitle-swal {
    color: #2c3e50 !important;
    font-size: 2.5rem !important;
    margin-bottom: 12px !important;
    text-align: center !important;
    font-weight: 600 !important;
}

.newpopuptext-swal {
    color: black !important;
    line-height: 1.6 !important;
    margin-bottom: 5px !important;
    text-align: center !important;
    font-size: 16px !important;
    border-top: 1px solid #e5e5e5 !important;
    padding: 10px !important;
}

.newpopupbuttons-swal {
    display: flex !important;
    gap: 12px !important;
    justify-content: center !important;
}

.newpopupbuttonprimary-swal {
    color: white !important;
    border: none !important;
    padding: 14px 28px !important;
    border-radius: 8px !important;
    font-weight: 600 !important;
    cursor: pointer !important;
    transition: all 0.3s ease !important;
    font-size: 14px !important;
}

.newpopupbuttonsecondary-swal {
    background: #001f3f !important;
    color: white !important;
    border: none !important;
    padding: 14px 28px !important;
    border-radius: 8px !important;
    font-weight: 600 !important;
    cursor: pointer !important;
    transition: all 0.3s ease !important;
    font-size: 14px !important;
}

.newpopupbuttonprimary-swal:hover {
    transform: translateY(-2px) !important;
    box-shadow: none !important;
}

.newpopupbuttonsecondary-swal:hover {
    background: #001f3f !important;
    transform: translateY(-2px) !important;
}

.newpopupclose-swal {
    position: absolute !important;
    top: 15px !important;
    right: 15px !important;
    background: none !important;
    border: none !important;
    font-size: 20px !important;
    cursor: pointer !important;
    color: #bdc3c7 !important;
    transition: all 0.3s ease !important;
    width: 30px !important;
    height: 30px !important;
    border-radius: 50% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

    .newpopupclose-swal:hover {
        color: #7f8c8d !important;
        transform: scale(1.1) !important;
        background: #f8f9fa !important;
    }

/* SUCCESS POPUP */
.newpopupsuccess-swal::before {
    content: '' !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    height: 4px !important;
    background: linear-gradient(90deg, #27ae60, #2ecc71) !important;
}

.newpopupsuccess-swal .newpopupicon-swal {
    background: var(--theme__color1) !important;
}

.newpopupsuccess-swal .newpopupbuttonprimary-swal {
    background: var(--theme__color1) !important;
    box-shadow: none !important;
}

    .newpopupsuccess-swal .newpopupbuttonprimary-swal:hover {
        box-shadow: none !important;
    }
/* WARNING POPUP */
.newpopupwarning-swal::before {
    content: '' !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    height: 4px !important;
    background: linear-gradient(90deg, #f39c12, #e67e22) !important;
}

.newpopupwarning-swal .newpopupicon-swal {
    background: var(--theme__color1) !important;
}

.newpopupwarning-swal .newpopupbuttonprimary-swal {
    background: var(--theme__color1) !important;
    box-shadow: none !important;
}

    .newpopupwarning-swal .newpopupbuttonprimary-swal:hover {
        box-shadow: none !important;
    }

/* ERROR POPUP */
.newpopuperror-swal::before {
    content: '' !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    height: 4px !important;
    background: linear-gradient(90deg, #e74c3c, #c0392b) !important;
}

.newpopuperror-swal .newpopupicon-swal {
    background: var(--theme__color1) !important;
}

.newpopuperror-swal .newpopupbuttonprimary-swal {
    background: var(--theme__color1) !important;
    box-shadow: none !important;
}

    .newpopuperror-swal .newpopupbuttonprimary-swal:hover {
        box-shadow: none !important;
    }

/*END POPUP DESIGN FOR SWAL*/