/* ==========================================================================
 * Ragazzo Control Panel® · Widget de Slides — CSS BASE (mecânica comum a todos os temas)
 * --------------------------------------------------------------------------
 * Apenas estrutura/funcionamento do carrossel. O "visual" (cores, legenda,
 * proporção, raio, full-bleed, etc.) fica em cada skin: skins/{tema}.css.
 * Autossuficiente: não depende de jQuery nem de classes do tema.
 * ========================================================================== */
.wcslide {
    --wcs-ease: cubic-bezier(.4, 0, .2, 1);
    position: relative;
    isolation: isolate;
}

/* ---- Trilho / slides ---- */
.wcslide-viewport { overflow: hidden; border-radius: inherit; }
.wcslide-track {
    display: flex;
    transition: transform .6s var(--wcs-ease);
    will-change: transform;
    /* Arrasta e solta: rolagem vertical nativa, gesto horizontal controlado pelo JS */
    touch-action: pan-y;
    -webkit-user-select: none;
    -ms-user-select: none;
    user-select: none;
    cursor: grab;
}
.wcslide-track:active { cursor: grabbing; }
/* Impede o "fantasma" de arraste nativo (imagem E link <a>) ao puxar o slide.
 * A âncora .wcslide-media é draggable por padrão; sem isto o navegador inicia
 * o arraste nativo do link e cancela o gesto de swipe (pointercancel). */
.wcslide-track,
.wcslide-media,
.wcslide-media img,
.wcslide-media picture { -webkit-user-drag: none; -khtml-user-drag: none; user-drag: none; }
.wcslide-slide {
    position: relative;
    flex: 0 0 100%;
    min-width: 0;
}

/* ---- Mídia (a altura/proporção é definida por cada skin) ---- */
.wcslide-media { display: block; position: relative; width: 100%; }
.wcslide-media picture { display: block; width: 100%; height: 100%; }
.wcslide-media img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

/* ---- Setas: posição base (o visual fino fica no skin) ---- */
.wcslide-nav {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    z-index: 3;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 0;
    cursor: pointer;
}
.wcslide-prev { left: 16px; }
.wcslide-next { right: 16px; }

/* ---- Dots: posição base ---- */
.wcslide-dots {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 1rem;
    z-index: 3;
    display: flex;
    justify-content: center;
    gap: .5rem;
}
.wcslide-dot { padding: 0; border: 0; cursor: pointer; background: none; }

/* ---- Legenda: clique passa para o link da mídia; CTA reativa o ponteiro ---- */
.wcslide-caption { pointer-events: none; }
.wcslide-cta { pointer-events: auto; }

/* ---- Slide único: sem navegação ---- */
.wcslide.is-single .wcslide-nav,
.wcslide.is-single .wcslide-dots,
.wcslide.is-single .wcslide-progress { display: none; }

/* ---- Acessibilidade: reduz movimento ---- */
@media (prefers-reduced-motion: reduce) {
    .wcslide-track { transition: none; }
}