:root, [data-bs-theme=light] {
    --vz-primary: #7622BD;
    --vz-secondary: #4f197c;
    --vz-success: #7622BD;
    --vz-info: #5B5B5B;
    --vz-warning: #f7b84b;
    --vz-danger: #f06548;
    --vz-light: #f3f6f9;
    --vz-dark: #000200;
    --vz-primary-rgb: 118,34,189;
    --vz-secondary-rgb: 53,119,241;
    --vz-success-rgb: 10,179,156;
    --vz-info-rgb: 41,156,219;
    --vz-warning-rgb: 247,184,75;
    --vz-danger-rgb: 240,101,72;
    --vz-light-rgb: 243,246,249;
    --vz-dark-rgb: 33,37,41;
    --vz-border-radius: 5px;
    --vz-primary-light: #7622BD;
    --vz-topbar-search-bg: #7622BD;
    --vz-primary-gradient: linear-gradient(54deg, rgba(247,124,254,1) 0%, rgba(73,2,166,1) 100%);
    --vz-vertical-menu-item-hover-color:  #7622BD;
    --vz-vertical-menu-item-active-color:  #7622BD;
    --vz-vertical-menu-sub-item-color: #1f1f1f;
    --vz-success-text-emphasis: #4f197c;
    --vz-info-text-emphasis: #000;
}
[data-theme=default][data-sidebar=dark] {
    --vz-vertical-menu-title-color: #9E9E9E;
    --vz-vertical-menu-item-color: #1f1f1f;
    --vz-vertical-menu-item-hover-color:  #7622BD;
    --vz-vertical-menu-item-active-color:  #7622BD;
    --vz-vertical-menu-sub-item-color: #1f1f1f;
    --vz-vertical-menu-sub-item-hover-color: #4f197c;
}
[data-theme=default]{
    --vz-header-item-sub-color: #FFF;
    --vz-header-item-color:#FFF;
}
.btn-primary {
    background: var(--vz-primary-gradient);
}
.navbar-menu {
    /* background: var(--vz-dark); */
    /*background: url(../images/bg-img.png);*/
     background: #fff; 
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}
.dashboadr-map-live-view .gmaps{
    height: 400px;
}
.btn-danger {
    --vz-btn-bg: var(--vz-primary);
    --vz-btn-border-color: var(--vz-primary);
    --vz-btn-disabled-bg: var(--vz-primary);
    --vz-btn-disabled-border-color: var(--vz-primary);
}
.card {
    --vz-card-border-radius: var(--vz-border-radius);
    --vz-card-inner-border-radius: var(--vz-border-radius);
    --vz-card-group-margin: calc(var(--vz-grid-gutter-width) * 0.5);
    border-radius: var(--vz-card-border-radius);
}
#page-topbar,
.header-main{
    background-color: var(--vz-primary);
}
.hamburger-icon span {
    background-color: var(--vz-header-item-sub-color);
}
@media (min-width: 768px){
    .topbar-user {
        background-color: var(--vz-primary-light);
    }
}
.app-search .form-control {
    color: var(--vz-topbar-search-color);
}
.navbar-header .user-name-sub-text {
    color: #727272;
}
.btn-soft-primary {
    --vz-btn-color: var(--vz-dark);
    --vz-btn-bg: var(--vz-primary);
}
.custom-cabby-icon{
    background: url(../images/cabby-sidebar-icon.png);
    width: 28px;
    height: 28px;
    background-size: 22px;
    background-repeat: no-repeat;
    background-position: -2px center;
}
.auth-one-bg .bg-overlay {
    background: -webkit-gradient(linear,left top,right top,from(var(--vz-primary-text-emphasis)),to(var(--vz-primary)));
    background: linear-gradient(to right, #ffe25c, var(--vz-primary));
    opacity: .9;
}
.shape>svg {
    fill: var(--vz-dark);
}
.full-screen-view{
    min-height: 700px;
}
.image-upload-area .avatar-custom{
    width: 100%;
    height: 6rem;
}
.image-upload-area{

}
.iti{
    width: 100%;
}

.progress-label .progress-bar.bg-dark .label{
    background-color: var(--vz-dark) !important;
}

.progress-label .progress-bar.bg-dark .label:after{
    border-top-color: var(--vz-dark) !important;
}


table tr td .dropdown .dropdown-btn-icon{
    width: 30px;
    height: 30px;
    background: #000;
    color: #eee;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 5px;
}


.table .sort::after, .table .sort::before{
    display: none !important;
}

.table thead th, .table .sort{
    background: #fff !important;
    box-shadow: none !important;
    outline: 0 !important;
}

.table .sort:hover, .table .sort:focus{
    background: #fff !important;
    outline: 0 !important;
}


table.dataTable th.dt-type-numeric, table.dataTable th.dt-type-date, table.dataTable td.dt-type-numeric, table.dataTable td.dt-type-date{
    text-align: left !important;
}


.form-select-placeholder select option:first-child{
    display: none !important;
}

.choices__inner{
    padding-right: 25px !important;
}


.choices__list--single{
    padding: 5px 0 5px 5px !important;
}


.select2-container .select2-search--inline .select2-search__field{
    width: fit-content !important;
}



.list-package{
    list-style-type: none;
    padding: 0;
    margin: 0;
}

.btn-icon{
    min-width: 37.5px !important;
    width: 37.5px !important;
    height: 37.5px !important;
}

.btn-danger{
    background: var(--vz-danger) !important;
    border-color: var(--vz-danger) !important;
}

.dropzone {
    min-height: 230px;
    border: 2px dashed var(--vz-border-color);
    background: var(--vz-secondary-bg);
    border-radius: 6px;
}

.invalid-feedback {
    display: block;
}


.error {
    color: #ff0030;
    margin-top: .5rem;
    font-size: 11px;
}

.swal2-popup.small-alert {
    width: 400px !important; /* Adjust width for small alerts */
    font-size: 14px !important; /* Adjust font size for smaller content */
}




div:where(.swal2-container) button:where(.swal2-styled).swal2-cancel {
    background-color: #000000;
}

.swal2-cancel:hover{
    background-color: #FCCE0B ;
}



#previewModal #modal-content img{
    max-width: 200px !important;
    /* max-width: 500px !important; */
    /* height: 500px !important; */
    width: 100%;
    /* object-fit: cover; */
    object-fit: cover;
    /* aspect-ratio: 3 / 2;

}

.swal2-icon{
    border: 0 !important;
}


div:where(.swal2-container).swal2-center>.swal2-popup{
    max-width: 320px;
    border-radius: 0.65rem;
    padding-bottom: 15px;
    /* height: 400px; */
}

div:where(.swal2-container).swal2-center>.swal2-popup{
    max-width: 340px;
    border-radius: 0.65rem;
    padding-bottom: 15px;
}

.swal2-icon{
    margin-top: -20px;
    height: auto;
    line-height: normal;
    font-size: inherit;
    border: 0 !important;
}

.swal2-icon-content img{
    width: 40px;
    height: 40px;
}

div:where(.swal2-container) div:where(.swal2-actions){
    margin-top: 5px !important;

}

div:where(.swal2-container) .swal2-html-container, .swal2-html-container{
    font-size: 1em;
    margin-top: 0;
}



.swal2-cancel.custom-cancel-button-class {
    background-color: #4f197c !important; /* Red background */
    color: #fff;           /* White text */
    border-color: #4f197c !important;
    border: 0;
    border-radius:0.65rem;
    padding: 0.5rem 0.9rem;
    font-size: 0.8125rem;
    box-shadow: none !important;
    outline: 0 !important;
}

/* Add hover styles */
.swal2-cancel.custom-cancel-button-class:hover {
    background-color: #4f4f4f;
    color: #FFFFFF;
}

div.dt-container .dt-input{
    background-color: var(--vz-input-bg-custom) !important;
    background-clip: padding-box;
    border: var(--vz-border-width) solid var(--vz-input-border-custom) !important;
    border-radius: 10px !important;
    margin-right: 10px;
    padding-right: 10px !important;
    padding-left: 5px !important;.swal2-cancel.custom-cancel-button-class
    outline: 0 !important;
    height: 37.5px !important;
}

.swal2-timer-progress-bar {
    background-color: #FCCE0B;
}



.line-limit-1 {
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 1; /* number of lines to show */
            line-clamp: 1;
    -webkit-box-orient: vertical;
 }

.btn-dark:hover {
    background-color: #FCCE0B;
    color: #ffffff;
    border-color: #FCCE0B;
}
.swal2-confirm.custom-ok-button-class {
    background: linear-gradient(45deg, #F77CFE 0%, #4902A6 100%) !important;
    color: #fff;
    border-color: transparent !important;
    border: 0;
    border-radius: 0.65rem;
    padding: 0.5rem 0.9rem;
    font-size: 0.8125rem;
    box-shadow: none !important;
    outline: 0 !important;
}

.btn-back {
    background-color: #000; /* Black background */
    color: #fff; /* White text */
    border: 1px solid #000; /* Black border */
    padding: 10px 20px; /* Add some padding */
    text-align: center;
    text-decoration: none; /* Remove underline */
    border-radius: 5px; /* Rounded corners */
    font-size: 14px; /* Adjust text size */
    font-weight: 500; /* Slightly bold text */
    display: inline-block; /* Ensure proper button alignment */
    transition: background-color 0.3s, color 0.3s; /* Smooth hover effect */
}

.btn-back:hover {
    background-color: #333; /* Slightly lighter black on hover */
    color: #fff; /* Keep text white */
}