:root, [data-bs-theme=light] {
    --vz-primary: #19297C;
    --vz-secondary: #000000;
    --vz-success: #000000;
    --vz-white: #ffffff;
    --vz-info: #299cdb;
    --vz-warning: #f7b84b;
    --vz-danger: #f06548;
    --vz-light: #f3f6f9;
    --vz-dark: #000200;
    --vz-primary-rgb: 0,0,0;
    --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: #19297C;
    --vz-topbar-search-bg: #19297C;
}
[data-theme=default][data-sidebar=dark] {
    --vz-vertical-menu-title-color: #433131;
    --vz-vertical-menu-item-color: ##000000;
    --vz-horz-menu-bg: var(--vz-white);
    --vz-vertical-menu-bg: var(--vz-white);
}
[data-bs-theme=dark][data-sidebar=dark]{
    --vz-vertical-menu-bg: #212529;
    --vz-horz-menu-bg: var(--vz-primary);
}
[data-theme=default]{
    --vz-header-item-sub-color: #000200;
}

/* Change autofill styles for all inputs */
input:-webkit-autofill,
input:-webkit-autofill:hover, 
input:-webkit-autofill:focus,
input:-webkit-autofill:active {
    -webkit-box-shadow: 0 0 0 1000px white inset !important;
    -webkit-text-fill-color: #495057 !important;
    transition: background-color 5000s ease-in-out 0s;
}

/* Specific style for email inputs */
input[type="email"]:-webkit-autofill,
input[type="email"]:-webkit-autofill:hover, 
input[type="email"]:-webkit-autofill:focus,
input[type="email"]:-webkit-autofill:active {
    -webkit-box-shadow: 0 0 0 1000px white inset !important;
    -webkit-text-fill-color: #495057 !important;
}

/* Specific style for password inputs */
input[type="password"]:-webkit-autofill,
input[type="password"]:-webkit-autofill:hover, 
input[type="password"]:-webkit-autofill:focus,
input[type="password"]:-webkit-autofill:active {
    -webkit-box-shadow: 0 0 0 1000px white inset !important;
    -webkit-text-fill-color: #495057 !important;
}

.btn-primary {
    --vz-btn-color: #fff;
}
/*.navbar-menu{*/
/*    background: #ffffff;*/
/*}*/
.navbar-brand-box{
     background: var(--vz-horz-menu-bg); 
     border-bottom: 1px solid #B7D3F2;
}

.navbar-menu .navbar-nav .nav-sm .nav-link:before{
    margin-right: 2px !important;
}

.navbar-menu .navbar-nav .nav-sm .nav-link:hover:before {
    background-color: var(--vz-primary) !important;
    opacity: 1
}


.navbar-menu .navbar-nav .nav-link.active {
    color: var(--vz-primary) !important;
}
.navbar-menu .navbar-nav .nav-link:hover {
    color: var(--vz-primary) !important;
}
.navbar-menu .navbar-nav .nav-link[data-bs-toggle=collapse][aria-expanded=true]:after,
.navbar-menu .navbar-nav .nav-sm .nav-link:hover,
.navbar-menu .navbar-nav .nav-link[data-bs-toggle=collapse][aria-expanded=true] {
    color: var(--vz-primary);
}
:is([data-layout=vertical],[data-layout=semibox])[data-sidebar-size=sm] .navbar-menu .navbar-nav .nav-item:hover>a.menu-link{
    color: var(--vz-white);
}
.navbar-menu {
    /* background: var(--vz-dark); */
    /* background: url(../images/bg-img.png); */
    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);
    }
}
.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: #F7BFB4; /* Red background */
    color: #000;           /* White text */
    border-color: #F7BFB4;
    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: #000;
    color: #fff;
}

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;
    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: #235361;
    color: #ffffff;
    border-color: #235361;
}
.swal2-confirm.custom-ok-button-class { 
    background-color: var(--vz-primary) !important;
    color: #fff;
    border-color: var(--vz-primary) !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 */
}

.navbar-header{
        background: var(--vz-primary);
}

.navbar-header .btn-topbar {
    color: #fff;
}
.hamburger-icon span {
    background-color: #fff;
}

.btn-remove-fields{
    position: absolute;
    top: -50px;
    right: 0px;
    width: 40px;
    height: 40px;
    text-decoration: none;
    border: 0px;
    text-align: center;
    background: var(--vz-danger);
    border: 1px solid var(--vz-danger);
    z-index: 1;
    color: #ffffff;
    border-radius: 20px;
    transition: all 0.3s;
}

.btn-sort-fields{
    position: absolute;
    top: -50px;
    right: 50px;
    width: 40px;
    height: 40px;
    text-decoration: none;
    border: 0px;
    text-align: center;
    background: var(--vz-primary);
    border: 1px solid var(--vz-primary);
    z-index: 1;
    color: #ffffff;
    border-radius: 20px;
    transition: all 0.3s;
    cursor: move !important;
}

.btn-remove-fields:hover{
    background: #ffffff;
    color: var(--vz-danger);
}

.booking-field-row {
    position: relative;
    background: #eeeeee;
    padding-bottom: 20px;
    padding-top: 20px;
}


:is([data-layout=vertical],[data-layout=semibox])[data-sidebar-size=sm] .navbar-menu .navbar-nav .nav-item:hover>a.menu-link{
    color: var(--vz-primary);
}

:is([data-layout=vertical],[data-layout=semibox])[data-sidebar-size=sm] .navbar-menu .navbar-nav .nav-sm .nav-item:hover>.nav-link{
        background: transparent !important;
    /*padding-left: 0 !important;*/
}
:is([data-layout=vertical],[data-layout=semibox])[data-sidebar-size=sm] .navbar-menu .navbar-nav .nav-item:hover>a.menu-link span{
    background: transparent !important;
    padding-left: 0 !important;
}

/*:is([data-layout=vertical],[data-layout=semibox])[data-sidebar-size=sm] .navbar-menu .navbar-nav .nav-item:hover>a.menu-link{*/
/*     background: #000;*/
/*}*/

.stastics-wrapper .card{
    /*background-color: var(--vz-primary);*/
    background: url(../images/bg_img.jpg);
    background-size: cover;
}

.btn-success {
    color: #fff !important;
    background: var(--vz-primary) !important;
    background-color: var(--vz-primary) !important;
    border-color: #fff !important;
}


.btn:hover, .btn-check:checked+.btn, .btn.active, .btn.show, .btn:first-child:active, :not(.btn-check)+.btn:active {
    color: #fff !important;
    background: linear-gradient(144deg, #19297C 0%, #19297C 100%);
    border-color: #fff !important;
}


.topbar-user .btn, .topbar-user .btn:hover, .topbar-user .btn-check:checked+.btn, .topbar-user .btn.active, .topbar-user .btn.show, .topbar-user .btn:first-child:active, .topbar-user :not(.btn-check)+.btn:active{
    background: transparent !important;
    color: #fff !important;
    border: transparent !important;
}

a.btn-success{
    color: #fff !important;
    background: linear-gradient(144deg, #000 0%, #000 100%) !important;
    border-color: #fff !important;
}


.topnav-hamburger{
    background: transparent !important;
    color: #fff !important;
    border: transparent !important;
}

.navbar-header .user-name-text{
    color: #fff !important;
}