/* =====================================================
   Infinite Carousel Pro – Public Styles
   ===================================================== */

.icp-carousel-wrapper {
    position: relative;
    width: 100%;
    overflow: hidden;
    height: var(--icp-height, 300px);
    cursor: grab;
    user-select: none;
    -webkit-user-select: none;
}

.icp-carousel-wrapper:active,
.icp-carousel-wrapper.icp-dragging {
    cursor: grabbing;
}

/* The track holds two copies of the slides for infinite loop */
.icp-track {
    display: flex;
    flex-wrap: nowrap;
    gap: var(--icp-gap, 20px);
    height: 100%;
    will-change: transform;
    touch-action: pan-y;
}

/* Individual slide */
.icp-slide {
    flex: 0 0 auto;
    width: 400px;
    height: 100%;
    overflow: hidden;
    position: relative;
}

/* Media inside slide */
.icp-media {
    display: block;
    width: 100%;
    height: 100% !important;
    object-fit: cover;
    pointer-events: none;
    border-radius: inherit;
}

/* Error state */
.icp-error {
    padding: 12px 18px;
    background: #fee2e2;
    color: #dc2626;
    border: 1px solid #fca5a5;
    border-radius: 8px;
    font-size: 14px;
    font-family: sans-serif;
}

/* Responsive heights */
@media (max-width: 768px) {
    .icp-carousel-wrapper {
        height: calc(var(--icp-height, 300px) * 0.65) !important;
    }
    .icp-slide {
    width: 200px;
}
}
@media (max-width: 480px) {
    .icp-carousel-wrapper {
        height: calc(var(--icp-height, 300px) * 0.45) !important;
    }
    .icp-carousel-wrapper::before,
    .icp-carousel-wrapper::after {
        width: 30px;
    }
}