/* Spliff — Product Trustpilot + Review snippet */

.spliff-pratings {
    display: flex;
    flex-direction: row;
    align-items: center;
    flex-wrap: wrap;
    gap: 6px;
    width: 100%;
}

.spliff-pratings *,
.spliff-pratings *::before,
.spliff-pratings *::after {
    box-sizing: border-box;
}

.spliff-pratings__row {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 14px;
    flex-wrap: wrap;
}

.spliff-pratings__score-block {
    display: inline-flex;
    align-items: center;
    line-height: 1;
}

.spliff-pratings__score {
    font-weight: 700;
    font-size: 16px;
    color: #0F0F10;
    line-height: 1;
    margin-right: 6px;
}

.spliff-pratings__star {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #00B67A;
    font-size: 16px;
    line-height: 1;
    margin-right: 6px;
}

.spliff-pratings__star svg {
    display: block;
    width: 1em;
    height: 1em;
}

.spliff-pratings__label {
    font-weight: 500;
    font-size: 14px;
    color: #0F0F10;
    line-height: 1;
}

/* Nombre d'avis — total toutes langues. En dessous du point de bascule, le widget
   masque « Trustpilot » et le séparateur pour ne garder que « N avis » : mesuré,
   c'est le seul moyen d'afficher le compteur sans rogner la citation en mobile. */
.spliff-pratings__count {
    font-weight: 500;
    font-size: 14px;
    color: #0F0F10;
    line-height: 1;
    white-space: nowrap;
}

.spliff-pratings__count-sep {
    /* 3px et non 4 : en 390px le bloc ne tient sur une ligne qu'à 2px près. */
    margin: 0 3px;
    opacity: .5;
}

/* ─── Avis ─── */

.spliff-pratings__review-block {
    display: inline-flex;
    align-items: center;
    line-height: 1.3;
    flex: 1 1 auto;
    min-width: 0;
}

.spliff-pratings__review {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: 13px;
    color: #5A5A5A;
    flex-wrap: wrap;
}

.spliff-pratings__review-quote {
    font-style: italic;
}

/* Deux longueurs de citation dans le HTML, une seule visible.
   État par défaut : la version longue. Le widget émet une media query scopée
   (point de bascule réglable dans Elementor) qui inverse les deux en dessous
   de la largeur choisie. Défaut = version longue, pour qu'un CSS de bascule
   absent laisse la citation complète plutôt que rien. */
.spliff-pratings__review-quote--long {
    display: inline;
}

.spliff-pratings__review-quote--short {
    display: none;
}

.spliff-pratings__review-author {
    font-weight: 600;
    color: #0F0F10;
    font-style: normal;
}

.spliff-pratings__verified {
    display: inline-flex;
    align-items: center;
    color: #3D5BFF;
    font-size: 13px;
    line-height: 1;
}

.spliff-pratings__verified svg {
    display: block;
    width: 1.1em;
    height: 1.1em;
}

/* Mobile : on revient en colonne avec petit gap si l'admin l'a choisi via l'option */
@media (max-width: 600px) {
    .spliff-pratings__row {
        gap: 8px;
    }
}
