/* Container */
.inffni-360-widget-container {
    width: 100%;
    position: relative;
    overflow: hidden;
}

.inffni-360-carousel {
    width: 100%;
    position: relative;
}

/* Media Layer */
.inffni-media-container {
    width: 100%;
    position: relative;
    overflow: hidden;
    /* aspect-ratio set by inline style */
}

.inffni-media-element {
    width: 100%;
    height: 100%;
    display: block;
    /* object-fit set by inline style */
}

/* Content Overlay */
.inffni-overlay-container {
    position: absolute;
    top: 0; left: 0; right: 0; bottom: 0;
    z-index: 10;
    pointer-events: none; /* Let clicks pass through to media if needed, but buttons need events */
    display: flex;
    padding: 40px;
    /* alignments set by control */
}

.inffni-overlay-inner {
    max-width: 100%;
    pointer-events: auto; /* Re-enable events for content */
}

/* Typography & Buttons */
.inffni-slide-title, .inffni-slide-title a {
    text-decoration: none;
    margin-top: 0;
}

.inffni-badge {
    max-width: 100px;
    margin-bottom: 15px;
    display: block;
}

.inffni-buttons-row {
    display: flex;
    flex-wrap: wrap;
    margin-top: 20px;
}

.inffni-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    transition: all 0.3s ease;
    border: 1px solid transparent;
}

/* Navigation - Arrows */
.inffni-360-carousel .swiper-button-next,
.inffni-360-carousel .swiper-button-prev {
    transition: opacity 0.3s;
}

.inffni-360-carousel.arrows-autohide .swiper-button-next,
.inffni-360-carousel.arrows-autohide .swiper-button-prev {
    opacity: 0;
}

.inffni-360-carousel.arrows-autohide:hover .swiper-button-next,
.inffni-360-carousel.arrows-autohide:hover .swiper-button-prev {
    opacity: 1;
}

/* Navigation - Pagination (The Progress Bar) */
.inffni-360-carousel .swiper-pagination {
    bottom: 20px;
    display: flex;
    justify-content: center;
    gap: 8px;
    z-index: 20;
}

.inffni-360-carousel .swiper-pagination-bullet {
    border-radius: 2px;
    opacity: 1;
    background: rgba(255,255,255,0.3);
    position: relative;
    overflow: hidden;
    margin: 0 !important;
    transition: width 0.3s;
}

.inffni-pagination-fill {
    position: absolute;
    left: 0; top: 0; bottom: 0;
    width: 0%;
    background-color: #fff;
    display: block;
    z-index: 2;
}