/* ================================================================
   ES - Slider Bakery  |  Frontend Styles
   ================================================================ */

/* ── Container ──────────────────────────────────────────────── */
.esb-slider {
    position: relative;
    width: 100%;
    overflow: hidden;
    background: #111;
    aspect-ratio: 16 / 9;   /* default — overridden by height="" attr */
    user-select: none;
    -webkit-user-select: none;
}

/* ── Track — the moving horizontal strip ────────────────────── */
.esb-track {
    display: flex;
    height: 100%;
    will-change: transform;
    transform: translateX(0);
    transition: transform 0.85s cubic-bezier(0.76, 0, 0.24, 1);
}

/* ── Individual slide ───────────────────────────────────────── */
.esb-slide {
    min-width: 100%;
    width: 100%;
    height: 100%;
    flex-shrink: 0;
    overflow: hidden;
}

/* ── Slide image ────────────────────────────────────────────── */
.esb-slide img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    pointer-events: none;
    -webkit-user-drag: none;
}

/* ── Respect prefers-reduced-motion ────────────────────────── */
@media (prefers-reduced-motion: reduce) {
    .esb-track {
        transition: none !important;
    }
}