﻿

/*===============Global Classes==============*/
.container-fluid {
    padding: 0px 44px !important;
}

.content {
    padding: 28px 0px !important;
}

.grid-wapper {
    margin-top: 30px;
}

.gutter-b {
    margin-bottom: 0px !important;
}

.card_border {
    border: 1px solid transparent;
}

.payment-history .nav.nav-tabs.nav-tabs-line .nav-link {
    padding: 0px 0px 10px 0px !important;
}

.attechment_page .nav .nav-link, .pending_approval_page .nav .nav-link {
    padding: 0px 0px 10px 0px !important;
    margin: 0 2rem 0 0;
}

.system_setting_page .nav .nav-link {
    padding: 0px 0px 10px 0px !important;
    margin: 0 3rem 0 0;
}

.attechment_page .grid_wapper_top {
    margin-top: 30px;
}
/*New Login css changes*/
.main-login-page {
    height: 100vh;
    background: url(../images/login-banner-img.png);
    display: flex;
    justify-content: end;
    align-items: center;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    overflow: hidden;
}

    .main-login-page .login {
        height: 100%;
        padding: 0px 192px;
        display: flex;
        align-items: center;
        background: 7px -13px rgb(0, 0, 0, 24%);
        backdrop-filter: blur(3px);
    }

    .main-login-page .login-aside {
        width: 352px !important;
        border-radius: 176px 176px 10px 10px;
        padding: 33px 44px !important;
    }

    .main-login-page .form-group label {
        color: #474747;
        opacity: .5;
    }

    .main-login-page .form-group input {
        color: #474747 !important;
        border-radius: 0;
    }

    .main-login-page .sign-btn {
        font-size: 16px;
        min-height: 48px;
        background: #212121 !important;
    }

        .main-login-page .sign-btn:hover {
            background: #363535 !important;
        }

/*===============aside Bar css changes==============*/
.aside-menu .menu-nav > .menu-item.menu-item-active > .menu-link {
    background-color: #212121 !important;
}
/*================== Dashboard page Css========================= */
/*.dashboard {
    padding: 28px 59px 22px;
}*/
.dashboard .mt-11 {
    margin-top: 30px !important;
}

.dashboard .slot-info {
    padding: 10px 30px;
    background: #fff;
    border-radius: 8px;
}

.dashboard .slot-info {
    padding: 10px 30px;
    background: #fff;
    border-radius: 4px;
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-height: 73px;
    box-shadow: 0px 5px 30px rgb(188,188,188,16%);
}

    .dashboard .slot-info:before {
        content: "";
        width: 4px;
        height: 42px;
        background: #212121;
        position: absolute;
        left: 1px;
        border-radius: 0px 16px 16px 0px;
    }

.dashboard .summary-box {
    background: #fff;
    padding: 25px 25px 37px;
    border-radius: 4px;
    max-height: 296px;
}

    .dashboard .summary-box h2 {
        font-size: 16px;
        font-weight: 500;
        margin-bottom: 17px;
    }

    .dashboard .summary-box p {
        font-size: 12px;
        font-weight: 500;
        margin-bottom: 0;
        color: #6C6C6C;
    }

    .dashboard .summary-box .total-results h2 {
        margin-bottom: 8px;
    }

    .dashboard .summary-box .total-results {
        background: rgb(44,104,72,4%);
        border-radius: 13px;
        padding: 40px 40px;
        display: flex;
        flex-direction: column;
        align-items: center;
        margin-bottom: 26px;
    }

.dashboard .calendar-view-list {
    height: 100%;
    background: #fff;
    border-radius: 4px;
}

.dashboard .grid-box {
    /* height: 360px;*/
    background: #fff;
    border-radius: 4px;
    padding-bottom: 0;
}

.dashboard .header-result {
    display: flex;
    background: rgb(44, 104, 72, 4%);
    grid-gap: 11px;
    padding: 8px 25px;
    border-radius: 24px;
    align-items: center;
}

    .dashboard .header-result label {
        margin-bottom: 0;
        font-size: 12px;
        font-weight: 500;
    }

    .dashboard .header-result h2 {
        font-size: 14px;
        font-weight: 700;
        margin-bottom: 0;
    }

.dashboard .grid-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 12px 20px;
}

.dashboard .grid-table {
    height: 300px;
    overflow: auto;
}

    .dashboard .grid-table td {
        max-width: 62px;
        text-overflow: ellipsis;
        white-space: nowrap;
        overflow: hidden;
    }

    .dashboard .grid-table td, .dashboard .grid-table th {
        vertical-align: middle;
        text-align: center;
    }

    .dashboard .grid-table .table thead {
        position: sticky;
        top: 0;
    }

        .dashboard .grid-table .table thead th {
            font-weight: 500;
            background: #F5F5F5;
        }

        .dashboard .grid-table .table thead th, .grid-table .table tbody td {
            font-size: 10px !important;
            vertical-align: middle;
            border-bottom: 1px solid #E4E4E4;
        }

        .dashboard .grid-table .table thead th {
            padding: 10px 7px !important
        }

    .dashboard .grid-table .table tbody td {
        line-height: 1;
        padding: 8px;
    }

.dashboard .calendar-list .list-header {
    display: flex;
    justify-content: space-between;
    padding: 8px 24px;
    border-bottom: 1px solid #DBDBDB;
}

    .dashboard .calendar-list .list-header h4 {
        margin-bottom: 0;
        font-size: 12px !important;
        color: #ABABAB;
    }

.dashboard .list {
    display: flex;
    justify-content: space-between;
    padding: 10px 20px;
    border-bottom: 1px solid #ddd;
}

.calendar-view-list .calendar-list {
    height: 276px;
    overflow: auto;
}

.dashboard .calendar-box {
    min-height: 45%;
}

.total-deathbox {
    background-color: #FEC588;
    width: 88%;
    margin: auto;
    padding: 11px 20px;
    text-align: center;
}

.dashboard .column-width {
    min-width: 192px;
}
/*============== dashboard calender box css============================*/
/*calender box css*/
.dashboard .calendar-box {
    padding: 20px;
}

    .dashboard .calendar-box .ui-datepicker {
        width: 100%;
        height: 300px;
    }

    .dashboard .calendar-box .ui-state-default, .dashboard .ui-widget-content .ui-state-default,
    .dashboard .calendar-box .ui-widget-header .ui-state-default {
        line-height: 28px !important;
    }

/*======================Slot layout Csss==================================*/
.slot-results-grid, .slot-box-info {
    max-height: calc(100vh - 360px);
    overflow: auto;
}
/*.slot-layout {
    padding: 38px 36px;
}*/
.slot-layout .slot-total-value .value-total {
    background: #fff;
    padding: 8px 20px;
    border-radius: 4px;
}

.slot-layout .slot-total-value .badge-text {
    background: #e5f9e5;
    color: #11cf11;
    padding: 2px 16px;
    border-radius: 24px;
    font-size: 10px;
}

.slot-layout .btn.btn-default {
    background: #fff !important;
    border: none;
    color: #474747;
}

.slot-layout .btn-group.select-btn {
    position: relative;
    display: flex;
    align-items: center;
}

    .slot-layout .btn-group.select-btn:after {
        content: "";
        position: absolute;
        width: 1px;
        height: 24px;
        background: #ddd;
        right: 2px;
    }

.slot-layout .create-new {
    min-width: 140px;
    background: #212121;
    border-radius: 4px !important;
    border: 1px solid #212121;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
}

.slot-layout .slot-book-box {
    width: 110px;
    min-height: 46px;
    padding: 5px 10px;
    display: flex;
    align-items: center;
    position: relative;
    overflow: hidden;
}
.slot-layout .open-balance-plot {
    background: linear-gradient(to right, #000000 50%, #800080 50%);
}

    .slot-layout .open-balance-plot span {
        color: #ffffff;
    }

.flag-color:after {
    content: "";
    width: 18px;
    height: 24px;
    position: absolute;
    background: red;
    left: -8px;
    top: -11px;
    transform: rotate(46deg);
}

.slot-border {
    border: 2px solid #000 !important;
}

.slot-results .both-child .child-border1 {
    border: 2px solid #000;
}

.slot-book-box .slot-results .main-border-plot {
    position: absolute;
    inset: 0;
    padding: 10px;
    border: 2px solid #000;
}

.slot-results .both-child .child-border2 {
    border: 2px solid #000;
}

.slot-layout .bg-color-blue {
    background-color: #387CF4;
}

.slot-layout .bg-color-green {
    background-color: #28a745;
}

    .slot-layout .bg-color-green span {
        color: #ffffff;
    }

.slot-layout .designatedblue {
    cursor: pointer;
    background: #c4d2ed;
    color: #000;
    border: 0;
}

.slot-book-box:has(.child-plot) {
    padding: 0;
    min-height: 0;
}

.slot-layout .bg-color-light-green {
    background-color: #000000;
    color: #ffffff;
}

    .slot-layout .bg-color-light-green span {
        color: #ffffff;
    }

.slot-layout .bg-color-occupied-black {
    background-color: #000000 !important;
}

    .slot-layout .bg-color-occupied-black span:nth-child(2) {
        color: #ffffff;
    }

.slot-layout .bg-color-yellow {
    background-color: #FFD700;
}

.slot-layout .bg-color-aqua {
    background-color: #14d9bb;
}

.slot-layout .bg-color-red {
    background-color: #c20000;
}

    .slot-layout .bg-color-red span {
        color: #ffffff;
    }

.slot-layout .slot-results {
    display: flex;
    align-items: center;
    grid-gap: 8px;
    font-size: 14px;
    color: #000;
    width: 100%;
    height: 100%;
}

.slot-book .child-plot {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: start;
    justify-content: center;
    position: relative;
    overflow: hidden;
}

.slot-book .child-plot-1 {
    width: 100%;
    padding: 2px 10px;
    height: 100%;
    position: relative;
}
/*.child-plot.child-border .child-plot-1 {
    border: 2px solid #000;
    border-bottom: 1px solid #000;
}
.child-plot.child-border .child-plot-2 {
    border: 2px solid #000;
    border-top: 1px solid #000;
}*/

.slot-book .child-plot-2 {
    width: 100%;
    padding: 2px 10px;
    height: 100%;
    position: relative;
}

.child-plot .slot-results {
    grid-gap: 6px;
}

.slot-book .child-plot-1.black {
    background: #000;
    color: #fff;
}

.slot-book .child-plot-1.white {
    background: #28a745;
    color: #ffffff;
    border: none !important;
}

.slot-book .child-plot-1.yellow {
    background: #FFD700;
    color: #000;
}

.slot-book .child-plot-1.red {
    background: #c20000;
    color: #ffffff;
}

.slot-book .child-plot-1.navy {
    background: #c4d2ed;
}

.slot-book .child-plot-1.lemon {
    background: #ebdaa0;
}

.slot-book .child-plot-1.open-balance {
    background: linear-gradient(to right, #000000 50%, #800080 50%);
    color: #fff;
}

.slot-book .child-plot-2.black {
    background: #000;
    color: #fff;
}

.slot-book .child-plot-2.white {
    background: #28a745;
    color: #ffffff;
}

.slot-book .child-plot-2.yellow {
    background: #FFD700;
    color: #000;
}

.slot-book .child-plot-2.red {
    background: #c20000;
    color: #ffffff;
}

.slot-book .child-plot-2.navy {
    background: #c4d2ed;
}

.slot-book .child-plot-2.lemon {
    background: #ebdaa0;
}

.slot-book .child-plot-2.open-balance {
    background: linear-gradient(to right, #000000 50%, #800080 50%);
    color: #fff;
}

/*=================Slot gender icon============================*/
/*.gender-icon {
    width: 20px;
    height: 20px;
    border-radius: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
}*/
.child-plot .gender-icon {
    width: 12px;
    height: 12px;
}

.slot-results .child-plot {
    font-size: 12px;
}

.both-child {
    position: relative;
    height: 100%;
    display: flex;
    flex-direction: column;
}

    .both-child .child-plot .child-flag:after {
        content: "";
        width: 17px;
        height: 24px;
        position: absolute;
        background: red;
        left: -9px;
        top: -12px;
        transform: rotate(46deg);
        z-index: 1;
    }

.women {
    background: #8853DD;
    color: #e79464;
}

.women-icon {
    color: #d9ab91;
}

.man-icon {
    /*background: #E3C562;*/
    color: #60c6dd;
}

.slot-page-info .gender-icon {
    width: 26px;
    height: 26px;
    margin: auto;
}
/*=================Slot gender icon=======End=====================*/
.slot-layout .slot-book {
    display: grid;
    grid-template-columns: repeat(18, 1fr);
    grid-gap: 10px;
    row-gap: 10px;
}

.slot-layout .book-success {
    background-color: rgb(32,209,37,21%);
}

.slot-book-box .slot-results .single-plot {
    position: absolute;
    top: 5px;
    bottom: 0;
    right: 0;
    left: 12px;
    line-height: 37px;
}

.slot-layout .book-yellow {
    background: #F6FF90;
}

.slot-layout .book-pink {
    background: #FF9090;
}

.slot-layout .btn-clean.active {
    background: #212121 !important;
}

.slot-layout .btn-clean svg path {
    fill: #212121 !important;
}

.slot-layout .view-patern .btn-clean {
    height: 24px !important;
    width: 24px !important;
}

.slot-layout .view-patern {
    display: flex;
    justify-content: end;
    align-items: center;
    grid-gap: 10px;
}

.slot-layout .card-label {
    font-size: 14px;
}

.slot-layout .select-btn .dropdown-toggle.btn:after {
    color: #CCCCCC;
    font-size: 12px;
    margin-left: 30px
}

.slot-layout .slot-book-dropdown .dropdown-toggle.btn:after {
    color: #CCCCCC;
    font-size: 16px;
}

.slot-layout .dropdown-item.active, .dropdown-item:active {
    color: #ffffff;
    text-decoration: none;
    background-color: #212121 !important;
}

.slot-layout .dropdown.slot-book-dropdown button {
    font-size: 16px;
    font-weight: 500;
}

.slot-layout .dropdown.slot-book-dropdown a {
    font-size: 14px;
}

/*=================Card box layout==================*/
.book-slot-card {
    display: flex;
    grid-gap: 12px;
    flex-wrap: wrap;
}

    .book-slot-card .card-box .card-info-details {
        padding: 11px;
    }

    .book-slot-card .card-box .btn-clean svg path {
        fill: none !important;
    }

    .book-slot-card .card-box .card-user-icon {
        width: 26px;
        height: 26px;
        background: #E3C562;
        margin: auto;
        border-radius: 24px;
        margin-bottom: 6px;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .book-slot-card .card-box .women-icon {
        background: #8853DD !important;
    }

    .book-slot-card .card-box .slot-number span:first-child {
        background: rgb(44, 104, 72, 10%);
        padding: 3px 12px;
        border-radius: 24px;
        display: inline-block;
        font-size: 10px;
    }

    .book-slot-card .card.card-custom.gutter-b.card-stretch.card-box {
        width: 170px;
        height: 187px;
        margin-bottom: 0px
    }

    .book-slot-card .card-box .card-body {
        padding: 0px;
    }

    .book-slot-card .card-box .card-user-info {
        font-size: 12px;
        display: flex;
        flex-direction: column;
        grid-gap: 4px;
    }

    .book-slot-card .card-box .location-info {
        display: flex;
        line-height: 15px;
    }

    .book-slot-card .card-box .card-footer {
        font-size: 10px;
        color: #474747;
    }

    .book-slot-card .card-box .slot-available span {
        background: #DCFAE9;
        padding: 2px 12px;
        border-radius: 24px;
        font-size: 10px;
        color: #27AE60;
    }

    .book-slot-card .card-box .slot-number p {
        color: #0D0D0D;
    }

    .book-slot-card .card-box .slot-name-date span {
        color: #474747;
    }

    .book-slot-card .page-list .previous, .book-slot-card .page-list .next {
        border-radius: 100%;
        width: 40px;
        height: 40px;
        display: inline-block;
        line-height: 40px;
        text-align: center;
        background: rgb(44, 104, 72, 15%);
        cursor: pointer;
    }

    .book-slot-card .number-page.pagination {
        background: #EEEEEE;
        border-radius: 24px;
        margin: 0px 10px;
        cursor: pointer;
        overflow: hidden;
    }

        .book-slot-card .number-page.pagination button {
            height: 40px;
            width: 40px;
            display: inline-block;
            line-height: 40px;
            text-align: center;
            font-size: 16px;
            color: #212121;
            outline: none;
            border: none;
        }

            .book-slot-card .number-page.pagination button.active {
                background: #D9E2DD;
                border-radius: 100%;
                font-weight: 700;
            }

/*============================Create New Slot popup css=============================*/
.account-form4 .modal-dialog {
    min-width: 558px;
    max-width: 558px;
}

.create-new_slot-popup .dropdown button {
    background: none !important;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.new-burial .calendar-icon {
    position: absolute;
    top: 50%;
    transform: translate(0%, -50%);
    right: 14px;
}

.create-new_slot-popup .dropdown-toggle.btn:after {
    color: #707070;
    font-size: 10px;
}

.new-burial input.form-control {
    font-size: 10px;
}

.new-burial .footer-popup-action {
    width: 100%;
    padding: 26px 10px 20px;
    display: flex;
    justify-content: space-between;
}

.new-burial .upload-image {
    width: 49px;
    height: 49px;
    background-color: #eee;
    overflow: hidden;
    border-radius: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}

/*======================Account Page Css==================================*/
.btn-outline-success {
    color: #212121 !important;
    border-color: #212121 !important;
}

.btn.btn-outline-success:hover:not(.btn-text):not(:disabled):not(.disabled) {
    color: #fff !important;
    background-color: #212121;
}

.grid-wapper .ag-header-cell-text {
    font-size: 12px !important;
    font-weight: 400 !important;
    color: #888888;
    font-family: Poppins;
}
/*.grid-wapper .ag-header-row-floating-filter {
    display: none !important;
}*/
.grid-wapper .ag-theme-alpine .ag-header-cell-resize {
    display: none !important;
}

.grid-wapper .ag-theme-alpine .ag-root-wrapper {
    border: 0px solid #c6ccd5 !important;
}

.grid-wapper .ag-header {
    height: 50px !important;
    min-height: 50px !important;
}

.grid-wapper .ag-header {
    border-top: 1px solid #E4E4E4 !important;
    border-bottom: 1px solid #E4E4E4 !important;
}

.cmtCardTitle a {
    color: #212121;
    font-size: 24px;
    font-weight: 500;
}

.cmtCardTitle span {
    color: #000;
    font-size: 12px;
    font-weight: 400;
}

.cmtCardTitle {
    padding-left: 20px;
}

.aside-menu .menu-nav > .menu-item.menu-item-active > .menu-heading, .aside-menu .menu-nav > .menu-item.menu-item-active > .menu-link {
    background-color: #212121 !important;
}

#dropdownMenuButton #Icon_feather-filter {
    fill: #fff;
}

.grid-wapper th {
    font-size: 12px !important;
    font-weight: 400 !important;
    color: #888888;
    font-family: Poppins;
}
/*======================Model Assign Css==================================*/
.horizontal hr {
    color: #CCCCCC;
    border: 1px solid;
    margin-left: -45px;
}

.slot-available {
    margin-bottom: 10px;
}

    .slot-available span {
        border: 1px solid #E4E4E4;
        padding: 8px 15px 8px 15px;
        border-radius: 4px;
    }

        .slot-available span:hover {
            background-color: #212121;
            color: #fff;
        }

.want h4 {
    font-size: 18px;
    font-family: poppins;
    font-weight: 400;
    color: #2A2A2A;
}

.want {
    margin: 40px 0px 82px 0px;
}

.two-modal .modal-dialog {
    display: flex !important;
    flex-direction: row !important;
    grid-gap: 50px !important;
}

.image {
    margin: 50px 0px 0px 0px;
}

.modal .modal-header .modal-title {
    color: #474747 !important;
    font-size: 18px !important;
    font-weight: 400 !important;
}

.btn.btn-default {
    color: #212121 !important;
    background-color: transparent !important;
    border-color: transparent !important;
    font-size: 12px !important;
}

.btn.btn-success {
    background-color: #212121 !important;
}

.account-layout .dropdown-menu.show {
    width: 20% !important;
    padding: 30px;
}

.padd {
    padding: 0px 8px 0px 0px;
}

.padd2 {
    padding: 0px;
}

.input-group-text {
    background-color: #fff !important;
}

.error {
    margin: 45px 0px 24px 0px;
}

.wrong h4 {
    font-size: 18px;
    font-weight: 400;
    color: #2A2A2A;
    margin-bottom: 10px;
}

.wrong p {
    font-size: 14px;
    font-weight: 300;
    color: #2A2A2A;
    line-height: 24px;
    margin-bottom: 30px;
}

.fontstyle label {
    font-size: 12px;
    font-weight: 400;
    color: #2A2A2A;
}

.fontstyle input {
    height: 36px;
    font-size: 12px;
}

.manage-size {
    font-size: 12px;
    width: 72%;
}

#accountAssignSlotModalTitle {
    font-size: 14px !important;
    font-weight: 500 !important;
    color: #474747 !important;
}

.assign-model {
    margin: 70px 0px 20px 0px;
}

.assign-btn {
    width: 42%;
    font-size: 12px;
}

.select2-container {
    display: block !important;
}

.btn-success {
    font-size: 12px !important;
}

#divAccountReplaceModalBody label {
    font-size: 12px !important;
    font-weight: 400 !important;
}

#newText {
    margin-bottom: 40px;
}

.account-layout .email-contact {
    display: flex;
    flex-direction: column;
    line-height: 1.3;
}

.account-layout .grid-mail-info {
    color: #A1A1A1;
}
/*======================Model cahrges page model Css==================================*/
.global_ul_top {
    margin-top: 30px;
}

.table-width {
    width: 50% !important;
}

.tab-payment {
    margin-right: 20px;
}

    .tab-payment a {
        font-size: 14px;
        font-weight: 400;
        color: #212121;
    }

.nav-tabs {
    border-bottom: 0px !important;
}

.charges-tab .active {
    border-bottom: 1px solid #212121;
}

.charges-tab {
    margin: 30px 0px;
}

.padd3 {
    display: flex;
    align-items: center;
}

.padd4 {
    display: flex;
    align-items: center;
}

.padd3 label {
    padding-right: 6px !important;
}

.padd4 label {
    padding-right: 6px !important;
}

#oneTimePayment {
    margin: 35px 0px 50px 0px;
}

.payment-space {
    padding-top: 15px;
}

.payment-method {
    font-size: 14px;
    font-weight: 400;
    color: #212121;
}

/*======================Payment Page Css==================================*/


.nav-link.active {
    border-bottom: 2px solid #212121 !important;
    color: #212121 !important;
}

.nav-link:hover {
    color: #212121 !important;
}




.cmtCardTitleDeposit {
    padding-left: 20px;
}

    .cmtCardTitleDeposit a {
        color: #212121;
        font-size: 16px;
        font-weight: 500;
    }

.payment-number {
    color: #212121;
    font-size: 16px;
    font-weight: 500;
}

.create-deposit {
    color: #fff;
    font-size: 12px;
    font-weight: 400;
}


.nav.nav-tabs.nav-tabs-line .nav-link:hover {
    color: #212121 !important;
    border-color: #212121 !important;
}



/*======================Service Page Css==================================*/
.round-img {
    padding: 14px 13px 18px 18px;
    background: #E1E1E1;
    border-radius: 50%;
}

.service-img-upload .image-upload {
    margin-left: 10px;
}

.create-popup {
    margin: 60px 0px 0px 0px;
}

.check-payment-radio input:checked ~ span {
    background-color: #212121 !important;
}

.checkbox > span {
    border: 1px solid #E4E4E4 !important;
    background: #fff !important;
}

.round-img-back {
    padding: 20px 6px 26px 10px;
    border-radius: 50%;
    background: #00000036;
}

    .round-img-back img {
        object-fit: cover;
        opacity: 0.4;
    }

.edit_on_image {
    position: absolute;
    left: 40px;
    top: 14px;
}

.sparate-wroung {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.popup-button-style {
}

.service-img-upload {
    display: flex;
    grid-gap: 20px;
    align-items: center;
    margin-bottom: 19px;
}

    .service-img-upload label {
        margin-bottom: 0;
    }

    .service-img-upload .image-input label {
        height: 49px !important;
        width: 49px !important;
        position: relative !important;
        right: 0px !important;
        top: 0px !important;
        background: #E1E1E1;
        border-color: #E1E1E1 !important;
        box-shadow: none !important;
        overflow: hidden;
    }

        .service-img-upload .image-input label:hover:before {
            content: "";
            background: rgb(0, 0, 0, 26%);
            width: 100%;
            top: 0;
            bottom: 0;
            position: absolute;
        }

    .service-img-upload .gallary-upload {
        position: absolute;
        color: #A1A1A1;
    }

    .service-img-upload .image-input label:hover .gallary-upload {
        color: #fff;
    }

/*======================Request Page Css==================================*/
.request-icon {
    background-color: #20D125;
    border-radius: 100%;
    width: 60px;
    height: 60px;
    display: flex;
    justify-content: center;
    align-items: center
}

.request-payment-checkbox > span {
    border: 1px solid #A1A1A1 !important;
    background-color: transparent !important;
}

.image-around {
    margin: 0px 20px;
}

.request-page-content {
    background-color: #F2F8FF;
    padding: 14px 10px 14px 30px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    border-radius: 10px;
}

.request-payment-checkbox {
    color: #000000;
    font-size: 12px;
    font-weight: 500;
}

.image-around {
    color: #393939;
    font-size: 12px;
    font-weight: 600;
}

.request-icon-color {
    background-color: #F5F5F5 !important;
}

.request-page-color {
    background-color: #F5F5F5 !important;
}

.request-tab-panel {
    margin-top: 20px;
}

.color-check {
    color: #A1A1A1;
}

.nav.nav-pills.nav-success .nav-link.active {
    background-color: #212121 !important;
}

#tab_link_accountchecklist.nav-text:hover {
    color: #fff !important;
}

.request-card-header {
    background-color: #2c68481f !important;
}

.checkbox.checkbox-success > input:checked ~ span {
    background: #000 !important;
}
/*=====================request tab popup Css located at accountdetailrequestpage==================================*/
.request-main {
    margin-top: 50px;
}

.request-tab-imgcontent {
    display: flex;
}

.roderick-pen {
    display: flex;
    margin-left: 15px;
    align-items: center;
    margin-top: 5px;
}

    .roderick-pen h6 {
        font-size: 14px;
        font-weight: 500;
        color: #0D0D0D;
    }

    .roderick-pen p {
        background: #FEC588;
        border-radius: 15px;
        width: 75px;
        text-align: center;
        margin-left: 50px;
        padding: 5px;
        margin-bottom: 0px;
    }

.request-tab-info {
    margin-left: 10px;
}

.font-size-ver {
    font-size: 12px;
    font-weight: 400;
    color: #212121;
}

.heading-period {
    font-size: 14px;
    font-weight: 500;
    color: #212121;
}

.request-note {
    background: #F5F5F5;
    padding: 15px;
    border-radius: 8px;
}

.label.label-success {
    color: #ffffff;
    background-color: #212121 !important;
}

.btn.btn-outline-success i {
    color: #212121 !important;
}

/*.details_tab .btn.btn-outline-success:hover:not(.btn-text):not(:disabled):not(.disabled) i, .btn.btn-outline-success:focus:not(.btn-text) i {
    color: #212121;
}*/
.details_tab .btn.btn-outline.btn-outline-success:hover i {
    color: #fff !important;
}

.alert.alert-secondary {
    background-color: #F5F5F5 !important;
    border-color: #F5F5F5 !important;
}
/*=====================Calendar Page Css==================================*/
.calender .fc-header-toolbar .fc-center {
    display: flex;
}

.calender .fc-unthemed .fc-toolbar .fc-button {
    background: transparent;
    border: 1px solid #000;
    border-radius: 50%;
    color: #000;
    padding: 0px 10px
}

    .calender .fc-unthemed .fc-toolbar .fc-button .fc-icon {
        color: #000;
    }

.calender .fc-unthemed .fc-toolbar h2 {
    font-size: 25px;
    font-weight: 600;
    text-transform: capitalize;
    margin: 4px 9px 0px 18px;
}

.calender .fc-right {
    display: none;
}

.calender .fc-toolbar.fc-header-toolbar {
    justify-content: center;
    margin: 20px 0px 45px 0px;
}

.aside_calender_header {
    border-bottom: 1px solid #CCCCCC;
}

.calender-checklist {
    margin-top: 20px;
}

.calender-checklist-back {
    background-color: #2c68480d;
    padding: 14px;
    border-radius: 4px;
}

.calender-checklist-btn {
    width: 100%;
    border-radius: 4px;
}

.calender-main {
    display: flex;
    grid-gap: 20px;
}

.aside_calender_content {
    background-color: #fff;
    padding: 25px;
    border-radius: 4px;
}

.right_calender_content {
    background-color: #fff;
    padding: 25px;
    border-radius: 4px;
}

.calender .fc-unthemed th.fc-day-header {
    border: 0px;
}

    .calender .fc-unthemed th.fc-day-header > a, .fc-unthemed th.fc-day-header > span {
        color: #696969;
    }

.fc-day-number {
    color: #696969;
}

.calender .fc-unthemed td.fc-today {
    color: #2c684824 !important;
}

.calender .fc-scroller.fc-day-grid-container {
    height: 615px !important;
}

/*=====================attechment Page Css==================================*/
.attechment-color {
    background-color: #fff;
}

.attechment-search input {
    border: 0px !important;
}

.search-icon-box {
    background: #2c684824 !important;
    border-radius: 4px;
    margin: 5px;
}

.btn.btn-outline-success:not(:disabled):not(.disabled).active {
    background: #212121 !important;
    color: #fff !important;
}

.search-box-border {
    border-right: 1px solid #E2E2E2;
}

.attechment-color .btn-group {
    padding: 0px 0px;
}

#accountDescriptionsContent, #userReportsContent, #contactMessagesContent {
    margin-top: 30px;
}

.button-top {
    margin-top: 40px;
}

.attechment_page .grid-wapper .ag-theme-alpine .ag-root-wrapper {
    height: calc(100% - 36px);
}
/*==================== account module/create account/Account css ====================*/
.accountadd-modal {
    font-family: 'Poppins', sans-serif;
}

    .accountadd-modal .modal-dialog .modalContentAccount {
        min-width: 580px;
        max-width: 558px;
    }

.modalContentAccount .form-group-account {
    margin-top: 18px;
}

    .modalContentAccount .form-group-account .card-info, .accountadd-modal .form-group-account .card-info {
        display: flex;
        grid-gap: 9.5px;
        align-items: center;
    }

.row-account .card-info .checkbox-format {
    min-height: 74px;
}

.modalContentAccount .text-checkbox {
    font-size: 13px !important;
    font-weight: 500;
    margin-right: 15px;
    color: #888;
    font-family: poppins;
}

.modalContentAccount .label-check label {
    margin: 0px 0px 0px 6px !important;
}

.modalContentAccount .checkbox-round {
    width: 18px;
    height: 18px;
    background-color: white;
    border-radius: 50%;
    vertical-align: middle;
    border: 2px solid #ddd;
    appearance: none;
    -webkit-appearance: none;
    outline: none;
    cursor: pointer;
    margin-left: 0px !important;
}

.modalContentAccount .gap-checkbox {
    grid-gap: 16px;
}

    .modalContentAccount .gap-checkbox input[type=checkbox] {
        margin-left: 0px !important;
    }

.modalContentAccount .checkbox-format label, input {
    font-size: 12px !important;
    font-weight: 400;
    margin: 0px;
    color: #212121;
}

.modalContentAccount .checkbox-format .accountInfo {
    height: 36px !important;
}

.modalContentAccount .checkbox-format .accountInfotext {
    height: 60px !important;
}

.modalContentAccount .checkbox-format .field-validation-error {
    font-size: 10px;
}

.accountadd-modal .modal-footer {
    border: 0px;
}
/*======================create-account-payment ====================*/
.modalContentAccount .create-account-payment .total-payment {
    text-align: center;
    background: #E4E4E4;
    border-radius: 4px;
    padding: 8px 16px;
    margin-bottom: 30px;
}

    .modalContentAccount .create-account-payment .total-payment h2 {
        font-size: 14px;
        font-weight: 700;
    }

    .modalContentAccount .create-account-payment .total-payment span {
        font-size: 14px;
        font-weight: 500;
    }

.modalContentAccount .create-account-payment .form-group-account {
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.slot-row-column-table {
    max-height: 120px;
    overflow: auto;
    margin-bottom: 20px;
}

    .slot-row-column-table .table.table-bordered th {
        position: sticky;
        top: 0;
        background: #f4f2f2;
    }

    .slot-row-column-table .table.table-bordered th {
        border-top: 0px;
    }

    .slot-row-column-table .table.table-bordered {
        border-top: 0px;
    }

.account-form2 input::-webkit-outer-spin-button,
.account-form2 input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

.create-account-payment .slot-row-column .table thead tr {
    background: #fff;
    position: sticky;
    top: -1px;
    z-index: 9;
}

.create-account-payment .slot-row-column {
    max-height: 188px;
    overflow: auto;
    margin-bottom: 20px;
}
/*======================account info ====================*/
.modalContentAccount .form-group-account .ac-info h4 {
    font-size: 13px;
    font-weight: 600;
    color: #000;
    font-family: poppins;
    position: relative;
    overflow: hidden;
}



.modalContentAccount .form-group-account .account_info {
    font-size: 12px !important;
    font-weight: 400;
    color: #212121;
}

.modalContentAccount .form-group-account .account-row-top {
    margin-top: 50px;
}

.modalContentAccount .form-group-account .account_info {
    margin-top: 8px;
}

    .modalContentAccount .form-group-account .account_info span {
        color: gray;
    }

    .modalContentAccount .form-group-account .account_info p {
        font-weight: 600;
        white-space: nowrap;
        text-overflow: ellipsis;
        overflow: hidden;
    }

/*======================payment ====================*/
.modalContentAccount .star-card {
    display: flex;
    grid-gap: 15px;
    margin-top: 20px;
}

.modalContentAccount .rupay_debit_card {
    border: 1px solid #a1a1a140;
    border-radius: 10px;
    padding: 20px 20px 20px 20px
}

.modalContentAccount #delete {
    margin-left: 8px;
    margin-top: -6px;
}

.modalContentAccount .star-top {
    margin-top: 3px;
}

.modalContentAccount .round-icon-check i {
    font-size: 110px;
    color: #1DC44A;
}

.modalContentAccount .label-check span {
    width: 15px;
    height: 15px;
    border-radius: 50%;
    border: 1px solid #888888;
    padding-top: 2px;
    display: flex;
    align-items: center;
    justify-content: center;
}

    .modalContentAccount .label-check span i {
        font-size: 10px;
        color: #888888;
    }

.modalContentAccount .label-check.active .text-checkbox,
.modalContentAccount .label-check.active span i {
    color: #000000;
    display: block;
}

.modalContentAccount .label-check.active span {
    border: 1px solid #000000;
}

.modalContentAccount .label-check span i {
    font-size: 10px;
    color: #888888;
    display: none;
}

.modalContentAccount .label-check.success .text-checkbox {
    color: #1DC44A !important;
}

.modalContentAccount .payment-error .text-checkbox {
    color: red !important;
}

.modalContentAccount .label-check.success span i {
    color: #ffffff;
    display: block;
}

.modalContentAccount .payment-error span i {
    color: #ffffff !important;
    display: block;
}

.modalContentAccount .label-check.success span {
    border: 1px solid #1DC44A !important;
    background: #1DC44A;
}

.modalContentAccount .payment-error span {
    border: 1px solid red !important;
    background: red;
}

.round-icon-cross i {
    font-size: 110px;
    color: red;
}

.modalContentAccount .account-form2, .modalContentAccount .account-form3, .modalContentAccount .account-form4, .modalContentAccount .account-form5, .modalContentAccount .card-custom, .modalContentAccount h6 {
    display: none;
}
/*    .modalContentAccount .model-body-wrapper {
        min-height: 450px;
    }*/

.slot-row-column-value {
    display: flex;
    flex-direction: column;
    grid-gap: 6px;
    max-height: 155px;
    overflow: auto;
}

.slot-row-column .slot-row-column-select {
    display: flex;
    grid-gap: 10px;
    align-items: center;
}

    .slot-row-column .slot-row-column-select .form-select {
        flex-basis: 30%;
    }

    .slot-row-column .slot-row-column-select select.form-control {
        padding: 4px 10px !important;
        height: 28px;
    }

    .slot-row-column .slot-row-column-select label {
        margin-bottom: 3px;
    }

.slot-row-column .slot-row-column-box {
    max-height: 202px;
    overflow: auto;
}

.slot-data {
    display: flex;
    grid-gap: 6px;
    padding: 4px 10px;
    border: 1px solid #ddd;
    border-radius: 4px;
    text-align: center;
}

.slot-data-box {
    display: flex;
    flex-direction: column;
    grid-gap: 4px;
    /*    max-height: 234px;
    overflow: auto;*/
}

.slot-data .slot-number {
    flex-basis: 10%;
}

.slot-data .slot-column, .slot-data .slot-row {
    flex-basis: 20%;
}

.slot-data .slot-designated {
    flex-basis: 30%;
}

.slot-data .designated-plot-setting {
    flex-basis: 30%;
}

.slot-data .slot-designated span {
    background-color: #c4d2ed;
    max-width: 110px;
    border-radius: 24px;
    padding: 1px 10px;
    text-align: center;
}

.slot-data .designated-plot-setting span {
    background-color: #f37f85;
    max-width: 110px;
    border-radius: 24px;
    padding: 1px 10px;
    text-align: center;
}

.slot-data .slot-reserved span {
    background-color: #FFD700;
    max-width: 110px;
    border-radius: 24px;
    padding: 1px 10px;
    text-align: center;
}


.slot-data .slot-row {
    display: flex;
    grid-gap: 8px;
    /*font-weight: 500;*/
}

    .slot-data .slot-row span:first-child, .slot-column span:first-child {
        color: #a5a5a5;
    }
/* Checkbox override Css
================================================ */
.slot-row-column .check input[type=checkbox] {
    position: relative;
    border: 1px solid #0D0C0A;
    border-radius: 4px;
    background: none;
    cursor: pointer;
    line-height: 0;
    margin: 0 .6em 0 0;
    outline: 0;
    padding: 0 !important;
    vertical-align: text-top;
    height: 18px;
    width: 18px;
    -webkit-appearance: none;
}

slot-row-column .check input[type=checkbox]:hover {
    opacity: 1;
}

.slot-row-column .check input[type=checkbox]:checked {
    background-color: #0D0C0A;
    opacity: 1;
}

.slot-row-column .check input[type=checkbox]:before {
    content: '';
    position: absolute;
    right: 50%;
    top: 50%;
    width: 6px;
    height: 10px;
    border: solid #FFF;
    border-width: 0 2px 2px 0;
    margin: -1px -1px 0 -1px;
    transform: rotate(45deg) translate(-50%, -50%);
    z-index: 2;
}

.slot-row-column input:focus {
    box-shadow: none !important;
}

.slot-row-column input[type=number]::-webkit-outer-spin-button {
    -webkit-appearance: none;
}

.slot-row-column input[type=number]::-webkit-inner-spin-button, .slot-row-column
input[type=number]::-webkit-outer-spin-button {
    -webkit-appearance: none !important;
    margin: 0 !important;
}

/* Checkbox override Css

/*===========================Table Css==================*/
.slot-row-column .table th, .slot-row-column .table td {
    padding: 10px;
    font-size: 10px;
}

.slot-row-column .table th {
    width: 20%;
}

    .slot-row-column .table th:first-child {
        width: 7%;
    }

    .slot-row-column .table th:nth-child(2) {
        width: 5%;
    }

    .slot-row-column .table th:nth-child(3) {
        width: 22%;
    }

    .slot-row-column .table th:nth-child(4) {
        width: 23%;
    }

    .slot-row-column .table th:nth-child(5) {
        width: 13%;
    }

.slot-table-tbody tr td input {
    height: 28px;
}

.total-payment.mb-0 input {
    width: 35%;
    margin: auto;
    margin-top: 6px;
    text-align: center;
}

.slot-row-column .table td select {
    padding: 3px;
    height: 28px;
}

#myTable td, #myTable td {
    vertical-align: middle;
}


    #myTable td span {
        border-radius: 100%;
        width: 24px;
        height: 24px;
        display: flex;
        align-items: center;
        justify-content: center;
        /* padding: 4px;
        border-radius: 100%;*/
    }

#myTable tr td .male-icon {
    background: #60c6dd;
}

#myTable tr td .female-icon {
    background: #d9ab91;
}


/*===========================system page setting seccond tab css==================*/
.system_setting_page .double_grid {
    display: flex;
    grid-gap: 30px;
}

.system_setting_page .first_grid_header .first_wid {
    width: 40%;
}

.system_setting_page .first_grid_header .card-toolbar {
    width: 60%;
}

.system_setting_page .system_setting_border {
    border: 1px solid #C1C1C1;
    border-radius: 4px;
    background: #fff;
    padding: 1px;
}

.system_setting_page .search-title {
    padding: 0.5rem !important;
    padding-left: 0 !important;
}

.system_setting_page .first_grid_header {
    margin-bottom: 15px;
}

.system_setting_page .first_wid h6 {
    font-size: 18px;
    font-weight: 400;
}

.system_setting_page .double_grid .card {
    width: 50%;
}

.system_setting_page .table_of_name_spelling_tab .h6 h6 {
    font-size: 14px;
    font-weight: 400;
}

.system_setting_page .table_of_name_spelling_tab .h6 {
    margin-bottom: 15px;
}
/*===============Make Payment popup css==============*/
.make_payment_popup .amount_payment {
    font-size: 18px;
    font-weight: 500;
    padding-left: 10px;
}

.make_payment_popup .table-width {
    width: 50% !important;
}

.make_payment_popup .tab-payment {
    margin-right: 20px;
}

    .make_payment_popup .tab-payment a {
        font-size: 14px;
        font-weight: 400;
        color: #212121;
    }

.make_payment_popup .nav-tabs {
    border-bottom: 0px !important;
}

.make_payment_popup .charges-tab .active {
    border-bottom: 1px solid #212121;
}

.make_payment_popup .charges-tab {
    margin: 30px 0px;
}

.make_payment_popup .padd3 {
    display: flex;
    align-items: center;
}

.make_payment_popup .padd4 {
    display: flex;
    align-items: center;
    justify-content: end;
}

.make_payment_popup .padd3 label {
    padding-right: 8px !important;
}

.make_payment_popup .padd4 label {
    padding-right: 8px !important;
}

.make_payment_popup #oneTimePayment {
    margin: 35px 0px 50px 0px;
}

.make_payment_popup .payment-space {
    padding-top: 15px;
}

.make_payment_popup .payment-method {
    font-size: 14px;
    font-weight: 400;
    color: #212121;
}

.make_payment_popup .payment-type-option svg {
    width: 25px;
    height: 25px;
}

.make_payment_popup .monthly_currency {
    margin-top: 20px;
}


.make_payment_popup .clickable_div label {
    display: block;
    border: solid 2px #1DC44A;
    width: 200px;
    height: 40px;
    margin-top: 10px;
    color: #1DC44A;
    text-align: center;
    line-height: 40px;
}

/*hide input*/
.make_payment_popup .clickable_div input[type=checkbox] {
    display: none;
}

/*Add ✓ on checked before label*/

.make_payment_popup .clickable_div input:checked + label:before {
    content: "✓ ";
}

/*--Add styling on check --*/
.make_payment_popup .clickable_div input:checked + label {
    border: solid 2px purple;
    color: purple;
}
/*===========================tab_slot_row_column Css==================*/
.details_tab .tab_slot_row_column tr {
    text-align: left;
}

.details_tab .tab_slot_row_column .table-bordered {
    border: 0px !important;
}

    .details_tab .tab_slot_row_column .table-bordered td {
        border: 0px !important;
        font-size: 12px !important;
        font-weight: 400 !important;
        color: #888888;
        font-family: Poppins;
    }

    .details_tab .tab_slot_row_column .table-bordered .unique-color {
        color: #0073e9;
        cursor: pointer;
    }

    .details_tab .tab_slot_row_column .table-bordered tr {
        border-bottom: 2px solid #EBEDF3 !important;
    }

    .details_tab .tab_slot_row_column .table-bordered td {
        text-align: center;
        vertical-align: middle;
    }

    .details_tab .tab_slot_row_column .table-bordered th {
        border: 0px;
        text-align: center;
    }

.tab_slot_row_column .relation-col span {
    width: 84px;
}

.tab_slot_row_column .relation-col {
    display: flex;
    align-items: center;
    justify-content: center;
}

.details_tab .nav.nav-pills .nav-item {
    margin-right: 0px !important;
}

.details_tab .nav .nav-link {
    padding: 0.75rem 1.3rem !important;
}

.details_tab .status_sky {
    background: #B2D5FF;
}

.details_tab .status_green {
    background: #c7f0c2;
}

.details_tab .status_black {
    background: #000000;
}

.details_tab .status_#1DC44A {
    background: #A6F8CA;
}

.details_tab .status_orange {
    background: #FEC588;
}

.details_tab .status {
    padding: 0px 12px 3px 12px;
    border-radius: 20px;
}

.details_tab .nav.nav-pills.nav-success .nav-link:hover:not(.active) .nav-text {
    color: #212121 !important;
}

.details_tab .timeline.timeline-6:before {
    content: "";
    position: absolute;
    left: 28px;
    width: 2px;
    top: 0;
    bottom: 0;
    background-color: #B5B5B5;
}

.details_tab .request-icon svg {
    width: 28px;
    height: 28px;
}

.details_tab .card.card-custom > .card-body {
    padding: 0rem 2.25rem;
}

/*===========================edit account popup css==================*/


.ui-autocomplete {
    z-index: 2000 !important
}
/*===========================edit account popup css==================*/
.create_editaccount_form .edit_row {
    display: flex;
    align-items: end;
}

.edit_account_form .modal-content.modalContentAccount {
    max-width: 890px;
    min-width: 890px !important;
}

.edit_account_form .create_editaccount_form .form-group label, select, input {
    font-size: 12px !important;
    cursor: pointer;
    z-index: 1 !important;
}

.edit_account_form .create_editaccount_form .display_check {
    position: absolute;
    left: 192px;
    top: 7px;
}

.edit_account_form .create_editaccount_form .relation_contact_section {
    background: #2c68480f;
    padding: 15px 18px;
    border-radius: 12px;
    margin: 25px 0px 25px 0px;
}

.edit_account_form .create_editaccount_form .svg_in_table svg {
    width: 16px;
    height: 16px;
    margin-right: 5px;
}

.table-wrapper th {
    font-size: 12px !important;
    font-weight: 400 !important;
    color: #888888 !important;
}

.edit_tablerow_border td {
    border-top: 2px solid #EBEDF3 !important;
}

/*================================Slot-style-page======================================*/
.slot-style-page {
    margin-bottom: 24px;
}

    .slot-style-page .cmtCardTitle {
        padding-left: 0px !important;
    }

    .slot-style-page .card.card-custom.card-stretch.gutter-b {
        height: calc(100% - 0px) !important;
    }

    .slot-style-page .card-custom {
        border-radius: 4px;
        overflow: hidden;
    }
/*======================================add Slot Popup=======================================*/
.add-slot .slot-active {
    display: flex;
    grid-gap: 16px;
    align-items: baseline;
    margin-bottom: 24px;
}

.slot-row-section {
    margin-bottom: 24px;
    height: 56px;
}

.add-slot .radio {
    width: 13px;
    height: 13px;
    border: 1px solid #ddd;
    border-radius: 100%;
}

.add-slot .checkbox-custom, .radio-custom {
    opacity: 0;
    position: absolute;
}

.child-dropdown {
    width: 98px;
}

.add-slot .radio-custom-label.active {
    color: #474747;
}

.add-slot .checkbox-custom, .checkbox-custom-label, .radio-custom, .radio-custom-label {
    display: inline-block;
    vertical-align: middle;
    margin: 5px;
    cursor: pointer;
}

.add-slot .checkbox-custom-label, .radio-custom-label {
    position: relative;
    color: #888888;
    font-size: 12px;
    font-weight: 500;
}

.add-slot .checkbox-custom + .checkbox-custom-label:before, .radio-custom + .radio-custom-label:before {
    content: '';
    background: #fff;
    border: 2px solid #ddd;
    display: inline-block;
    vertical-align: middle;
    width: 17px;
    height: 17px;
    padding: 2px;
    margin-right: 10px;
    text-align: center;
}

.add-slot .checkbox-custom:checked + .checkbox-custom-label:before {
    background: rebeccapurple;
    box-shadow: inset 0px 0px 0px 4px #fff;
}

.add-slot .radio-custom + .radio-custom-label:before {
    border-radius: 50%;
}

.add-slot .radio-custom:checked + .radio-custom-label:before {
    background: #474747;
    border: 1px solid #474747;
    box-shadow: inset 0px 0px 0px 3px #fff;
}

.add-slot .radio-custom:checked label {
    color: #474747;
}

.add-slot .add-account {
    padding: 15px 20px;
    background: rgb(44, 104, 72, 4%);
    border-radius: 11px;
    margin-bottom: 28px;
}

    /*    .add-slot .add-account .form-group {
        display: flex;
        align-items: center;
        margin: auto;
        margin-bottom: 12px;
        width: 400px;
        margin-right: 57px;
    }*/
    .add-slot .add-account .form-group .addslot-account {
        white-space: nowrap;
        font-size: 12px;
        color: #212121;
        min-width: 88px;
        max-width: 88px;
        cursor: pointer;
    }

.add-slot .account-selected {
    display: flex;
    grid-gap: 7px;
    row-gap: 5px;
    flex-wrap: wrap;
    justify-content: end;
}

    .add-slot .account-selected span {
        border: 1px solid #ddd;
        padding: 4px 12px;
        border-radius: 4px;
    }

.add-slot .heading-title {
    display: flex;
    align-items: center;
    margin-bottom: 15px;
}

    .add-slot .heading-title h4 {
        min-width: 80px;
        margin-bottom: 0px;
        font-size: 12px;
        font-weight: 500;
    }

    .add-slot .heading-title span {
        height: 1px;
        display: block;
        background: #CECECE;
        width: 100%;
    }

.add-slot .account-slot-detail {
    display: flex;
    flex-direction: column;
    grid-gap: 8px;
    margin-bottom: 8px;
    max-height: 190px;
    overflow: auto;
    padding-right: 6px;
}

    .add-slot .account-slot-detail .add-slot-btn {
        margin-bottom: 37px;
    }

.add-slot .slot-detail-list {
    border: 1px solid #CECECE;
    display: flex;
    border-radius: 6px;
    padding: 5px 10px;
    text-align: center;
    align-items: center;
    justify-content: center;
}

    .add-slot .slot-detail-list .number {
        width: 10%;
    }

.gender-column {
    min-width: 60px;
}

.add-slot .slot-detail-list .booking-action {
    min-width: 118px;
}
    /*        .add-slot .slot-detail-list .booking-action .form-control {
            border: 1px solid #f37f85;
            color: #f37f85;
        }*/
    .add-slot .slot-detail-list .booking-action .form-control option {
        color: #000;
    }

.add-slot .slot-detail-list .count-number {
    min-width: 34px;
    text-align: center;
    margin-right: 5px;
}

.add-slot .slot-detail-list .row-number, .add-slot .slot-detail-list .column-number {
    width: 60px;
}

.add-slot .slot-detail-list .delete-number, .add-slot .slot-detail-list .delete-number {
    min-width: 70px;
}

/*.edit-slot-popup .count-row {
    width: 10% !important;
}
.edit-slot-popup .book-action {
    min-width: 30%;
}
.edit-slot-popup .section-action {
    min-width: 15%;
}
.edit-slot-popup .gender-column {
    min-width: 15%;
}
.edit-slot-popup .row-line {
    min-width: 15%;
}
.edit-slot-popup .column-line {
    min-width: 15%;
}
.edit-slot-popup .count-number {
    min-width: 10%;
    text-align: center;
}
.edit-slot-popup .booking-action {
    min-width: 30%;
}
.edit-slot-popup  .section-number {
    min-width: 15%;
}*/
.add-slot .slot-detail-list .row-number, .add-slot .slot-detail-list .column-number {
    display: flex;
    align-items: center;
    grid-gap: 5px;
    font-size: 12px;
    justify-content: center;
}

.add-slot .slot-detail-list .section-number, .add-slot .slot-detail-list .column-number {
    min-width: 60px;
}

.add-slot .slot-detail-list .gender-value {
    min-width: 60px;
}

.add-slot .add-slot-btn .btn {
    width: 100%;
    border: 1px solid #CECECE;
}

.add-slot .footer-action-btn {
    display: flex;
    justify-content: space-between;
    margin-top: 20px;
    align-items: center;
}

.add-slot .account-adress {
    font-size: 10px;
    color: #888888;
}

.add-slot .book-status {
    padding: 5px 16px;
    background: #B2D5FD;
    border-radius: 24px;
    color: #212121;
    height: 20px;
    width: 78px;
    font-size: 10px;
    margin: auto;
    display: flex;
    font-weight: 500;
    align-items: center;
    justify-content: center;
}

    .add-slot .book-status.sky {
        background: #B2D5FD;
    }

.book-status.orange {
    background: #FEC588;
}

.add-slot .book-status.designatedblue {
    background: #c4d2ed;
    border-color: #c4d2ed;
}

.book-status.lightgreen {
    background: #c7f0c2;
}

.book-status.red {
    background: #f37f85;
}

.add-slot .search-result-grid {
    position: relative;
}

    .add-slot .search-result-grid .search-result {
        background: #fff;
        width: 81.9%;
        margin-left: auto;
        position: absolute;
        z-index: 1;
        box-shadow: 0px 0px 1px;
        top: 3px;
        right: 0;
        max-height: 120px;
        overflow: auto;
    }

.add-slot .search-accounts.acccountslot .search-result {
    width: 78.5%;
}

.add-slot .search-result-grid .search-result .search-detail p {
    color: #000;
    font-size: 12px;
    margin-bottom: 0px;
}

.add-slot .search-result-grid .search-result .search-detail {
    padding: 5px 10px;
}

.add-slot .close-iconx {
    position: absolute;
    top: 50%;
    right: 9px;
    cursor: pointer;
    transform: translateY(-50%);
    z-index: 1;
}


.add-slot-header {
    font-size: 11px;
    font-weight: 600;
    text-align: center;
    padding: 5px 10px;
    position: sticky;
    top: 0;
    background: #fff;
}

.add-slot .add-slot-header span {
    display: inline-block;
}

.add-slot span.book-action {
    min-width: 118px;
}

.add-slot span.row-line {
    min-width: 60px;
}

.add-slot span.column-line {
    min-width: 60px;
}

.add-slot span.count-row {
    width: 34px;
    margin-right: 5px;
}

.add-slot span.edit-line {
    min-width: 80px;
}

    .add-slot span.edit-line span {
        margin-left: 20px;
    }

.add-slot span.section-action {
    min-width: 60px;
}

select.form-control.filled {
    color: #000000 !important;
    border: 1px solid #000000 !important;
}

select.form-control.reserved {
    color: #ffa800 !important;
    border: 1px solid #ffa800 !important;
}

select.form-control.designated {
    color: #f37f85;
    border: 1px solid #f37f85;
}

.sp_daynamic {
    color: red; /* Sets text color to red */
    /* Additional styles if needed */
}

/*===================================================Add slot popup Profile=====================================*/

.edit-slot-profile .modal-dialog {
    max-width: 580px;
}

.edit-slot-profile .modal-header .modal-title {
    color: #474747 !important;
    font-size: 13px !important;
    font-weight: 500 !important;
}

.account_payment_number_slots .number_slots {
    background-color: #F8F8F8;
    padding: 20px;
    border-radius: 10px;
}

    .account_payment_number_slots .number_slots .edit-slots {
        cursor: pointer;
    }

    .account_payment_number_slots .number_slots p {
        margin: 0px !important;
        font-size: 14px;
        color: #888888;
        font-weight: 500;
        min-width: 60px;
    }

        .account_payment_number_slots .number_slots p span {
            margin: 0px 24px 0px 0px !important;
            font-size: 16px;
            color: #000;
            font-weight: 500;
        }

.payment-type-option {
    border-style: solid;
    border-color: #E4E4E4;
    border-width: thin;
    border-radius: 0.42rem;
    padding: 11px 16px 10px;
}

    .payment-type-option.active {
        border: 2px solid;
        border-color: #212121;
        border-radius: 0.42rem
    }

.card-border {
    padding: 10px;
    border: 1px solid #E4E4E4;
    border-radius: 8px;
}

.card_number span {
    margin: 24px 20px 0px 0px;
    font-size: 14px;
    font-weight: 700;
}

.account-form4 .form-group-account .ac-info h4 {
    font-size: 12px;
    font-weight: 500;
    margin-bottom: 12px;
}

.account-form4 .payment-type-option .option-body {
    font-size: 10px;
    font-weight: 500;
    margin-bottom: 0px;
}

.account-form4 .card_top_section_right {
    text-align: end;
}

    .account-form4 .card_top_section_right span {
        font-size: 10px;
    }

.account-form4 .checkbox-format label {
    font-size: 10px !important;
    font-weight: 400;
    line-height: 18px;
    margin: 0px;
    color: #212121;
}

.account-form4 .custom-switch .custom-control-label {
    position: relative;
    margin-bottom: 0;
    vertical-align: top;
    font-size: 12px;
    font-weight: 400;
}

.account-form4 .checkbox-format .form-control.credit-card,
.account-form4 .checkbox-format .form-control.accountInfo,
.account-form4 .checkbox-format .form-control.exp-date, .account-form4 .checkbox-format .form-control.card-cvv {
    font-size: 10px !important;
    height: 100%;
}

.account-form4 .card-img {
    text-align: end;
}

.edit-slot-profile .blockUI.blockMsg.blockElement {
    top: 48% !important;
    left: 40% !important;
}

.accountadd-modal .modal-content.modalContentAccount .blockUI.blockMsg.blockElement {
    top: 50% !important;
    left: 40% !important;
}

/*=====================================Bootstrap switch button override css=============================*/
.custom-control-input:checked ~ .custom-control-label::before {
    border-color: #20D125;
    background-color: #20D125;
}

.custom-control-input:focus:not(:checked) ~ .custom-control-label::before {
    border-color: #B5B5C3;
}
/*=============================grid style ag-theme-alpine css===================================*/
.grid-style .contact-mail {
    line-height: 18px;
}

    .grid-style .contact-mail span:last-child {
        color: #c6c0c0;
    }

.grid-style .ag-row {
    height: 40px !important;
}

.grid-style .ag-theme-alpine .ag-checkbox-input-wrapper:after {
    color: #ddd !important;
}

.grid-style .ag-theme-alpine .ag-row-selected {
    background-color: #fff !important;
}

.grid-style .ag-theme-alpine .ag-checkbox-input-wrapper.ag-checked::after {
    color: #212121 !important;
}

.grid-style .ag-theme-alpine .ag-checkbox-input-wrapper:focus-within, .grid-style .ag-theme-alpine .ag-checkbox-input-wrapper:active {
    box-shadow: none !important;
}
/*.account-layout .ag-theme-alpine .ag-pinned-right-header {
    border: 0;
}*/

.payment-type-option {
    border-style: solid;
    border-color: #E4E4E4;
    border-width: thin;
    border-radius: 0.42rem;
    padding: 15px 6px 15px 6px;
}

    .payment-type-option.active {
        border: 1px solid;
        border-color: #212121;
        border-radius: 0.42rem
    }

.creditcard-item {
    border-style: solid;
    border-color: #808080;
    border-width: thin;
    border-radius: 0.42rem;
}

.card-border.active {
    border-style: solid;
    border-color: #1BC5BD;
    border-width: medium;
    border-radius: 0.42rem
}

.method-payment {
    padding: 0px 0px 0px 10px;
}

.heading-method-payment {
    margin: 40px 0px 24px 0px;
}


    .heading-method-payment h5 {
        font-size: 14px;
        font-weight: 400;
        color: #212121;
    }

.option-body {
    font-size: 12px;
    font-weight: 400;
    color: #212121;
}

/*===============================Custom Checkbox radio==================================*/
.checkbox-custom, .radio-custom {
    opacity: 0;
    position: absolute;
}

.radio-custom-label.active {
    color: #474747;
}

.checkbox-custom, .checkbox-custom-label, .radio-custom, .radio-custom-label {
    display: inline-block;
    vertical-align: middle;
    margin: 5px;
    cursor: pointer;
}

.checkbox-custom-label, .radio-custom-label {
    position: relative;
    color: #888888;
    font-size: 12px;
    font-weight: 500;
}

.checkbox-custom + .checkbox-custom-label:before, .radio-custom + .radio-custom-label:before {
    content: '';
    background: #fff;
    border: 1px solid #ddd;
    display: inline-block;
    vertical-align: middle;
    width: 16px;
    height: 16px;
    padding: 2px;
    margin-right: 10px;
    text-align: center;
}

.checkbox-custom:checked + .checkbox-custom-label:before {
    background: rebeccapurple;
    box-shadow: inset 0px 0px 0px 4px #fff;
}

.radio-custom + .radio-custom-label:before {
    border-radius: 50%;
}

.radio-custom:checked + .radio-custom-label:before {
    background: #474747;
    border: 1px solid #474747;
    box-shadow: inset 0px 0px 0px 3px #fff;
}

.radio-custom:checked label {
    color: #474747;
}
/*===============================Custom Checkbox radio==============End====================*/

/*===============================Charge layout pay modal popup=============================*/
.charge .modal-dialog {
    max-width: 1400px;
}

.charge .card-select {
    display: flex;
    grid-gap: 10px;
    flex-wrap: wrap;
    max-height: 206px;
    overflow: auto;
}

.charge .card_top_section_left img {
    height: 27px;
    width: 44px;
}

.charge .heading-method-payment {
    margin: 22px 0px 0px 0px;
}

.charge .payment-type-option {
    padding: 8px 6px 12px 6px;
}

.charge .card-border {
    padding: 10px 0px;
    width: 197px;
}

.charge .card_top_section_right {
    display: flex;
    grid-gap: 16px;
    justify-content: end;
}

.charge .checkbox-selection {
    margin-top: 8px;
}

.charge .card_number span {
    margin: 8px 0px 0px 0px !important;
}


/*===============================Add Profile Css slot modal============================*/
.addprofile-form .modal-dialog {
    max-width: 850px;
}

.addprofile-form .select-gender {
    display: flex;
    align-items: center;
    grid-gap: 8px;
    height: 100%;
}

.addprofile-form .detail-box {
    margin: 10px 0px;
}

.addprofile-form .detail-box-data {
    display: flex;
    grid-gap: 10px;
    width: 100%;
    font-size: 10px;
}

.addprofile-form .detail-box-column {
    display: flex;
    grid-gap: 10px;
}

.addprofile-form .detail .age {
    max-width: 58px;
}

    .addprofile-form .detail .age input {
        padding: 4px 6px;
    }

.addprofile-form .detail-box-column .detail-box-data label {
    /*    width: 100%;
    text-align: end;*/
    width: 96px;
    text-align: end;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.addprofile-form .image-pdf {
    display: flex;
    grid-gap: 14px;
}

.addprofile-form .detail-box-column .marital-info {
    display: flex;
    align-items: end;
    grid-gap: 10px;
}

.addprofile-form .marital-info .form-group {
    flex: 1;
}

    .addprofile-form .marital-info .form-group:nth-child(2), .addprofile-form .marital-info .form-group:nth-child(5) {
        min-width: 80px;
    }

    .addprofile-form .marital-info .form-group:nth-child(3) {
        min-width: 80px;
        flex: none;
    }

        .addprofile-form .marital-info .form-group:nth-child(3) .check {
            height: 33px;
            margin-top: auto;
        }

    .addprofile-form .marital-info .form-group:nth-child(1) {
        min-width: 224px;
    }

.addprofile-form .detail-box-column .marital-info .check-display {
    display: flex;
    align-items: center;
    grid-gap: 8px;
}

    .addprofile-form .detail-box-column .marital-info .check-display .check {
        display: flex;
        align-items: center;
        grid-gap: 8px;
    }

        .addprofile-form .detail-box-column .marital-info .check-display .check span {
            font-size: 10px;
        }

        .addprofile-form .detail-box-column .marital-info .check-display .check label {
            margin-bottom: 0px;
        }

.addprofile-form .select-stone {
    display: flex;
    align-items: center;
    grid-gap: 20px;
}

.addprofile-form .footer-action-btn {
    display: flex;
    justify-content: space-between;
    margin-top: 30px;
    position: sticky;
    bottom: 0px;
    background: #fff;
    padding: 20px 0px;
    z-index: 1;
}

.addprofile-form .contact-info {
    padding: 10px 15px 15px;
    background: #f3f6f3;
    border-radius: 8px;
    display: flex;
    grid-gap: 10px;
}

.addprofile-form .detail {
    width: 100%;
    display: flex;
    grid-gap: 10px;
    font-size: 10px;
}

    .addprofile-form .detail.contact-details .form-group {
        flex: 1;
    }

.Marital-relation-info {
    display: flex;
    grid-gap: 15px;
}

    .Marital-relation-info .form-group {
        flex: 1;
    }

.addprofile-form .input-group input {
    padding: 4px 8px;
    border-right: 0px;
}

.addprofile-form .input-group-text {
    padding: 4px 6px;
}

.addprofile-form .check-radio {
    display: flex;
    grid-gap: 20px;
}

    .addprofile-form .check-radio span {
        display: flex;
        align-items: center;
        grid-gap: 5px;
    }

.addprofile-form .select-gender .check-radio input {
    margin: 0;
}

.addprofile-form .radio-custom-label {
    margin: 0px;
}

.addprofile-form .slot-title {
    display: flex;
    align-items: center;
    grid-gap: 8px;
    font-size: 12px;
    font-weight: 500;
}

.addprofile-form .detail-box-title {
    font-size: 12px;
    font-weight: 500;
}

.addprofile-form .form-group label {
    font-size: 10px;
}

.detail-box.input-field .check {
    font-size: 9px;
}

    .detail-box.input-field .check span {
        margin-bottom: 0px;
        display: flex;
        line-height: 24px;
    }

.addprofile-form .checkbox > span {
    height: 14px;
    width: 14px;
    border-radius: 4px;
}

    .addprofile-form .checkbox > span:after {
        width: 4px;
        height: 8px;
    }

.addprofile-form .modal-header .modal-title {
    font-size: 14px !important;
    font-weight: 500 !important;
    color: #474747 !important;
}

.addprofile-form .detail-box .datepicker {
    width: 100% !important;
}

.addprofile-form .select-stone label {
    font-size: 10px;
}

.addprofile-form .checkbox-custom + .checkbox-custom-label:before, .addprofile-form .radio-custom + .radio-custom-label:before {
    width: 10px;
    height: 10px;
    padding: 1px;
}


.addprofile-form .detail-box.input-field {
    display: flex;
    flex-wrap: wrap;
}


/*============calendar popup Css======================*/
div#ui-datepicker-div {
    z-index: 1050 !important;
}

.photo_unique .image-input-wrapper img {
    min-height: 90px;
    margin: 3px 0px;
    object-fit: cover;
}

.photo_unique .image-input .image-input-wrapper {
    height: auto !important;
    padding: 0px 2px;
}

/*.photo_unique .image-input {
    margin-top: -30px;
}*/
.min-width-60 {
    min-width: 60px;
}

/*=======================Loader css===========================*/
.loader-center .blockElement {
    width: 100% !important;
    top: 310px !important;
    left: 0% !important;
}
/*======================Slot box Css===========================*/
.slot-box .available span {
    background: #28a745;
    padding: 3px 8px;
    border-radius: 13px;
    font-size: 11px;
    color: #ffffff;
    box-shadow: 0px 0px 4px #74747450;
}

.slot-box .reserved span {
    background: #FFD700;
    padding: 3px 8px;
    border-radius: 13px;
    font-size: 11px;
    color: #000000;
}

.slot-box .booked span {
    background: #fff0f1;
    padding: 3px 8px;
    border-radius: 13px;
    font-size: 11px;
    color: #ff414b;
}

.slot-box .manual-booked span {
    background: #E9F2FD;
    padding: 3px 8px;
    border-radius: 13px;
    font-size: 11px;
    color: #074BB1;
}
/*======================Slot layout Csss==================================*/
.slot-results-grid, .slot-box-info {
    max-height: calc(100vh - 340px);
    overflow: auto;
}
/*#divSlotsView {
    height: 500px;*/ /* Adjust this value as needed */
/*overflow-y: scroll;
    overflow-x: hidden;
}*/
/*   ======================= Slot pagination css===============================*/
.slot-page-info {
    display: flex;
    grid-gap: 12px;
    row-gap: 12px;
    flex-wrap: wrap;
    /*justify-content: space-between;*/
}

    .slot-page-info .slot-box {
        width: 183px;
        height: 187px;
    }

    .slot-page-info .card.card-custom.card-stretch.gutter-b {
        height: 100%;
    }

    .slot-page-info .row-column-info span {
        height: 20px;
    }

/*=====================Create Slot heading css===================================*/
.create-slot-heading {
    display: flex;
    text-align: center;
    padding: 4px 10px;
}

    .create-slot-heading .slot-row-no {
        flex-basis: 10%;
    }

    .create-slot-heading span.slot-designated {
        flex-basis: 30%;
    }

    .create-slot-heading span.slot-row {
        flex-basis: 20%;
    }

    .create-slot-heading span.slot-column {
        flex-basis: 20%;
    }

    .create-slot-heading span.slot-price {
        flex-basis: 20%;
    }

/*====================Services popup===============================================*/
.swal2-container .swal2-icon.swal2-warning.swal2-icon-show {
    background-image: url(/images/icons/delete.png);
    background-repeat: no-repeat;
    border: 0;
    color: transparent;
    border-radius: 0;
}

.swal2-container button.swal2-confirm.swal2-styled {
    margin: auto;
}

button.swal2-cancel.swal2-styled {
    margin: auto;
    background-color: #212121;
}

.swal2-cancel.btn.btn-danger {
    background: transparent;
    border: transparent;
    color: #2a2a2a;
}

.swal2-confirm:hover {
    color: #ffffff;
    background-color: #212121 !important;
    border-color: #212121 !important;
}

.swal2-popup .swal2-content {
    padding: 0px;
    margin-top: 0;
}

.swal2-styled:has(.link-payment) {
}

.swal2-cancel.swal2-styled:has(.link-payment) {
    margin: 10px !important;
}

.swal2-confirm.swal2-styled:has(.link-payment) {
    margin: 0px !important;
}
/*=====================charge-details popup Css===============================*/
.table.charge-details {
    text-align: start;
}

div#swal2-validation-message {
    width: 400px;
    margin: auto;
}

.swal2-popup.swal2-modal.swal2-show:has(.charge-details) {
    width: 740px !important;
}

.swal2-popup.swal2-modal.swal2-show:has(.link-payment) {
    width: 640px !important;
}

.swal2-container .swal2-html-container:has(.charge-details) {
    max-height: 220px;
}

.swal2-popup.swal2-modal.swal2-show:has(.payment-details) {
    width: 550px !important;
}
/*===============================aside nav setting  system-setting css==================================*/
.system_setting_page .plot-pricing-tab {
    display: flex;
    background: #fff;
}

.system_setting_page .plot-pricing-nav {
    width: 250px;
    padding-top: 20px;
    border-right: 1px solid #dedbdb;
}

    .system_setting_page .plot-pricing-nav ul li.active {
        background: #ddd;
    }

    .system_setting_page .plot-pricing-nav ul li {
        list-style: none;
    }

        .system_setting_page .plot-pricing-nav ul li a {
            padding: 8px 24px;
            display: flex;
            font-weight: 600;
            border-radius: 0;
        }

            .system_setting_page .plot-pricing-nav ul li a:hover {
                background: #f8f6f6;
            }

.system_setting_page .grid-plot-pricing {
    width: 100%;
    padding: 20px 36px;
}

.system_setting_page .grid-action {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 8px;
}

.system_setting_page .pricing-data .grid-action {
    margin-bottom: 14px;
}

.system_setting_page .grid-action h2 {
    font-size: 16px;
    font-weight: 600;
    margin: 0;
}

.system_setting_page .grid-action button.btn {
    border: 1px solid #ddd;
    padding: 4px 10px;
}

.system_setting_page .plot-grid {
    border: 1px solid #ddd;
}

.system_setting_page .tab-content.scroll {
    height: 786px !important;
}

.system_setting_page .plot-value {
    background: #ddd;
    padding: 0px 10px;
    border-radius: 20px;
    margin-right: 3px;
    display: inline-block;
    height: 21px;
    line-height: 20px;
}



/*=========================================pending_approval_page Css============*/
.pending_approval_page .grid-wapper .ag-theme-alpine .ag-root-wrapper {
    height: calc(100% - 36px);
}

/*==========================Pricing setting Css================================*/
.grid-box {
    border: 1px solid #ddd;
    border-radius: 8px;
    padding-bottom: 3px;
}

.pricing-data h4 {
    font-size: 14px;
    font-weight: 600;
    margin-bottom: 8px;
}

.pricing-data .grid-row .col-4 {
    flex: 0 0 33.33%;
    max-width: 33.33%;
}

/*===========================Side-wrapper table content css================================*/
.side-wrapper .table th, .side-wrapper .table td {
    border-bottom: 1px solid #EBEDF3;
}


/*==================================Side wrapper account tab====================================*/
.table.view-service th {
    border-top: 0 !important;
}

.table.view-service td {
    padding: 7px 10px;
    border-top: 1px solid #EBEDF3;
}

.border-style th, .border-style td {
    border: 0 !important;
}
/*==================================permission setting css====================================*/
.permission-setting-page {
    background: #fff;
    padding: 24px;
    border-radius: 8px;
    display: flex;
    grid-gap: 24px;
    height: calc(100% - 50px);
}

.permission_sidebar_left {
    background: #fff;
    border: 1px solid #E4E4E4;
    padding: 20px;
    height: 800px;
}

    .permission_sidebar_left h1 {
        font-size: 16px;
        font-weight: 500;
    }

.permission-left-tab .list-group-item {
    border: 0px !important;
    border-radius: 8px;
}

    .permission-left-tab .list-group-item:hover {
        background-color: #F3F6F9;
        transition: background-color 0.3s;
    }

.permission_sidebar_right {
    background: #fff;
    border: 1px solid #E4E4E4;
    padding: 20px;
    height: 800px;
}

    .permission_sidebar_right h1 {
        font-size: 20px;
        font-weight: 700;
        color: #000;
    }


/*=================================Permission Setting Css==============================*/
.set_permission-field {
    min-width: 444px;
    border-right: 1px solid #ddd;
    padding-top: 21px;
    padding-right: 24px;
    font-size: 12px;
    font-weight: 500;
    line-height: 25px;
}

.set_permission-field-data {
    border-bottom: 1px solid #e0e0e0;
    padding-bottom: 12px;
}

    .set_permission-field-data .secretary {
        padding: 1.266rem 1.5rem;
    }

.set_permission-security {
    padding: 30px;
    padding-top: 21px;
    box-shadow: 0 0 10px rgb(0, 0, 0, 10%);
    margin-top: 28px;
    border-radius: 8px;
}

@media (max-width: 768px) {
    .set_permission-security {
        padding: 15px;
    }
}

@media (max-width: 576px) {
    .set_permission-security {
        padding: 0;
    }
}

.set_permission-security-indicator {
    margin-top: 30px;
    line-height: 40px;
    height: calc(100vh - 258px);
    overflow: auto;
}

.set_permission-security-indicator-switch {
    display: flex;
    align-items: center;
    width: 213px;
    justify-content: space-between;
}
/* Toggle Switch CSS ========================================================================== */
.set_permission-security .toggle-switch {
    padding: 0;
    cursor: pointer;
    line-height: 16px;
}

    .set_permission-security .toggle-switch input {
        display: none;
    }

        .set_permission-security .toggle-switch input + .slider {
            position: relative;
            display: inline-block;
            width: 28px;
            height: 16px;
            background: #ddd;
            border-radius: 50px;
            transition: all 0.3s ease-in-out;
        }

            .set_permission-security .toggle-switch input + .slider:before {
                content: "";
                position: absolute;
                display: block;
                width: 12px;
                height: 12px;
                background: #fff;
                border-radius: 50%;
                transition: all 0.3s ease-in-out;
                left: 2px;
                top: 2px;
                box-shadow: 0px 3px 6px rgba(0, 0, 0, 16);
            }

        .set_permission-security .toggle-switch input:checked + .slider {
            background: #E3C562;
            border-color: #E3C562;
        }

.toggle-switch input:checked + .slider:before {
    left: 49%;
    transform: none;
}

.set_permission-security .toggle-switch .toggle-text {
    color: var(--color-gray);
    margin-left: 8px;
    width: 16px;
}

.set_permission-security .toggle-switch .on {
    display: none;
}

.set_permission-security .toggle-switch input:checked ~ .on {
    display: block;
}

.set_permission-security .toggle-switch input:checked ~ .off {
    display: none;
}

.set_permission-security .toggle-switch-sm {
    line-height: 10px;
}

    .set_permission-security .toggle-switch-sm input + .slider {
        width: 22px;
        height: 12px;
    }

        .set_permission-security .toggle-switch-sm input + .slider:before {
            width: 8px;
            height: 8px;
        }

    .set_permission-security .toggle-switch-sm input:checked + .slider:before {
        left: 56%;
    }

.grid-content .english-hebrew {
    display: flex;
    flex-direction: column;
    line-height: 18px;
    font-size: 14px;
}

/*========================================Account layout atteachment tab Css=====================================*/
.attachment-gallary {
    display: flex;
    grid-gap: 22px;
    flex-wrap: wrap;
}

.upload-attachment a:hover svg {
    color: #fff !important;
}

.upload-attachment a {
    padding: 5px 30px;
}

.account-custom-tab {
    box-shadow: none !important;
}
/*
========================Plot color-profile meaning============================*/
.seat-available {
    display: flex;
    grid-gap: 30px;
    margin-bottom: 12px;
    font-weight: 600;
}

    .seat-available span {
        padding: 2px 12px;
        border-radius: 24px;
    }
    /*.seat-available .color-meaning {
    color: #fff;
    padding: 4px 12px;
    border-radius: 16px;
    margin-left: 8px;
}*/
    .seat-available .green {
        background: #28a745;
        color: #000;
    }

    .seat-available .red {
        background: #c20000;
        color: #ffffff;
    }

    .seat-available .yellow {
        background: #ffa800;
        color: #000;
    }

    .seat-available .reserved-yellow {
        background: #FFD700;
        color: #000;
    }

    .seat-available .designatedblue {
        background: #c4d2ed;
        color: #000;
        border: 0;
    }

    .seat-available .orange {
        background: #FEC588;
        color: #000;
    }

    .seat-available .lightgreen {
        background: #000000;
    }

    .seat-available .occupied-black {
        background: #000000 !important;
        color: #ffffff !important;
    }

    .seat-available .lightyellow {
        background: #800080;
        /*background: linear-gradient(90deg,rgba(0, 0, 0, 1) 0%, rgba(128, 0, 128, 1) 100%);*/
        background: linear-gradient(to right, #000000 50%, #800080 50%);
        color: #000;
    }

.slotpopup-list .modal-content {
    height: 790px;
}

.bg-color-yellow {
    background-color: yellow;
}

.bg-color-red {
    background-color: red;
}

.bg-color-green {
    background-color: green;
}

.bg-color-light-green {
    background-color: lightgreen;
}

.bg-color-light-gry {
    background-color: lightgray;
}

.bg-color-plot {
    background-color: #20f720 !important;
}


.slotpopup-list .slot-layout {
    overflow: auto;
    height: 604px;
}

.slotpopup-list .modal-dialog {
    max-width: 85%;
}

@media(max-width: 1600px) {
    .slotpopup-list .modal-dialog {
        max-width: 1300px;
    }
}

@media(max-width: 1400px) {
    .slotpopup-list .modal-dialog {
        max-width: 1050px;
    }
}

@media(max-width: 1200px) {
    .slotpopup-list .modal-dialog {
        max-width: 900px;
    }
}

@media(max-width: 1000px) {
    .slotpopup-list .modal-dialog {
        max-width: 800px;
    }
}

@media(max-width: 800px) {
    .slotpopup-list .modal-dialog {
        max-width: 650px;
    }
}

.form-control.designatedPlot {
    border: 1px solid #c20000;
    color: #c20000;
}

.form-control.filledPlot {
    border: 1px solid #000000;
    color: #000000;
}

.form-control.open-occupiedplot {
    border: 1px solid transparent;
    border-radius: 4px;
    background: linear-gradient(#fff, #fff) padding-box, linear-gradient(to right, #000000 50%, #800080 50%) border-box;
}



.form-control.reservedPlot {
    border: 1px solid #FFD700;
    color: #FFD700;
}

.designatedblue {
    color: #5e91f2;
    border: 1px solid #5e91f2;
}

.designatedPlot option, .filledPlot option, .reservedPlot option {
    color: #000;
}
/*------------*/
select.form-control.filled {
    color: #000000;
    border: 1px solid #000000;
}

select.form-control.reserved {
    color: #FFA800;
    border: 1px solid #FFA800;
}

select.form-control.designated {
    color: #f37f85;
    border: 1px solid #f37f85;
}

.sp_daynamic {
    color: red; /* Sets text color to red */
    /* Additional styles if needed */
}



/*Shift popup*/
.shift-info .select-row {
    background: #ddd;
}

.shift-info {
    max-height: 548px;
    overflow: auto;
}

    .shift-info thead {
        position: sticky;
        top: -1px;
        background: #fff;
        border-top: 1px solid #ddd;
    }


/*Transfer Plot new popup*/
.transfer-plot .table th, .transfer-plot .table td {
    padding: 6px !important;
}

.acc-details .ellipse:after {
    content: ":";
    position: absolute;
    right: 0;
}

/*add swal popup class*/
.addmyclass-swal button.swal2-cancel.my-cancel-button-class {
    border: none;
    background: none;
}

.addmyclass-swal button.swal2-confirm.my-confirm-button-class {
    background: #000;
    color: #fff;
    border: 1px solid #000;
    padding: 8px 12px;
    border-radius: 4px;
}

    .addmyclass-swal button.swal2-confirm.my-confirm-button-class:hover {
        background: #000 !important;
    }

.addmyclass-swal .swal2-actions {
    margin-bottom: 0;
    margin-top: 40px
}

.success-popup .modalContentAccount {
    min-width: 540px !important;
}

    .success-popup .modalContentAccount .modal-content {
        padding: 45px 0px
    }

.drawer-table .table tr td:first-child {
    width: 100px;
}

.decent-profile-select {
    display: flex;
    grid-gap: 50px;
    align-items: center;
    margin-right: 80px;
}

    .decent-profile-select .modal-titles {
        padding: 3px 14px;
        font-size: 12px;
        border-radius: 24px;
        color: #000;
        background: #5e91f2;
    }

    .decent-profile-select .occupied {
        background: #000000 !important;
        color: #ffffff !important;
    }

    .decent-profile-select .occupied-open {
        background: linear-gradient(to right, #000000 50%, #800080 50%);
        color: #ffffff !important;
    }

    .decent-profile-select .designated {
        background: #c20000;
        color: #ffffff !important;
    }

    .decent-profile-select .reserved {
        background: #FFA800;
        color: #000000;
    }

.hidden-button {
    display: none;
}

.pagination-btn {
    display: flex;
    gap: 16px;
    right: 70px;
}

    .pagination-btn .pre-btn, .pagination-btn .next-btn {
        padding: 0.15rem 0.75rem;
        border-radius: 20px;
        background: #212121;
        color: #fff;
        font-size: 11px;
        border: 0;
    }
/*input file css*/
.table-img {
    display: flex;
    gap: 12px;
    justify-content: center;
}

    .table-img img {
        width: 28px;
        height: 28px;
    }

    .table-img .img-delete i {
        color: #fa6666;
        font-size: 13px;
    }

    .table-img .file-download i {
        color: #212121;
    }

    .table-img .img-upload, .table-img .img-upload i {
        color: #0073e9;
    }

        .table-img .img-upload i {
            font-size: 14px;
            margin-right: 2px;
        }

.section-plot-map .table td img {
    width: 36px;
    height: 36px;
    object-fit: cover;
}

.section-plot-map .table td a:first-child i {
    color: #212121;
}

.section-plot-map .table td a:last-child i {
    color: #f66f71;
}

.section-plot-map {
    max-height: 300px;
    overflow: auto;
}

.pointer {
    cursor: pointer;
}

.plot-success h4 {
    color: green;
    margin-top: 16px;
}

.plot-form label {
    color: #a19d9d;
}

.plot-form label, .plot-form span, .plot-form input {
    font-size: 12px;
}

.plot-header {
    white-space: nowrap;
    gap: 10px;
}

    .plot-header span {
        display: inline-block;
        height: 1px;
        background: #a19d9d;
        width: 100%;
    }

.plot-table th, .plot-table td {
    font-size: 10px !important;
    padding: 6px;
    text-align: center;
}

.table-plot-form {
    height: 320px;
    overflow: auto;
}

    .table-plot-form thead {
        position: sticky;
        top: 0;
        background: #fff;
        z-index: 1;
    }

/* Validation css popup*/
.validation {
    font-size: 20px;
    font-weight: 600;
}

.validation-list {
    padding-left: 18px;
}

.display-msg {
    font-size: 20px;
    font-weight: 600;
}

.validation-footer {
    padding-bottom: 50px;
    padding-top: 34px;
    display: flex;
    justify-content: center;
    border: 0;
    gap: 20px;
}

.validation-list .list-valid {
    font-size: 16px;
}

.ag-center-cols-container {
    position: relative !important;
    height: 100% !important;
}

.no-record {
    position: absolute;
    z-index: 1;
    display: flex;
    justify-content: start;
    width: 100%;
    height: 100%;
    left: 720px;
    top: 50%;
    font-size: 16px;
}
/*label star css===================*/
.red-star {
    color: red;
    font-size: 14px;
    height: 10px;
    display: inline-block;
}

strong.complete-profile {
    color: #21c121;
}

strong.incomplete-profile:after, strong.incomplete-profile:before {
    content: "";
    position: absolute;
    left: 96%;
    width: 0;
    height: 0;
    border-style: solid;
    display: block;
}

strong.incomplete-profile:after {
    bottom: 0;
    border-width: 0 12px 14px 0;
    border-color: transparent transparent red transparent;
}

strong.incomplete-profile:before {
    top: 0;
    border-width: 14px 12px 0 0;
    border-color: red transparent transparent transparent;
}

strong.status_orange:after {
    border-color: transparent transparent #E3C562 transparent;
}

strong.status_orange:before {
    border-color: #E3C562 transparent transparent transparent;
}

strong.status_sky:after {
    border-color: transparent transparent #f37f85 transparent;
}

strong.status_sky:before {
    border-color: #f37f85 transparent transparent transparent;
}

strong.status_blue:after {
    border-color: transparent transparent #c4d2ed transparent;
}

strong.status_blue:before {
    border-color: #c4d2ed transparent transparent transparent;
}

strong.status_green:after {
    border-color: transparent transparent #c7f0c2 transparent;
}

strong.status_black:after {
    border-color: transparent transparent #000000 transparent;
}

strong.status_green:before {
    border-color: #c7f0c2 transparent transparent transparent;
}

strong.status_black:before {
    border-color: #000000 transparent transparent transparent;
}



strong.incomplete-profile {
    /*  border-radius: 4px 0 0 4px;*/
    color: #fff;
    font-weight: 600 !important;
    display: block;
    padding: 1px 5px;
    background: red;
    font-size: 20px;
    font-weight: 400;
    position: relative;
    width: 97px;
    margin-bottom: 4px;
}

.profile-result strong.incomplete-profile {
    font-size: 10px
}

.profile-result strong.complete-profile {
    font-size: 11px
}

.profile-result.grid {
    display: flex;
    align-items: center;
    height: 48px;
}

    .profile-result.grid .incomplete-profile {
        height: 24px;
        line-height: 22px;
    }

.unique_table .incomplete-profile {
    width: 105px;
}

/*color-profile image css*/
.image-input-wrapper .edit-delete-file {
    cursor: pointer;
    position: absolute;
    right: -10px;
    top: -10px;
    background: #fff;
    display: flex;
    align-items: center;
    max-width: 44px;
    height: 21px;
    display: flex;
    gap: 6px;
    box-shadow: 0px 0px 10px rgb(0, 0, 0, 10%);
    border-radius: 5px;
    justify-content: center;
    padding: 3px 6px;
    color: #212121;
}

.edit-delete-file .fa-trash, .edit-delete-file .fa-pen {
    font-size: 11px;
    color: #212121;
}

.profile-form .edit-delete-file [data-action=change] {
    cursor: pointer;
    position: relative !important;
    right: 0 !important;
    top: 0 !important;
}

@media (max-width: 1800px) {
    .slotpopup-list .modal-content {
        height: 700px;
    }
}

@media (max-width: 1600px) {
    .slotpopup-list .modal-content {
        height: 600px;
    }
}

@media (max-width: 1400px) {
    .slotpopup-list .modal-content {
        height: 500px;
    }
}

@media (max-width: 1200px) {
    .slotpopup-list .modal-content {
        height: 450px;
    }
}

@media (max-width: 1000px) {
    .slotpopup-list .modal-content {
        height: 400px;
    }
}

@media (max-width: 800px) {
    .slotpopup-list .modal-content {
        height: 300px;
    }
}

@media (max-width: 1800px) {
    .slotpopup-list .slot-layout {
        height: 500px !important;
    }
}

@media (max-width: 1600px) {
    .slotpopup-list .slot-layout {
        height: 400px !important;
    }
}

@media (max-width: 1400px) {
    .slotpopup-list .slot-layout {
        height: 300px !important;
    }
}

@media (max-width: 1200px) {
    .slotpopup-list .slot-layout {
        height: 260px !important;
    }
}

@media (max-width: 1000px) {
    .slotpopup-list .slot-layout {
        height: 220px !important;
    }
}

@media (max-width: 800px) {
    .slotpopup-list .slot-layout {
        height: 130px !important;
    }
}

.system_setting_page .ag-theme-alpine .ag-root-wrapper {
    border: none !important;
}

/*Attachment datalist css*/
.attachment-images img {
    width: 130px;
    height: 130px;
    object-fit: cover;
    border-radius: 8px;
}

.gender-option {
    display: inline-block;
    vertical-align: middle;
    margin-right: 10px;
    background: none !important;
}

.option-text {
    display: inline-block;
    vertical-align: middle;
}

[data-select2-id] {
    overflow-x: hidden;
}

.select2-selection.select2-selection--single {
    height: 38px;
    line-height: 35px;
    font-size: 15px;
    width: 120px;
}

.select2-results__options,
.select2-results__option {
    padding: 0px !important;
}

.select2-selection__rendered .green-dark-color {
    border: none !important;
}

.select2-selection__rendered:has(span) {
    padding: 0px !important;
}

.yellow-dark-color {
    background-color: #ffa800;
    display: inline-block;
    vertical-align: middle;
    padding: 4px 12px;
    width: 100%;
}

.green-dark-color {
    background-color: #fff;
    border-top: 1px solid #e6e0e0 !important;
    display: inline-block;
    vertical-align: middle;
    padding: 4px 12px;
    width: 100%;
}

.available-white {
    background-color: #28a745 !important;
    border-top: 1px solid #e6e0e0 !important;
    display: inline-block;
    vertical-align: middle;
    padding: 4px 12px;
    width: 100%;
}

    .available-white .option-text {
        color: #ffffff;
    }

.red-dark-color {
    background-color: #f37f85;
    display: inline-block;
    vertical-align: middle;
    padding: 4px 12px;
    width: 100%;
}

.blue-dark-color {
    background-color: #c4d2ed;
    display: inline-block;
    vertical-align: middle;
    padding: 4px 12px;
    width: 100%;
}

.table-plot-form .select2-selection:has(.yellow-dark-color) {
    background-color: #ffa800;
}

.table-plot-form .select2-selection:has(.green-dark-color) {
    background-color: #ffffff;
}

.table-plot-form .select2-selection:has(.available-white) {
    background-color: #28a745;
}

.table-plot-form .select2-selection:has(.red-dark-color) {
    background-color: #f37f85;
}

.table-plot-form .select2-selection:has(.blue-dark-color) {
    background-color: #c4d2ed;
}

.select2-results__options::-webkit-scrollbar {
    width: 5px;
}

.select2-results__options::-webkit-scrollbar-track {
    background: transparent;
}

.select2-results__options::-webkit-scrollbar-thumb {
    background: #a9a9a9;
    border-radius: 8px;
}

.select2-results__options .select2-results__option:first-child {
    padding: 8px !important;
    background: #ffffff !important;
    color: #888888 !important;
    font-weight: 500;
}

.font-700 {
    font-weight: 700;
}

.plot-table thead th {
    color: #a19d9d;
    font-weight: 700 !important;
}

.plot-table .select2-selection.select2-selection--single {
    height: 34px;
    width: 108px;
}

.plot-table .form-control.reservedPlot,
.plot-table .form-control.filledPlot,
.plot-table .form-control.designatedPlot {
    height: 34px;
    padding-left: 6px;
}


.plot-select .green-dark-color .gender-option,
.plot-select .yellow-dark-color .gender-option,
.plot-select .available-white .gender-option {
    margin-right: 4px;
}

.plot-select .green-dark-color .option-text,
.plot-select .yellow-dark-color .option-text,
.plot-select .available-white .option-text {
    font-weight: 700;
}

.plot-table td:nth-child(2) {
    width: 110px;
}

.plot-table td:nth-child(3) {
    width: 110px;
}

.plot-table td:last-child {
    width: 120px;
}

.select2-results__option .green-dark-color,
.select2-results__option .yellow-dark-color,
.select2-results__option .available-white {
    padding: 8px 12px !important;
}

.plot-table .gender-option {
    margin-right: 4px;
}

.shiftplot-popup {
    overflow-y: hidden !important;
}

#divShiftPlotSettingBody {
    overflow: hidden !important;
}

.unique_table th:first-child {
    min-width: 90px;
}

.details_tab .unique_table th:nth-child(1) {
    min-width: 100px;
}

.details_tab .unique_table th:nth-child(3) {
    min-width: 100px;
}

.details_tab .unique_table th:nth-child(4) {
    min-width: 132px;
}

.details_tab .unique_table th:nth-child(9) {
    min-width: 94px;
}

.details_tab .unique_table th:nth-child(10) {
    min-width: 180px;
}

.details_tab .unique_table th:nth-child(11) {
    min-width: 110px;
}

.details_tab .unique_table th:nth-child(12) {
    min-width: 180px;
}

.attachfile {
    width: 20px;
    position: relative;
}

    .attachfile .fileInputAttachments {
        width: 20px;
        opacity: 0;
        z-index: 1;
        position: relative;
    }

    .attachfile i {
        position: absolute;
        top: 0;
        color: #212121;
    }

.section-plot-map td {
    vertical-align: middle;
}

.payment-none {
    display: none;
}

.add-account .edit-account-form {
    display: flex;
    width: 100%;
    align-items: center;
    gap: 10px;
}

.add-account .label-input-account {
    display: flex;
    align-items: baseline;
    flex: 1;
}

.add-account .add-account-search {
    display: flex;
    gap: 10px;
    align-items: baseline;
}

    .add-account .add-account-search .label-input-account .account-input {
        flex: 1;
    }

.add-account .label-input-account .field-search {
    flex: 1;
}
/*.add-account .btn-go {
    position: absolute;
    right: -48px;
    padding: 8px 8px;
    top: 0px;
}*/
.add-account .btn-go i {
    color: #76baff;
    font-size: 16px;
}

.modal-body img {
    max-width: 100%;
    max-height: 80vh;
    object-fit: contain;
}

image-popup .close i {
    font-size: 23px !important;
    color: #fff !important;
    opacity: 1 !important;
}

.transfer-acc .add-account .transfer-acc-box {
    display: flex;
    align-items: center;
}

    .transfer-acc .add-account .transfer-acc-box .acc-label {
        min-width: 88px;
    }

.account-box {
    border: 1px solid #e0e0e0;
    border-radius: 4px;
    height: 100%;
    padding: 16px 12px;
}

    .account-box .account-box-header {
        font-weight: 600;
        font-size: 12px;
        margin-bottom: 16px;
    }

        .account-box .account-box-header a {
            font-weight: 400;
            font-size: 12px;
            color: #8950FC !important;
            cursor: pointer;
        }

            .account-box .account-box-header a i {
                color: #8950FC !important;
                font-size: 10px;
            }

            .account-box .account-box-header a:hover {
                font-weight: 400;
                font-size: 12px;
                text-decoration: underline;
            }

    .account-box .account-box-row {
        font-weight: 600;
        font-size: 12px;
        margin-bottom: 4px;
        border-bottom: 1px solid #e0e0e0;
        padding: 4px 6px;
        display: grid;
        grid-template-columns: 1fr 1fr;
        align-items: center;
    }

        .account-box .account-box-row:last-child {
            margin-bottom: 0px;
        }

    .account-box .fa-link-slash {
        font-size: 10px;
        cursor: pointer;
        color: #8950FC !important;
    }

    .account-box .account-box-wrapper {
        max-height: 136px;
        overflow: auto;
    }

        .account-box .account-box-wrapper .table td,
        .account-box .account-box-wrapper .table th {
            font-size: 12px;
        }
/* scrollbar */
.slim-scroll::-webkit-scrollbar {
    width: 5px;
    height: 5px;
}

.slim-scroll::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
    -webkit-border-radius: 10px;
    border-radius: 10px;
}

.slim-scroll::-webkit-scrollbar-thumb {
    -webkit-border-radius: 10px;
    border-radius: 10px;
    background: rgba(255, 255, 255, 0.3);
    -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.5);
}

    .slim-scroll::-webkit-scrollbar-thumb:window-inactive {
        background: rgba(255, 255, 255, 0.3);
    }

.account-box .account-top-header {
    background: #e0e0e0;
    color: #888888;
    position: sticky;
    top: 0;
}

.account-box .account-box-wrapper .table td {
    border: 1px solid #E0E0E0;
    border-radius: 10px;
    padding: 4px 5px;
}

    .account-box .account-box-wrapper .table td:first-child {
        border-right: 0;
        border-radius: 10px 0 0 10px;
    }

    .account-box .account-box-wrapper .table td:last-child {
        border-left: 0;
        border-radius: 0 10px 10px 0;
    }

    .account-box .account-box-wrapper .table td:not(:first-child):not(:last-child) {
        border-right: 0;
        border-left: 0;
        border-radius: 0;
    }

.account-box .account-box-wrapper .table {
    border-collapse: separate;
    border-spacing: 0 4px;
    margin-top: -4px;
}

    .account-box .account-box-wrapper .table thead {
        position: sticky;
        top: 0px;
        background: #fff;
        width: 100%;
    }


.card-select .delete-outside {
    position: absolute;
    top: 11px;
    right: 10px;
    cursor: pointer;
}

.row-account .search-select {
    border: 1px solid #ddd;
    border-radius: 0px;
    position: absolute;
    z-index: 1;
    background: #ffff;
    right: 12px;
    left: 12px;
    max-height: 110px;
    overflow: auto;
    box-shadow: 0px 5px 4px rgb(0, 0, 0, 18%);
}

    .row-account .search-select .search-item {
        padding: 1px 14px;
        margin: 0px;
        cursor: pointer !important;
    }

        .row-account .search-select .search-item:hover {
            background: #ddd;
        }

.form.create-user .select2-selection.select2-selection--single {
    width: 100%;
}

.form.create-user [data-select2-id] {
    overflow-x: unset !important;
}

.form.create-user .select2-selection {
    padding: 4px 10px !important;
}

.create-user-select2 .select2-results__options, .create-user-select2 .select2-results__option {
    padding: 8px 13px !important;
}

.user-eye-password {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    right: 5px;
}


.search-result .option-row {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-gap: 8px;
    font-size: 12px;
}

.search-result .option-row-header {
    background: #efefef;
    padding: 5px 10px;
    color: #888888;
    font-size: 12px;
    position: sticky;
    top: 0;
}

[data-select2-id] {
    overflow-x: unset !important;
}
/*.partial-form.account-form1 .form {
    max-height: 650px;
    overflow: auto;
}*/
.partial-form.account-form1 .form .row-account {
    margin: 0;
}

.user-type-class .select2-results__option {
    padding: 8px !important;
}

    .user-type-class .select2-results__option:empty {
        padding: 0px !important;
    }


/*Charged table Css
        ================================================================================*/
.charged-table td {
    border-top: none;
    padding: 7px;
    max-width: 80px;
}

.charged-table .memo-details {
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

.details-address {
    max-width: 160px;
    height: 61px;
    overflow-wrap: break-word;
}

.table.charged-table {
    text-align: center;
}

.charged-table th, charged-table td {
    vertical-align: middle;
}

table.table.view-service th, table.table.view-service td {
    vertical-align: middle;
    text-align: center;
}

.partial-form.account-form1 #inputContainer {
    padding: 0px 12.5px;
}

.addprofile-form .modalContentAddProfile .addProfile-popup {
    overflow: auto;
}

.form .input-group-icon {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    right: 10px;
    cursor: pointer;
}

#plotSelection {
    background-color: #f7f7f7 !important;
}

.divbody {
    background-color: #f7f7f7 !important;
}

.select2-selection__rendered .available-white {
    border: none !important;
}

.font-12 {
    font-size: 12px !important;
}

.gap-1 {
    gap: 4px !important;
}

.gap-2 {
    gap: 8px !important;
}

.main-plot-inner-section {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    padding: 10px;
    gap: 4px;
}

.bg-color-plot .child-plot-1.white {
    background: none !important;
}

.bg-color-plot .child-plot-2.white {
    background: none !important;
}

.child-flag {
    position: relative;
}

    .child-flag::after {
        content: "";
        width: 24px;
        height: 24px;
        position: absolute;
        background: red;
        left: -18px;
        top: -12px;
        transform: rotate(43deg);
    }


.switch input:empty ~ span {
    margin: 2px 0;
    height: 20px !important;
    width: 40px !important;
    border-radius: 16px;
}

    .switch input:empty ~ span:before, .switch input:empty ~ span:after {
        width: 40px !important;
        border-radius: 14px !important;
    }

    .switch input:empty ~ span:after {
        height: 16px !important;
        width: 16px !important;
        top: 2px !important;
        bottom: 3px;
        margin-left: 3px;
        font-size: 0.65em;
        text-align: center;
        vertical-align: middle;
    }

.switch input:checked ~ span:after {
    margin-left: 22px !important;
}

.decent-profile-select .modal-titles.gradient-btn {
    background: linear-gradient(to right, #000000 50%, #800080 50%) !important;
    color: white !important;
}