/* ============================================================
   Riepilogo di una ricerca libera (/cashback/risultati, Results.cshtml).
   Quattro blocchi con le card delle sezioni: prodotti (cb-card.js, sotto #products),
   negozi ed extra sconti (CBOffersGridPlan, sotto #cb-offers-items), gift card (GCGrid, sotto #gift-card-grid).
   Da lg: griglia di 4 colonne (8 risultati = 2 righe). Sotto lg: ogni blocco e' una riga
   a scorrimento orizzontale, con la card successiva in parte visibile.
   Usa i token di styleCBSearch.css (--cbs-soft, --cbs-line) e del tema (--color-primary, --color-tertiary).
   ============================================================ */

#products .cb-sr-h1 { text-transform: initial; }

/* Riepilogo di una categoria con testo cercato: la ricerca sotto il nome, piu' piccola. */
#products .cb-sr-h1-sub {
    font-size: .6em;
    font-weight: 500;
}

#products .cb-sr-chips { margin-bottom: 1.75rem; }
#products .cb-sr-chips a.cb-chip i { color: var(--color-primary); }
#products .cb-sr-chips a.cb-chip b { font-weight: 600; margin-left: 2px; }

.cb-sr-block { margin-bottom: 2.5rem; }
.cb-sr-block[hidden] { display: none; }

.cb-sr-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 1rem;
}

/* #products h2 (styleCB.css) e' maiuscolo da 15px: qui serve un titolo di sezione. */
#products h2.cb-sr-title {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 19px;
    font-weight: 600;
    text-transform: none;
    color: var(--color-primary);
}

#products h2.cb-sr-title:hover { color: var(--color-primary); }

.cb-sr-count {
    font-size: 13px;
    font-weight: 600;
    line-height: 1.6;
    padding: 1px 10px;
    border-radius: 999px;
    background: var(--cbs-soft, #e5ecfa);
    color: var(--color-primary);
}

.cb-sr-count[hidden] { display: none; }

.cb-sr-status {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 14px;
    color: var(--color-text);
    margin-bottom: .75rem;
}

.cb-sr-status[hidden] { display: none; }

/* «Vedi tutti …»: link centrato sotto il blocco, in maiuscolo. */
.cb-sr-foot {
    display: flex;
    justify-content: center;
    margin-top: .25rem;
}

.cb-sr-foot[hidden] { display: none; }

#products a.cb-sr-more {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 15px;
    font-weight: 600;
    text-transform: uppercase;
    text-align: center;
    color: var(--color-primary);
    text-decoration: none;
}

#products a.cb-sr-more:hover,
#products a.cb-sr-more:focus-visible { color: var(--color-tertiary); }

#products a.cb-sr-more i { transition: transform .2s ease; }
#products a.cb-sr-more:hover i { transform: translateX(3px); }

/* Skeleton di negozi, extra sconti e gift card (i prodotti usano quello di styleCBSearch.css). */
.cb-sr-skel {
    height: 200px;
    border-radius: var(--border-radius-md, 10px);
}

#gift-card-grid .cb-sr-skel { margin: 0 .5rem 1rem; }

/* ---------- Desktop (da lg): griglia di 4 colonne ---------- */
@media (min-width: 992px) {
    #cb-offers-items .cb-sr-block .cb-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }

    #gift-card-grid .cb-sr-track > [class*="col-"] {
        flex: 0 0 auto;
        width: 25%;
    }
}

/* ---------- Sotto lg: righe a scorrimento orizzontale ---------- */
@media (max-width: 991.98px) {
    .cb-sr {
        --cb-sr-item: 30%;   /* da md a lg: tre card e un pezzo della quarta */
    }

    .cb-sr .cb-sr-track,
    .cb-sr .cb-sr-items > .cb-grid {
        display: flex;
        flex-wrap: nowrap;
        overflow-x: auto;
        overscroll-behavior-x: contain;
        scroll-snap-type: x mandatory;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
        padding-bottom: 8px;  /* spazio per le ombre delle card */
    }

    .cb-sr .cb-sr-track::-webkit-scrollbar,
    .cb-sr .cb-sr-items > .cb-grid::-webkit-scrollbar { display: none; }

    .cb-sr .cb-sr-items > .cb-grid {
        gap: 12px;
        margin-bottom: 0;
    }

    .cb-sr .cb-sr-track > *,
    .cb-sr .cb-sr-items > .cb-grid > * {
        flex: 0 0 var(--cb-sr-item);
        width: var(--cb-sr-item);
        max-width: var(--cb-sr-item);
        scroll-snap-align: start;
    }

    /* Le card delle gift card si ingrandiscono al passaggio del mouse: nella riga verrebbero tagliate. */
    #gift-card-grid .cb-sr-track .card:hover { transform: none; }
}

/* Sotto md: una card intera e metà della successiva. */
@media (max-width: 767.98px) {
    .cb-sr { --cb-sr-item: 66%; }
}

@media (prefers-reduced-motion: reduce) {
    #products a.cb-sr-more i { transition: none; }
}