/*
 * /cassino (views/cassino/page.php). O header.php inclui este arquivo sozinho nesta página, depois do pages.css e
 * das cores do admin (mesma posição do antigo <style> da view).
 */

/* Cards que chegam pelo JSON (rolagem e busca): entrada suave */
@keyframes cassCardIn {
    from { opacity: 0; transform: translateY(16px) scale(0.94); }
    to   { opacity: 1; transform: translateY(0) scale(1); }
}
.xb-page--cassino .casino-js-card { animation: cassCardIn 0.38s ease-out both; }
@media (prefers-reduced-motion: reduce) {
    .xb-page--cassino .casino-js-card { animation: none; }
}

/* Provedores: pílulas do layout novo (sports-provider-pill) com estado ativo e setas no desktop */
.xb-page--cassino .xb-cassino-providers { position: relative; scroll-margin-top: calc(var(--header, 60px) + 16px); }
.xb-page--cassino .xb-cassino-providers .sports-provider-slider { margin: 0; }
.xb-page--cassino .xb-cassino-providers .sports-provider-slider-track { padding: 6px 4px 8px; }
.xb-page--cassino .xb-cassino-providers .sports-provider-slider-track.is-dragging { cursor: grabbing; scroll-snap-type: none; }
.xb-page--cassino .sports-provider-pill { transition: border-color .16s, box-shadow .16s; }
.xb-page--cassino .sports-provider-pill:hover { border-color: rgb(var(--theme-primary-rgb, 6 224 91) / .6); }
.xb-page--cassino .sports-provider-pill.is-active {
    border-color: var(--color-primary, #06e05b);
    box-shadow: inset 0 0 0 1px var(--color-primary, #06e05b), 0 0 12px rgb(var(--theme-primary-rgb, 6 224 91) / .35);
}
/* Pílula de provedor sem logo: nome em texto (a home tem a mesma regra em css/pages/home.css) */
.xb-page--cassino .xb-provider-pill-text {
    max-width: 88%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
    color: #fff; font-size: 12px; font-weight: 900; letter-spacing: .04em; text-transform: uppercase;
}
.xb-page--cassino .sports-provider-pill.is-active .xb-provider-pill-text { color: var(--color-primary, #06e05b); }
.xb-page--cassino .xb-cassino-providers__arrow { display: none; }
@media (min-width: 1024px) {
    .xb-page--cassino .xb-cassino-providers__arrow {
        position: absolute; top: 50%; z-index: 2; display: flex; align-items: center; justify-content: center;
        width: 32px; height: 32px; margin-top: -16px; padding: 0; cursor: pointer;
        border: 1px solid rgb(255 255 255 / .14); border-radius: 999px;
        background: rgb(0 21 16 / .9); color: #fff; box-shadow: 0 6px 16px rgb(0 0 0 / .45);
    }
    .xb-page--cassino .xb-cassino-providers__arrow:hover { color: var(--color-primary, #06e05b); }
    .xb-page--cassino .xb-cassino-providers__arrow--prev { left: -10px; }
    .xb-page--cassino .xb-cassino-providers__arrow--next { right: -10px; }
}