/* Swiper navigation buttons */
.swiper-button-next, .swiper-button-prev {
    background-color: #DAA06A; /* primary-500 */
    border-radius: 50%; /* Circular buttons */
    display: flex;
    width: 35px; /* Slightly larger button size */
    height: 35px; /* Slightly larger button size */
    align-items: center;
    justify-content: center;
    color: white; /* Arrow color */
    transition: background-color 0.3s, transform 0.2s; /* Added transform for hover effect */
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2); /* Subtle shadow for depth */
}

/* Hover effect for buttons */
.swiper-button-next:hover, .swiper-button-prev:hover {
    background-color: #C78F5A; /* primary-600 (slightly darker) */
    transform: scale(1.1); /* Slight scale-up on hover for better interaction */
}

/* Arrow size and weight */
.swiper-button-next::after,
.swiper-button-prev::after {
    font-size: 20px; /* Increased arrow size for better visibility */
    font-weight: 950; /* Slightly lighter weight for cleaner look */
}

/* Swiper pagination bullets */
.swiper-pagination-bullet {
    background-color: #FF9800; /* Orange for inactive bullets */
    opacity: 0.5;
    width: 10px; /* Slightly larger bullets for consistency */
    height: 10px;
}
.swiper-pagination-bullet-active {
    background-color: #F57C00; /* Slightly darker orange for active bullet */
    opacity: 1;
}




/* Remove spinner arrows for number inputs */
input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0;
}