/* Carousel Block Styles (Editor preview helpers) */

.wp-block-venari-carousel {
    background: linear-gradient(to bottom, #111827, #000000);
    color: white;
    padding: 3rem 2rem;
    border-radius: 12px;
}

.wp-block-venari-carousel h2,
.wp-block-venari-carousel p { color: white; }
.wp-block-venari-carousel .text-saas-text-muted { color: rgba(156, 163, 175, 1) !important; }

.wp-block-venari-carousel .carousel-track,
.wp-block-acf-carousel .carousel-track,
[id^="carousel-track-"] {
    display: flex;
    gap: 1.5rem;
    overflow-x: auto;
    overflow-y: hidden;
    scroll-snap-type: x mandatory;
    padding-bottom: 0; /* remove extra bottom space that exposes scrollbar */
    -ms-overflow-style: none; /* IE and Edge */
    scrollbar-width: none;    /* Firefox */
}

.wp-block-venari-carousel .carousel-track::-webkit-scrollbar,
.wp-block-acf-carousel .carousel-track::-webkit-scrollbar,
[id^="carousel-track-"]::-webkit-scrollbar {
    display: none;
    width: 0;
    height: 0;
}

.wp-block-venari-carousel .slide-card,
.wp-block-acf-carousel .slide-card,
[id^="carousel-track-"] .slide-card {
    scroll-snap-align: start;
    flex: 0 0 20rem; /* fixed base width so cards don't shrink */
    min-width: 20rem; /* reasonable editor width */
    background: rgba(75, 85, 99, 0.10);
    border: 1px solid rgba(75, 85, 99, 0.20);
    border-radius: 16px;
    overflow: hidden;
}

/* Position nav centrally over the track */
.carousel-wrapper,
.wp-block-venari-carousel .carousel-wrapper,
.wp-block-acf-carousel .carousel-wrapper { position: relative; }



.wp-block-venari-carousel .carousel-nav .carousel-prev,
.wp-block-venari-carousel .carousel-nav .carousel-next,
.wp-block-acf-carousel .carousel-nav .carousel-prev,
.wp-block-acf-carousel .carousel-nav .carousel-next {
    pointer-events: auto;
    z-index: 2;
}

/* Aspect ratio helper */
.wp-block-venari-carousel .aspect-video,
.wp-block-acf-carousel .aspect-video,
.carousel-wrapper .aspect-video { position: relative; width:100%; height:0; padding-bottom:56.25%; }
.wp-block-venari-carousel .aspect-video > img,
.wp-block-acf-carousel .aspect-video > img,
.carousel-wrapper .aspect-video > img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }

/* remove duplicate bottom spacing rule to prevent misplacement */

/* Ensure full available width in the editor */
.editor-styles-wrapper .wp-block-acf-carousel,
.editor-styles-wrapper .wp-block[data-type="acf/carousel"] { max-width: none !important; width: 100% !important; }