/* Gallery Container */
.daiven-gallery-carousel {
    display: flex;
    overflow: hidden;
    border-radius: 0px;
}

/* Individual Gallery Item */
.daiven-gallery-slide {
    margin: 0;
    flex: 0 0 auto;
    width: calc(100% / 3); /* Adjust this based on your layout */
    transition: all 0.3s ease;
}

/* Image Styling */
.daiven-gallery-slide img {
    transition: transform 0.3s ease-in-out, opacity 0.3s ease-in-out, filter 0.3s ease-in-out;
    width: 100%;
    height: auto;
    border-radius: 0px;
}

/* Hover Effect for Images */
.daiven-gallery-slide:hover img {
    transform: scale(1.0);
    transition: all 0.3s ease;
}

/* Slick Navigation Arrows */
.daiven-gallery-carousel .slick-prev,
.daiven-gallery-carousel .slick-next {
    background-color: rgba(0, 0, 0, 0.5); /* Transparent background */
    border-radius: 50%; /* Rounded arrows */
    color: #fff; /* White color for arrows */
    font-size: 20px; /* Increase font size for better visibility */
    padding: 10px;
    transition: background-color 0.3s ease, transform 0.3s ease; /* Smooth transition */
    z-index: 1;
    display: flex; /* Flexbox for centering */
    align-items: center; /* Vertically center */
    justify-content: center; /* Horizontally center */
}
.daiven-gallery-carousel .slick-prev::before,
.daiven-gallery-carousel .slick-next::before {
    font-family: "slick"; /* Ensure we are using the correct icon font */
    content: ''; /* Remove any default content */
    font-size: 24px; /* Increase icon size */
}
.daiven-gallery-carousel .slick-prev {
    left: 10px;
}

.daiven-gallery-carousel .slick-next {
    right: 10px;
}
/* Arrow hover effect */
.daiven-gallery-carousel .slick-prev:hover,
.daiven-gallery-carousel .slick-next:hover {
    background-color: rgba(255, 255, 255, 0.8); /* Light background on hover */
    transform: scale(1.1); /* Slight zoom effect */
}

/* Pagination Dots */
/* Polished Pagination Dots */
.daiven-gallery-carousel .slick-dots {
    position: absolute;
    bottom: 10px;
    width: 100%;
    text-align: center;
    display: flex;
    justify-content: center; /* Center dots horizontally */
    align-items: center; /* Align dots vertically */
}
/* Style for each dot */
.daiven-gallery-carousel .slick-dots li {
    display: inline-block;
    margin: 0 5px; /* Adjust space between dots */
}

/* Style for each dot */
.daiven-gallery-carousel .slick-dots li button {
    background-color: #fff; /* White color for dots */
    border-radius: 50%; /* Make the dots round */
    width: 12px; /* Increase size of dots */
    height: 12px; 
    border: 2px solid rgba(0, 0, 0, 0.5); /* Subtle border around the dots */
    transition: background-color 0.3s ease, transform 0.3s ease; /* Smooth transition for hover and active states */
    display: block; /* Make button a block element to ensure it fills the li */
    position: relative;
}

/* Active dot style */
.daiven-gallery-carousel .slick-dots li.slick-active button {
    background-color: #333; /* Dark background for active dot */
    border-color: #fff; /* White border for active dot */
    transform: scale(1.2); /* Slightly enlarge the active dot */
}

/* Hover effect for dots */
.daiven-gallery-carousel .slick-dots li button:hover {
    background-color: #666; /* Darker background on hover */
    transform: scale(1.1); /* Slight zoom effect */
}

/* Custom Border Styling */
.daiven-gallery-carousel {
    border: 0px; /* Default border style */
    border-radius: 0px; /* Rounded corners */
}

/* Optional: Additional styling for customized border */
.daiven-gallery-carousel.daiven-gallery-border {
    border: 2px solid #000;
}

/* Make sure the gallery items are responsive */
@media (max-width: 768px) {
    .daiven-gallery-slide {
        width: calc(100% / 2); /* 2 items per row on smaller screens */
    }
}

@media (max-width: 480px) {
    .daiven-gallery-slide {
        width: 100%; /* 1 item per row on very small screens */
    }
}