.w-fit {
    width: fit-content;
}

.w-60 {
    width: 60%;
}

.bdr-10 {
    border-radius: 10px;
}

.bdr-15 {
    border-radius: 15px;
}

.bdr-20 {
    border-radius: 20px;
}

.bdr-30 {
    border-radius: 30px;
}

.bdr-top-15 {
    border-top-left-radius: 15px;
    border-top-right-radius: 15px;
}

.text-blue {
    color: #123984;
}

.btn-blue-border {
    border: 1px solid #123984;
    color: #123984;
    transition: all 0.3s;
}

.btn-blue-border:hover {
    background-color: #123984;
    color: white;
    transition: all 0.3s;
}

.btn-blue-border:focus {
    background-color: #123984 !important;
    color: white;
}

.fs-24 {
    font-size: 24px;
}

.fs-20 {
    font-size: 20px;
}

.fs-22 {
    font-size: 22px;
}

.fs-18 {
    font-size: 18px;
}

.fs-16 {
    font-size: 16px;
}

.fs-15 {
    font-size: 15px;
}

.fs-14 {
    font-size: 14px;
    line-height: 20px;
}

.fs-13 {
    font-size: 13px;
    line-height: 20px;
}

.fs-12 {
    font-size: 12px;
    line-height: 18px;
}

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

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

.bg-trans-white {
    background-color: ;
}

input.form-control.my-hub {
    background: white !important;
    transition: all 0.3s;
}

.my-grps:hover input.form-control.my-hub{
    background: rgb(202, 202, 202) !important;
    border-radius:0 30px 30px 0 !important;
    transition: all 0.3s;
}
.my-grps:hover span{
    background: rgb(202, 202, 202) !important;
    border-radius:30px 0 0 30px !important;
    transition: all 0.3s;
}
.my-grps:hover span i{
    color:rgb(26, 26, 26) !important;
}

.my-button {
    background-color: #123984 !important;
    color: white !important;
    border-radius: 30px;
}

.my-drop-button {
    background-color: #E2ECFF;
    color: #123984;
    border-radius: 30px;
}

.my-current-button {
    background-color: #f1f1f1;
    color: #525252;
    border-radius: 30px;
}

.my-button:hover {
    background-color: #123984;
    color: white;
}

.image-card img {
    object-fit: cover;
    width: 100%;
    height: 200px;
}

.dark-blue-bg {
    background-color: #06183E;
}

.abt-os-blue {
    background-color: #123984;
}

.sold-button {
    background-color: #000000;
    color: white;
    border-radius: 30px;
}

.owl-dots {
    display: none !important;
    width: fit-content;
    border: 2px solid #2a90ff;
    border-radius: 50px;
    display: flex;
    margin: auto;
    margin-top: 5px;
}

.owl-theme .owl-dots .owl-dot.active span,
.owl-theme .owl-dots .owl-dot:hover span {
    background: #2a90ff;
}

button[type="button"][role="presentation"].owl-prev {
    height: 35px;
    width: 35px;
    border-radius: 23.322px;
    background: #FFF;
    box-shadow: 0px 0px 4px 0px rgba(25, 86, 153, 0.20);
}

button[type="button"][role="presentation"].owl-next {
    height: 35px;
    width: 35px;
    border-radius: 23.322px;
    background: #FFF;
    box-shadow: 0px 0px 4px 0px rgba(25, 86, 153, 0.20);
}

/*--------------HEADER---------------*/

.bg-head-grey {
    border-radius: 50px;
    background: rgba(255, 255, 255, 0.12);
    backdrop-filter: blur(2.5px);
}

.sign-up-icon {
    width: 30%;
    margin: -8px 0;
}

.navbar-nav li {
    font-size: 16px;
}

.navbar-nav .my-nav a:hover {
    background-color: #136FFD;
    border-radius: 20px;
}


.navbar-light .navbar-brand {
    color: #2196f3;
}



.navbar-light .navbar-nav .nav-link {
    padding-top: 7px;
    padding-bottom: 7px;
    transition: 0.3s;
    padding-left: 24px;
    padding-right: 24px;
}

button.navbar-toggler {
    background-color: white;
}

.btn.disabled,
.btn:disabled {
    opacity: 0.65;
    background: #e4e4e4 !important;
    color: black !important;
    border: none !important;
}

.btn.disabled,
.btn:disabled i {
    color: black !important;
}

.header-bg {
    background: url("../img/Group\ 35493.png");
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
}

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

/*--------------FOOTER---------------*/

.footer-bg {
    background: url("../img/Group\ 35493.png");
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
}

.media-list {
    background-color: #D8E7FF;
    border-radius: 30px;
    width: fit-content;
    height: fit-content;
}

.media-icon {
    background-color: #136FFD;
    padding: 3px;
    border-radius: 30px;
    color: white;
}

/*--------------FOOTER---------------*/

/*--------------HOME-SECTION-1---------------*/
.carousel-indicators {
    position: absolute;
    left: 400px;
    display: flex;
    justify-content: end;
    padding: 0;
    border: 1px solid white;
    width: fit-content;
    background-color: #ffffff21;
}

.carousel-indicators [data-bs-target] {
    border-top: 5px solid transparent;
    border-bottom: 5px solid transparent;
}

.section-1-bg {
    background: url("../img/Banner\ \(16\).png");
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
}

.section-1-bg-sm {
    background: url("../img/Bg\ \(12\).png");
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
}

button.btn.fs-16.mt-3.fac-button {
    border: 2px solid #E66742;
    color: white;
    border-radius: 30px;
    padding: 5px 15px;
    width: fit-content;
}

.carousel-inner img {
    width: 100%;
    height: auto;
}

/* Custom styles for carousel indicators */
.carousel-indicators [data-bs-target] {
    background-color: #ffffff;
    /* Color of the dots */
    border-radius: 50%;
    /* Makes the dots circular */
    width: 12px;
    /* Size of the dots */
    height: 12px;
    /* Size of the dots */
    opacity: 0.5;
    /* Semi-transparent */
}

.carousel-indicators .active {
    background-color: #fff;
    /* Color of the active dot */
    opacity: 1;
    /* Fully opaque */
}

.filter-input-bg {
    border-radius: 50px;
    border: 1px solid #123984;
    margin-top: -50px;
    width: 65%;
}

input[type="date"]::-webkit-calendar-picker-indicator {
    display: none;
}

input[type="date"]::-webkit-inner-spin-button {
    display: none;
}

input[type="date"]::-webkit-clear-button {
    display: none;
}

input[type="date"] {
    appearance: none;
    -moz-appearance: textfield;
    /* For Firefox */
}

span#basic-addon1 {
    background-color: #123984;
    border-radius: 50px;
}

.input-group>:not(:first-child):not(.dropdown-menu):not(.valid-tooltip):not(.valid-feedback):not(.invalid-tooltip):not(.invalid-feedback) {
    border: none;
}

/*--------------HOME-SECTION-1---------------*/

/*--------------HOME-SECTION-2---------------*/
.form-control:focus {
    box-shadow: none;
}

.sec-2 .item {
    background: url("../img/card-bg.png");
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    fill: #FFF;
    filter: drop-shadow(0px 2.19px 4.38px rgba(62, 113, 225, 0.10)) drop-shadow(0px 8.03px 8.03px rgba(62, 113, 225, 0.09)) drop-shadow(0px -3.481px 1.95px rgba(62, 113, 225, 0.05)) drop-shadow(0px 31.389px 12.409px rgba(62, 113, 225, 0.01)) drop-shadow(0px 49.638px 13.869px rgba(62, 113, 225, 0.00));
}

.home-demo h2 {
    color: #000000;
}

.owl-nav button:hover {
    background: #123984 !important;
    color: white;
}

.custom-owl-nav {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.custom-owl-nav button {
    background: #333;
    color: #fff;
    border: none;
    padding: 10px 15px;
    cursor: pointer;
    transition: background 0.3s ease;
}

.custom-owl-nav button:hover {
    background: #555;
}

.blue-bg {
    background-color: #123984;
    border-radius: 15px;
}

.sec-2 .owl-stage-outer {
    padding: 20px 6px;
}

.badge-perc {
    width: 20% !important;
    height: 20% !important;
}

.badge-perc-2 {
    width: 30px !important;
    height: 30px !important;
}

.copy-btn {
    background-color: #123984;
    color: white;
    border-radius: 10px;
}

.copy-btn:hover {
    color: white;
    background-color: #4081ff;
}

.h-40px {
    height: 40px;
}

.h-35 {
    height: 35px !important;
}

.city-option {
    transition: all 0.2s;
}

.city-option:hover {
    background: #123984 !important;
    ;
    color: white;
    transition: all 0.2s;
}

/*--------------HOME-SECTION-2---------------*/

/*--------------HOME-SECTION-3---------------*/

.r2dc-card-bg {
    background-color: #E9F2FF;
    border-top-left-radius: 16px;
    border-top-right-radius: 16px;
}

.r2dc-card-content-bg {
    background-color: #E9F2FF;
    border-bottom-left-radius: 16px;
    border-bottom-right-radius: 16px;
}

.r2dc-card-content-bg img {
    width: 13px !important;
    height: 13px !important;

}

.save-icon {
    background: white;
    padding: 5px 10px 2px 10px;
    border-radius: 30px;
}

.save-icon-active {
    background: #123984;
    padding: 5px 10px 2px 10px;
    border-radius: 30px;
    color: white !important;
}

.save-icon-active * {
    color: white !important;
}

/*--------------HOME-SECTION-3---------------*/

/*--------------HOME-SECTION-4---------------*/

.bg-grey-sec-4 {
    background-color: #F6F6F7;
    border-radius: 20px;
}

.bdr-ryt-grey {
    border-right: 1px solid #CECECE;
}

/*--------------HOME-SECTION-4---------------*/

/*--------------HOME-SECTION-5---------------*/

.y-valam-card {
    background-color: #eef7ff;
    border-radius: 18px;
    height: 90px;
}

.y-valam-card img {
    width: 95px;
}

/*--------------HOME-SECTION-5---------------*/

/*--------------HOME-SECTION-6---------------*/

.ltt-bg {
    background: url('../img/subtract.png');
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    padding: 28px 0;
}

.ltt-bg * {
    padding-left: 5px;
}

.badge-perc-2 {
    width: 10%;
    height: 10%;
}

.bg-grey-sec-6 {
    background-color: #F6F6F7;
    border-radius: 20px;
    height: 277px;
}

.car-fits {
    height: 216px;
    width: 394px;
    margin-top: -20px;
}

/*--------------HOME-SECTION-6---------------*/

/*--------------HOME-SECTION-7---------------*/
.lightblue-bdr {
    border: 1px solid #52b2ff;
    border-radius: 20px;
}

.bg-grey {
    background: #f6f6f6;
}

.bg-my-light-blue {
    background: #b9e0ff;
}

.progress {
    height: 8px !important;
}

.progress-bar {
    background-color: #E66742;
}

/*--------------HOME-SECTION-7---------------*/

/*--------------HOME-SECTION-8---------------*/
.accordion-button {
    border: none;
    background-color: #f6f6f6;
    /* Default background color */
}

/* Change background color when active (open) */
.accordion-button:not(.collapsed) {
    background-color: #f6f6f6;
    color: #000;
    font-weight: 600;
    border: 3px solid #fff0;
    border-radius: 20px;
    box-shadow: none;
}

/* Optional: Adjust the accordion item border */
.accordion-item {
    border: none;
    /* Remove border from accordion item */
}

button.accordion-button.collapsed {
    border-radius: 15px;
}

/*--------------HOME-SECTION-8---------------*/

/*--------------HOME-SECTION-9---------------*/
.vt-img {
    border-top-left-radius: 15px;
    border-top-right-radius: 15px;
    height: 151px;
    width: 100% !important;
    object-fit: cover;
}

.vt-bg {
    background-color: #EEF7FF;
}

.back-btn {
    background-color: #4161a6;
    border: 1px solid rgba(255, 255, 255, 0.57);
}

.profile-bg {
    background-color: #f9fafb;
}

.border-dotted {
    border: 1px dashed #bdbdbd;
    /* Change color and size as needed */
}

.booking-header {
    background: url('../img/Banner (16).png');
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
}

.heart-icon {
    width: 80%;
}

.bg-blue {
    background-color: #123984;
}

.booking-table {
    background-color: #f9fafb;
    border-radius: 10px;
}

.booking-table tr td:nth-child(1) {
    padding-right: 50px;
}

.nav-pills .nav-link,
.nav-pills .show>.nav-link {
    color: #123984;
    background-color: white !important;
}

/*--------------HOME-SECTION-9---------------*/

.back-btn {
    background-color: #4161a6;
    border: 1px solid rgba(255, 255, 255, 0.57);
}

.b-confirm-bg {
    background-image: url('../assets/Booking\ Confermation.png');
    background-position: center center;
    background-size: cover;
    background-repeat: no-repeat;
}

.bg-blue {
    background-color: #123984 !important;
}

.check-icon {
    height: 10%;
    width: 10%;
}

.my-bc {
    box-shadow: 0px 0px 14.629px 0px #D3E8FF;
    border-radius: 27.429px;
    border: 0.914px solid #FFF;
    width: 50%;
}

/*.m-minus-top-48 {*/
/*    margin-top: -46px !important;*/
/*}*/

.bg-light-blue {
    background-color: #A7CBFF;
}

.bg-lightblue {
    background-color: #EEF7FF;
    padding: 5px 15px 5px 8px;
}

.date-modal-width {
    width: fit-content;
}

.my-blue-btn:hover {
    color: var(--bs-btn-hover-color);
    background-color: #123984 !important;
    border-color: var(--bs-btn-hover-border-color);
}

.flatpickr-time {
    line-height: 60px !important;
    max-height: 80px !important;
}

.flatpickr-calendar.hasTime .flatpickr-time {
    height: 60px !important;
    border-top: 1px solid #e6e6e6;
}

.flatpickr-time input {
    font-size: 20px;
}

.flatpickr-time input {
    height: 60px;
}

.flatpickr-time .numInputWrapper {
    height: 60px;
}

.numInputWrapper span {
    width: 20px;
}

.car-list-image{
    mix-blend-mode: darken;
    height: 200px;
    object-fit: contain;
    width: 100%;
}
.car-list-image-for-grid{
    mix-blend-mode: darken;
    height: 150px;
    object-fit: contain;
    width: 100%;
}
.cb-car-img{
    object-fit: contain;
    height:170px;
}

.mobile-head-width img{
     width: clamp(120px, 120px, 80px) !important;
}
.user-logout >*:hover {
    color: red !important;
    transition: all .4s ease-in-out;
}
.user-logout {
    transition: all .4s ease-in-out;
}

