            /* jquery validation */
            
            label.error,
            .fail-upload-error,
            .custom-error {
                color: red;
                font-size: 16px;
                margin-bottom: 0;
            }
            
            .required-star {
                color: red;
            }
            
            .c-pointer {
                cursor: pointer;
            }
            /* jquery validation */
            
            .notification-div .dropdown-menu {
                width: 380px;
                padding: 0 !important;
            }
            
            .notification-div .scroll-ul {
                max-height: 50vh;
                min-height: 300px;
                overflow: auto;
            }
            
            .notification-div .dropdown-menu .dropdown-item {
                margin-bottom: 8px;
                border-radius: 12px;
            }
            
            .notification-div .dropdown-item:hover {
                background-color: rgba(0, 0, 0, 0.05) !important;
            }
            
            .notification-div .unread-noti {
                background-color: rgba(0, 0, 0, 0.07) !important;
            }
            
            .notification-div .dropdown-item.read-noti {
                background-color: #fff !important;
            }
            
            .cursor-no-drop {
                cursor: no-drop;
                pointer-events: none;
            }
            
            .notification-div .dropdown-toggle::after {
                display: none;
            }
            
            .notification-div .notification-title {
                color: #121416;
                font-size: 16px;
                font-weight: 400;
                line-height: normal;
                word-break: break-word;
                white-space: normal;
            }
            
            .notification-div .main-title {
                color: #121416;
                font-size: 18px;
                font-weight: 500;
                line-height: normal;
                word-break: break-word;
                white-space: normal;
            }
            
            .notification-div .text-14 {
                font-weight: 400;
                color: #595959;
                font-size: 14px !important;
                line-height: normal !important;
                word-break: break-word;
                white-space: normal;
            }
            
            .noti-time {
                font-weight: 400;
                color: #909090;
                font-size: 12px;
                line-height: normal;
            }
            
            .notification-div .notification-header {
                border-radius: 12px;
                background: #F5F5F5;
                padding: 10px 12px;
            }
            
            .notification-div .admin-tab-container .nav .nav-item .nav-link {
                width: fit-content;
            }
            
            .notification-div .user-notification-box {
                background-color: #121416;
                color: #fff;
                width: 32px;
                height: 32px;
                border-radius: 32px;
                overflow: hidden;
            }
            
            .notification-div .user-notification-box img {
                width: 100%;
                height: 100%;
                object-fit: cover;
            }
            
            .last-border-none .border-bottom:last-child {
                border-bottom: 0 !important;
            }
            
            .flex-1 {
                flex: 1;
            }
            
            .notification-div .noti-more-btn {
                padding: 5px 12px;
                color: var(--white);
                border-radius: 12px;
                font-size: 12px;
                font-weight: 400;
                transition: all .5s;
                background-color: var(--black);
                position: absolute;
                left: 50%;
                transform: translateX(-50%);
                bottom: -18px;
            }
            
            .no-new-notification-img {
                width: 100%;
                max-width: 400px;
                height: auto;
                object-fit: contain;
            }
            
            .notification-block {
                height: 400px;
            }
            
            .w-fit {
                width: fit-content;
            }
            
            .pr-box {
                background-color: #ebebeb;
                padding: 12px 8px;
                font-size: 14px;
                min-width: 60px;
                height: 56px;
            }
            
            .tattoo-dropdown .profile-img {
                width: 48px;
                height: 48px;
                border-radius: 50%;
                cursor: pointer;
                object-fit: cover;
                overflow: hidden;
            }
            
            .submit_btn {
                min-height: 50px;
            }
            
            @media (max-width: 575px) {
                .notification-div .dropdown-menu {
                    width: 280px;
                }
                .notification-div .admin-tab-container .nav .nav-item .nav-link {
                    padding: 4px !important;
                }
                .tattoo-dropdown .profile-img {
                    width: 42px;
                    height: 42px;
                }
                .personal-dts-text {
                    flex: auto !important;
                }
            }
            
            @media (max-width: 355px) {
                .notification-div .dropdown-menu {
                    width: 280px;
                }
            }
            
            .tattoo-dropdown .profile-img {
                width: 50px;
                height: 50px;
                border-radius: 50%;
            }
            
            .custom_date_input {
                position: relative;
            }
            
            .custom_date_input .form-control {
                border-radius: 15px !important;
                padding: 15px 48px 15px 15px !important;
            }
            
            .custom_date_input .clock-icon {
                position: absolute;
                top: 50%;
                right: 20px;
                transform: translateY(-50%);
                pointer-events: none;
                z-index: 10;
            }
            
            .card .table-responsive table tbody tr td.dt-empty {
                text-align: center !important;
                padding: 40px 20px !important;
            }
            
            div.dt-processing>div:last-child>div {
                background-color: var(--black) !important;
            }
            
            div.dt-processing {
                margin-top: 0 !important;
            }
            
            .edit-day-time-btn {
                background-color: transparent !important;
            }
            
            .add_time_btn {
                font-size: 14px;
                padding: 20px 15px;
            }
            
            .day-card {
                flex-wrap: wrap;
            }
            
            [type="radio"] {
                width: 20px;
                height: 20px;
                accent-color: black;
            }
            
            .shop_img_error_msg {
                max-width: 85px;
            }
            
            .profile_image_error {
                max-width: 80px;
            }
            
            .temp-disable {
                opacity: 0.50;
                cursor: not-allowed;
                pointer-events: none;
            }
            
            .day-card {
                border: 1px solid #ddd;
                border-radius: 10px;
                padding: 12px 16px;
                margin-bottom: 10px;
                display: flex;
                justify-content: space-between;
                align-items: center;
                background: #f9f9f9;
            }
            
            .day-card.inactive {
                color: red;
                background: #fff;
                font-weight: 500;
            }
            
            .day-time {
                color: #333;
                font-weight: 500;
            }
            
            .icon-btn {
                border: none;
                background: transparent;
                cursor: pointer;
            }
            
            .ct-file-close-icon {
                position: absolute;
                top: -4px;
                right: -5px;
                background: #E5E5E5;
                border-radius: 50%;
                cursor: pointer;
                width: 24px;
                height: 24px;
                display: flex;
                justify-content: center;
                align-items: center;
                border: 1px solid #FFF;
                box-shadow: 0px 1px 7px 0px rgba(0, 0, 0, 0.18);
            }
            
            .ct-file-close-icon img {
                width: 16px;
                height: auto;
            }
            
            .day-card .form-check-label {
                top: 4px;
            }
            /* .ct-file-image {
position: relative;
width: 100px;
height: 100px;
margin-right: 10px;
}

.ct-file-image img.ct-file-images {
width: 100%;
height: 100%;
object-fit: cover;
border-radius: 5px;
} */
            
            .required-block {
                color: #ff0000;
            }
            /* For AM/PM buttons */
            
            .bootstrap-datetimepicker-widget .btn-primary {
                background-color: black !important;
                /* Change to your desired color */
                color: #fff;
                border-color: black !important;
            }
            /* Specifically target AM/PM buttons if available */
            
            .bootstrap-datetimepicker-widget .btn[data-action="togglePeriod"] {
                background-color: black !important;
                /* Green background */
                color: white;
                /* Text color */
                border: none;
            }
            
            .add-expertise-box .auth-input-position-expertise {
                width: 100%;
                padding: 15px;
                border-radius: 16px;
                border: 1px solid #A7A7A7;
                display: flex;
                flex-wrap: wrap;
                gap: 7px;
            }
            
            .auth-input-position-expertise .bootstrap-tagsinput {
                width: 100%;
                flex: 1;
                border: 0;
                box-shadow: none;
                display: flex;
                flex-wrap: wrap;
                gap: 15px;
                padding: 0;
            }
            
            .add-expertise-box .bootstrap-tagsinput .tag {
                color: #000 !important;
                background-color: rgb(18 20 22 / 5%);
                border: 1px solid rgba(0, 0, 0, 0.10);
                padding: 7px 12px;
                border-radius: 12px;
                position: relative;
                font-size: 13px;
                line-height: normal;
                margin-right: 0;
                display: inline-block;
            }
            
            .add-expertise-box .bootstrap-tagsinput .tag span {
                width: 20px;
                height: 20px;
                position: absolute;
                margin: 0;
                background-color: #D3D3D3;
                display: flex;
                align-items: center;
                justify-content: center;
                top: -3px;
                right: -11px;
                border-radius: 50%;
                border: 1px solid #fff;
            }
            
            .add-expertise-box .bootstrap-tagsinput .tag [data-role="remove"]:after {
                content: "x";
                padding: 0;
                position: relative;
                top: -2px;
                font-size: 12px;
                left: 0px;
            }
            
            .acc-items-li.active .collapse:not(.show) {
                /* display: block !important; */
            }
            
            .auth-input-position-expertise {
                display: flex;
                align-items: center;
            }
            
            .auth-input-position-expertise .auth-input-icon {
                position: unset;
            }
            
            .error-placement-div {
                margin-bottom: 20px;
            }
            
            .form-check-toggle {
                display: flex;
                padding-left: 20px !important;
                padding-right: 30px;
            }
            
            .form-check-toggle .form-check-input {
                margin-left: 0;
            }
            
            .remember-me-div .form-check-label {
                top: 3px;
            }
            
            .personal-dts-flex {
                display: flex;
                gap: 30px;
                flex-wrap: wrap;
                align-items: center;
            }
            
            .personal-dts-flex-img img {
                width: 80px !important;
                height: 80px !important;
                object-fit: cover !important;
                border-radius: 50% !important;
            }
            
            .user-management-profile img {
                border-radius: 0 !important;
            }
            
            .personal-dts-text {
                flex: 1;
            }
            
            .personal-dts-text h2 {
                font-size: 18px;
                font-weight: 600;
                line-height: normal;
                color: #000;
                margin-bottom: 7px;
                text-transform: capitalize;
            }
            
            .personal-dts-text p {
                font-size: 18px;
                font-weight: 500;
                line-height: normal;
                color: #4D4B4B;
            }
            
            .post-image-flex .list-unstyled li {
                margin-bottom: 15px;
            }
            
            .disabled {
                opacity: 0.56;
                cursor: no-drop !important;
            }
            
            .mark-all-notification:not(.min-h-100-read) {
                max-width: 130px;
                width: 100%;
                min-height: 50px;
            }
            
            .flatpickr-months .flatpickr-prev-month:hover svg,
            .flatpickr-months .flatpickr-next-month:hover svg {
                fill: #000 !important;
            }
            
            .flatpickr-current-month input.cur-year,
            .flatpickr-current-month .flatpickr-monthDropdown-months {
                font-size: 16px !important;
            }
            
            .flatpickr-current-month {
                padding: 10px 0 0 0 !important;
                display: flex !important;
                align-items: center;
                justify-content: space-between;
            }
            
            .flatpickr-innerContainer {
                padding-top: 9px;
            }
            
            .auth-input-icon {
                pointer-events: none;
            }
            
            .auth-input-position-datepicker .flatpickr-calendar {
                top: 63px !important;
                left: 0 !important;
            }
            
            .select2-container .select2-selection--single .select2-selection__rendered {}
            
            .select2-container--default .select2-selection--single .select2-selection__arrow {
                display: none;
            }
            
            .select2-container--default .select2-selection--single {
                padding: 15px;
                color: var(--black);
                font-size: 16px;
                font-weight: 500;
                padding-left: 42px !important;
                border-radius: 16px !important;
                border: 1px solid #a7a7a7 !important;
                background-image: url(../img/arrow-down.png);
                background-size: 20px;
                background-position: 96%;
                background-repeat: no-repeat;
                height: auto !important;
            }
            
            .select2-container--open .select2-dropdown--below,
            .select2-container--open .select2-dropdown--above {
                border-radius: 5px !important;
                border: 1px solid #a7a7a7 !important;
            }
            
            .image-modal {
                display: none;
                position: fixed;
                z-index: 999;
                left: 0;
                top: 0;
                width: 100%;
                height: 100%;
                overflow: auto;
                background-color: rgba(0, 0, 0, 0.8);
            }
            
            .image-modal .modal-content {
                margin: auto;
                display: block;
                max-width: 80%;
                max-height: 80%;
                border-radius: 8px;
                object-fit: contain;
                width: unset;
            }
            
            .image-modal .close {
                position: absolute;
                top: 30px;
                right: 35px;
                color: #fff;
                font-size: 40px;
                font-weight: bold;
                cursor: pointer;
            }
            
            .image-preview {
                cursor: pointer;
            }
            
            .ct-card {
                border-radius: 12px;
                border: 1px solid rgba(0, 0, 0, 0.10);
                background: #FFF;
                padding: 16px;
                display: flex;
                align-items: center;
                gap: 12px;
                box-shadow: 0px 1px 7px 0px rgba(0, 0, 0, 0.18);
                margin-bottom: 15px;
            }
            
            .ct-card:last-child {
                margin-bottom: 0;
            }
            
            .ct-card .profile-image img {
                width: 58px;
                height: 58px;
                border-radius: 112px;
                border: 1px solid rgba(0, 0, 0, 0.10);
                object-fit: cover;
            }
            
            .ct-card .details {
                flex: 1;
            }
            
            .ct-card .details .top-row h2 {
                color: #0A0B0A;
                font-size: 16px;
                font-weight: 600;
            }
            
            .ct-card .details .top-row p {
                color: #4D4B4B;
                font-size: 13px;
                font-weight: 400;
            }
            
            .ct-card .info {
                display: flex;
                gap: 10px;
                flex-wrap: wrap;
            }
            
            .ct-card .ct-badge {
                display: inline-block;
                padding: 4px 9px;
                background: #e1e1e1;
                border-radius: 30px;
                font-size: 12px;
                font-weight: 600;
            }
            
            .ct-card .guest {
                display: inline-block;
                padding: 4px 9px;
                background: #003def45;
                border-radius: 30px;
                font-size: 12px;
                font-weight: 600;
                border: 1px solid #7682a3;
            }
            
            .ct-success {
                color: #067A27 !important;
                font-weight: 600 !important;
            }
            
            .ct-error {
                color: #F22626 !important;
                font-weight: 600!important;
            }
            
            @media (max-width: 400px) {
                .tattoo-dropdown .profile-img {
                    width: 40px;
                    height: 40px;
                }
                .auth-input-position-datepicker .flatpickr-calendar {
                    left: -18px !important;
                    width: 280px;
                }
                .auth-input-position-datepicker .flatpickr-day,
                .auth-input-position-datepicker .flatpickr-rContainer,
                .auth-input-position-datepicker .flatpickr-days {
                    width: 280px;
                }
                .auth-input-position-datepicker span.flatpickr-weekday {
                    font-size: 11px;
                }
                .auth-input-position-datepicker .dayContainer {
                    width: 280px;
                    min-width: 280px;
                    max-width: 280px;
                }
            }