/* Style for enabled options */
select option {
    color: #000; /* Normal text color */
    background-color: #fff; /* Normal background color */
}

/* Style for disabled options */
select option:disabled {
    color: #999; /* Light text color */
    background-color: #f9f9f9; /* Light background color */
    cursor: not-allowed; /* Show a "not-allowed" cursor */
}

/* Add some hover effects for enabled options (optional) */
select option:not(:disabled):hover {
    background-color: #f0f8ff;
}

.dropdown li span {
    display: inline !important;
    padding: 0 3px !important;
    font-size: 18px !important;
    width: max-content;
}
.dropdown-item{
    display: flex !important;
    align-items: baseline !important;
    gap: 5px;
}
.dropdown-item:not(.notification-item):hover span{
    color: white !important;
    background-color: var(--primary-color) !important;
}

.dropdown-item:not(.notification-item):hover {
    color: #eff1f5;
    background-color: var(--primary-color);
}

/* img.logo-1{
    filter: brightness(0) invert(1) !important;
} */
.signup-btn{
    background: transparent !important;
}

.btn-main{
    border: 3px solid #ff6e18 !important;

}



/* Logo */
.logo-section #logo img  {
    
    height: 70px;
    transition: all 0.3s ease-in-out;
    /* filter: brightness(0) invert(1) !important; */
}
.logo-2{
    height: auto;
    transition: all 0.3s ease-in-out;
    /* filter: brightness(0) invert(1) !important; */

}
.logo-section #logo img:hover {
    transform: scale(1.1);
}

/* Menu Styling */

#mainmenu .menu-item {
    text-decoration: none;
    color: #fff;
    font-size: 1.2rem;
    font-weight: bold;
    display: flex;
    align-items: center;
    gap: 8px;
    transition: color 0.3s ease-in-out;
}
#mainmenu .menu-item:hover {
    color: var(--primary-color);
}

/* Auth Buttons */
.btn-main {
    display: inline-block;
    padding: 10px 20px;
    border-radius: 25px;
    font-size: 14px;
    font-weight: bold;
    text-align: center;
    text-decoration: none;
    color: #fff;
    background: linear-gradient(90deg, var(--primary-color), var(--secondary-color));
    transition: all 0.3s ease-in-out;
}
.btn-main:hover {
    opacity: 0.9;
}




.view-cars-by-model:hover{
    cursor: pointer;
}

footer .logo-1{
    filter: unset !important;
}

dd{
    white-space: normal;
  word-wrap: break-word;
}
#car-filter-form-mark h5{
    text-transform: uppercase;
}

#car-filter-form-mark   .form-control{
    border: solid 1px rgb(26, 26, 26);
    padding: 12px;
    border-radius: 10px;
}
.filter-data{
    width: 70vw;
    max-width: 500px;
    height: 60px;
    background: #252527;
    background-repeat: repeat;
    background-size: auto;
    margin: auto;
    border-radius: 24px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    color: #fff;
}
.currency{
    font-size: 12px !important;
    display: inline-block !important;
}
.carPrice{
    font-size: 20px !important;
    display: inline-block !important;

}
.carTotalPrice{
    color: #110f0d78 !important;
    font-size: 17px !important;
}

.sticky {
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 10;
    background-color: #252527;
    padding: 10px 0;
    transition: all 0.3s ease-in-out;
}

.booking-summary{
    background: #f4f4f9;
    padding: 10px;
}
.pickup-icon {
    position: relative;
    top: 0.2rem;
}
.dropoff-icon{
    position: relative;
    top: 5.8rem;
}
.pickup-icon:before {
    background: black;
    content: "";
    height: 90px;
    left: 11px;
    position: absolute;
    top: 25px;
    width: 0.063rem;
}
.car-summary-image{
    transform: scale(1.5);
  margin-top: 10px;
}
.btn-outline-secondary{
    color: var(--primary-color) !important;
    border-color: var(--primary-color) !important;
}

.btn-secondary {
    background-color: var(--primary-color) !important;
}

.view-all-cars{
    background-color: var(--primary-color) !important;
    border-color: var(--primary-color) !important;
}

.title-line::after {
    margin: 0 0 0 20px;
    flex: 1;
    position: relative;
    right: 18px;
}
.title-line::before {
    margin: 0 0 0 20px;
    flex: 1;
    position: relative;
    right: 0px;
}

.form-check-input:checked  + label::before {
    background-color: var(--primary-color) !important;
}
.de_form input[type="checkbox"] + label::before{
    /* margin-top: 15px !important; */
}
.de_form input[type="checkbox"] + label img{
    height: 50px !important; 
}

.default-car-image{
    width: 500px;
    height: 250px;
    object-fit: contain;
}

.summary-totalPrice{
    color: #2d2f31 !important;
    font-weight: bold !important;
}

.locationPickupSpan{
    font-size: 0.8rem;
  color: rgb(130,130,135);
}

#summary-pickup-location,
#summary-dropoff-location{
    color: black;
    font-weight: bold;
    font-size: 0.8rem;
}

#summary-pickup-date, #summary-dropOff-date, #summary-pickup-time, #summary-dropOff-time{
    color: black;
  font-size: 0.75rem;
}
#summary-priceDistance, 
#summary-distanceDiff,
#summary-distance-between-car-location-pickup-location,
#summary-deliver-car-expense,
#summary-deliver-car-time
.summary-option
{
    color: black;
    font-weight: bold;
}

.search-input{
    background-color: white;    
    background-image: url('../images/searchicon.png');
    background-position: 8px 8px; 
    background-repeat: no-repeat;
    padding: 5px 20px 5px 40px;
}

.select-status-booking{
    padding: 5px 20px 5px 10px;
}


/* DROP ZONE PART */
/* Custom Dropzone Styling */
.custom-dropzone {
    position: relative;
    border: 2px dashed #ccc;
    border-radius: 8px;
    padding: 20px;
    text-align: center;
    background-color: #f9f9f9;
    cursor: pointer;
    transition: border-color 0.3s ease;
}

.custom-dropzone:hover {
    border-color: #007bff;
}

.custom-dropzone input[type="file"] {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    cursor: pointer;
}

.dropzone-area {
    pointer-events: none; /* Ensure the text area doesn't interfere with file input */
}

.dropzone-text {
    color: #666;
    font-size: 16px;
}

/* Highlight when dragging files over */
.custom-dropzone.dragover {
    border-color: #007bff;
    background-color: #e9f5ff;
}

#pickupImagesPaths, #dropoffImagesPaths{
    display: flex;
    display: flex;
    align-items: baseline;
    gap: 15px;
}

.pickup-icon i, .dropoff-icon i{
    color: black;
    font-size: 1.5rem;
    
}
  
.date-location-summary{
    height: 11rem !important;
    margin-top: 2rem;
}

.pickup-summary{
    height: 5.9rem;
}

.de-menu-notification span.badge{
    position: relative;
    bottom: 14px;
    left: 19px;
    background: #f46c36;
    border-radius: 50%;
    text-align: center;
}
.de-menu-notification i{
    font-size: 1.5rem !important;
    color: #0a0a09 !important;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}
.de-menu-notification{
    background: #f0eded !important;
}

.de-submenu-notification{
    right: 6vw !important;
    width: 350px !important;
    top: 7vh;
}

.notification-desc{
    white-space: normal;
  word-wrap: break-word;
}
.text-orange{
    color: var(--primary-color);
}

.card-body{
    padding: 1rem !important;
}

.form-control[readonly] {
    background-color: white !important;
}