/* Add styles for the carousel */
.car-card-carousel-container {
    width: 100%;
    margin: 0 auto;
	background-color:transparent!important;
}

.swiper-container {
    width: 100%;
    max-width: 100vw; /* Ensures it does not exceed viewport width */
    overflow: hidden; /* Prevents slides from overflowing */
}

.swiper-slide {
    display: flex;
	   flex-shrink: 0;
    justify-content: center;
    align-items: center;
    padding: 20px;
	width: auto; /* Allows the slides to size properly */
}

.car-carousel {
    background-color: #fff;
    padding: 15px;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
    text-align: center;
}

.car-carousel-card{
	position:relative;
}

.car-carousel-card h3{
	padding-bottom:5px;
	margin-bottom:5px;
	font-size:16px!important;
	color:black!important;
}

.price-box-left h4{
	color:white!important;
	font-size:14px!important;
	margin-bottom:15px!important;
}
.price-box-right h4{
	color:white!important;
	font-size:14px!important;
	margin-bottom:15px!important;
}

.carousel-car-details-info-container{
   display: flex;
    flex-wrap: wrap;
    gap: 15px;
    align-items: center;
    padding: 0px 20px 15px 20px;

}

.carousel-car-card-button{
	    background: var(--background-button-1-color);
    color: var(--button-1-color);
	padding:5px 15px 5px 15px;
border-radius: 10px;
	text-decoration:none!important;
}

.carousel-car-card-button:hover{
		    background: var(--background-button-2-color);
    color: var(--button-2-color);
}


.swiper-button-next,
.swiper-button-prev {
    color: var(--button-1-color);
	background:var(--background-button-1-color);
	border-radius: 15px!important;
	padding:2px!important;
	font-size:10px!important;
}

.swiper-pagination {
    position: relative !important; /* Ensures it stays below the carousel */
    margin-top: 10px; /* Space between carousel and bullets */
    margin-bottom: 20px; /* 20px margin at the bottom */
    text-align: center; /* Centers the bullets */
}

.swiper-pagination-bullet {
    background: var(--background-button-1-color) !important; /* Ensures white bullets */
    opacity: 1; /* Makes them fully visible */
}

.swiper-pagination-bullet-active {
    background: var(--background-button-2-color) !important; /* Ensures active bullet is also white */
}
/* CSS Document */