body {
      font-family: Proxima Nova;
      color: #333;
      background-color: darkslategrey !important;
      margin: 0;
      padding: 0;
    }
    .bg-primary{
        background-color:darkslategrey !important;
    }
.navbar {
    margin-bottom: 0;
    background-color: #4c6d6d !important;
}
.nav-item .nav-link{
    color:gold !Important;
}
.navbar-nav .nav-link {
    position: relative;
    color: darkslategrey; /* Default text color */
    font-weight: 600;
    padding: 10px 15px;
    font-size:18px;
    letter-spacing: 0.6px;
    transition: color 0.3s ease-in-out;
}

/* Hover effect */
.navbar-nav .nav-link:hover {
    color: gold; /* Change text color */
}

/* Underline effect */
.navbar-nav .nav-link::after {
    content: "";
    position: absolute;
    left: 50%;
    bottom: 0;
    width: 0;
    height: 3px;
    background: gold;
    transition: all 0.5s ease-in-out;
    transform: translateX(-50%);
}

/* Expand underline on hover */
.navbar-nav .nav-link:hover::after {
    width: 90%;
}
.modern-logo {
    font-family: 'Montserrat', sans-serif;
    font-size: 2rem;
    font-weight: 700;
    letter-spacing: 1.5px;
    color: #212529;
    text-transform: uppercase;
    text-decoration: none;
}

.modern-logo span {
    color: gold !important; /* Blue for contrast (Bootstrap primary) */
}


/* Active link styling */
.navbar-nav .nav-item .nav-link.active {
    color: #ffea78 !important; /* Active text color */
    font-weight: bold; /* Make active link bolder */
}

/* Active link underline */
.navbar-nav .nav-item .nav-link.active::after {
    width: 80%;
     height: 1.2px;
     background: #ffea78;
}

 /* Header Section */
    header {
      background: #608686 !important;
      color: #fff;
      padding: 60px 0;
      text-align: center;
    }
    header h1 {
      font-size: 3rem;
      font-weight: 700;
      margin: 0;
    }
    header p {
      font-size: 1.25rem;
      margin-top: 10px;
    }
    
#locationSelect{
    padding: 20px 10px;
    border-radius:0px !important;
    text-align: center;
    font-weight:600;
    color:darkslategrey;
    font-size: 16px; 
    font-weight: bold; 
    cursor: pointer;
}

/* Style the options inside select */
#locationSelect option {
    background-color: darkslategrey;
    border-radius:0px ;
    border: none;
    color: gold; /* Text color */
    font-size: 16px; /* Font size */
    font-weight: 600; 
    padding: 15px;
}

/* Hover effect for options (limited in some browsers) */
#locationSelect option:hover {
    background-color: #ffc107; /* Highlight on hover */
    color: #fff; /* White text */
}


#locationInput{
     padding: 20px 10px;
    border-radius:0;
}
#locationInput::placeholder {
    color: darkslategrey;
    opacity: 1; /* Ensure full visibility */
    font-weight: 600 ;
    text-align:center;
}

#locationInput {
    color: darkslategrey; /* Change typing text color */
    font-weight: 600 ;
    text-align:center;
}
#locationBtn{
    padding: 20px 20px;
    border-radius:0;
    background: gold;
    color: darkslategrey;
    font-weight: 600;
    border: none;
    transition: all 0.3s ease-in-out;
}
#locationBtn:hover {
    background: #4c6d6d ; /* Change background */
    color: gold; /* Change text color */
    transform: scale(1.05); /* Slight zoom effect */
    box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.2); /* Soft shadow */
}
#search{
    min-height:25vh;
}
#search input.form-control:focus,
#search select.form-control:focus {
    color: #212529;
    background-color: #fff;
    border-color: #86b7fe;
    outline: 0;
    box-shadow: 0px 0px 4px .1rem rgb(218 182 7 / 46%);
    border: 2px solid #ffc107;
}

.hero {
    min-height: 50vh;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
}

.hero .btn {
    margin-top: 20px;
}

.section-title {
    margin-bottom: 40px;
    font-size: 2.5rem;
}
#carListSection{
    background-color:#9fdfdf !Important;
}

.carListCard{
    background-color:darkslategrey !important;
    color:gold;
    border-radius: 0;
    box-shadow: 6px 8px 10px darkslategrey !important;
}
.carListFooter{
    border: none;
    border-radius: 0 !important;
}

.carListFooterBtn{
    background: darkslategrey;
    border: none;
    font-weight:600;
    border-radius: 0;
    transition: all 0.3s ease-in-out;
    
}
.carListFooterBtn:hover{
    background: gold !Important;
    color: darkslategrey;
    transform: scale(1.05); /* Slight zoom effect */
    box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.2); /* Soft shadow */
}
.card h5 {
    font-size: 1.5rem;
}

.card p {
    font-size: 1rem;
}

#about{
    background-color:#4c6d6d !important;
}
.service-section-text{
    font-size:16px;
    font-weight:400;
    padding: 0 100px;
}
.services-icon{
    font-size:100px;
    color:darkslategrey !Important;
}
.services-section-card{
    border:none;
    border-radius: 0 !Important;
    box-shadow: 5px 5px 5px rgb(0,0,0,0.5) !important;
    
}
.services-section-card-heading{
    font-weight:600 !Important;
}
#contact-header {
    background: transparent !important
}
.contact-section-card{
     border:none;
    border-radius: 0 !Important;
    box-shadow: 5px 5px 5px rgb(0,0,0,0.9) !important;
}
.form-control-manual{
     border-radius:0;
     border: 2px solid gold;
     color: darkslategrey !Important; /* Change typing text color */
    font-weight: 600 ;
}
.input-group:not(.has-validation)>.dropdown-toggle:nth-last-child(n+3), .input-group:not(.has-validation)>:not(:last-child):not(.dropdown-toggle):not(.dropdown-menu) {
    border: 0 !important;
    border-radius: 0px;
    background: gold;
}
.contact-section-btn{
    border: none;
    border-radius: 0;
    background-color: gold !Important;
    font-weight: 600;
    color: darkslategrey;
}
.contact-section-btn:hover {
    background: #4c6d6d !Important; /* Change background */
    color: gold; /* Change text color */
    transform: scale(1.05); /* Slight zoom effect */
    box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.2); /* Soft shadow */
}
/*.bi::before, [class^="bi-"]::before, [class*=" bi-"]::before {*/
/*    display: inline-block;*/
/*    font-family: bootstrap-icons !important;*/
/*    font-style: normal;*/
    /* font-weight: normal !important; */
/*    font-variant: normal;*/
/*    text-transform: none;*/
/*    line-height: 1;*/
/*    vertical-align: -.125em;*/
/*    -webkit-font-smoothing: antialiased;*/
/*    font-size: 20px !important;*/
/*    color: darkslategrey !important;*/
/*    font-weight: bold !important;*/
/*    -moz-osx-font-smoothing: grayscale;*/
/*}*/

#contact input.form-control:focus,
#contact textarea.form-control:focus{
    color: #212529;
    background-color: #fff;
    border-color: #86b7fe;
    outline: 0;
   box-shadow: 0px 0px 4px .1rem rgb(0 0 0 / 46%) !important;
    border: 2px solid darkslategrey;
}

.form-control-manual::placeholder {
    color: darkslategrey;
    opacity: 1; /* Ensure full visibility */
    font-weight: 600 ;
    /*text-align:center;*/
}

/*footer {*/
/*    margin-top: 50px;*/
/*}*/


.card {
    margin-bottom: 20px !important;
}
.pagination {
    justify-content: center !important;
}
.car-photos img {
    width: 100px !important;
    height: 60px !important;
}
/* Unique modal size */
.custom-modal-dialog {
    max-width: 90vw;  /* 90% of viewport width */
    height: 90vh;     /* 90% of viewport height */
}

/* Unique modal body */
.custom-modal-body {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 80vh; /* 80% of viewport height */
}

/* Custom carousel image styles */
.custom-carousel-item img {
    max-height: 80vh; /* 80% of viewport height */
    max-width: 100%;
    object-fit: contain; /* Keep aspect ratio */
    cursor: pointer;
}

/* Smooth zoom effect on hover */
.custom-carousel-item img:hover {
    transform: scale(1.1);
    transition: transform 0.4s ease-in-out;
}
/* FOOTER */
    .footer {
      background-color: #4c6d6d   !important;
      color: #fff;
      padding: 2rem 0;
      font-size: 0.9rem;
    }
    .footer a {
      color: #f1c40f;
    }
    .footer .social-icon {
      font-size: 1.5rem;
      margin-right: 1rem;
      transition: transform 0.3s ease;
    }
    .footer .social-icon:hover {
      transform: scale(1.1);
    }






/*For Mobile Responsives CSS*/
/* Remove underline on mobile screens (max-width: 767px) */
@media (max-width: 767px) {
    .navbar-nav .nav-link::after {
        display: none; /* Hide the underline */
    }
    
    .navbar-nav .nav-link:hover::after {
        width: 0; /* Remove the hover underline effect */
    }
    
    .navbar-nav .nav-item .nav-link.active::after {
        display: none; /* Remove the active underline effect */
        font-size: 25px;
    }
}