/**
 * WS Booster - Widget Etoiles Notation (v2)
 * - Demi-etoile : on superpose un 2eme SVG clip a 50% en couleur remplie
 *   (fonctionne pour TOUTES les formes : solid/rounded/square)
 * - Presets (Trustpilot=vert, Google=jaune, Facebook=bleu) : couleur auto
 */

.ws-stars {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    text-decoration: none;
    color: inherit;
    line-height: 1;
}

.ws-stars__row {
    display: inline-flex;
    gap: 3px;
    align-items: center;
}

.ws-stars__star {
    position: relative;
    display: inline-flex;
    color: #d1d5db; /* Couleur etoile vide (par defaut gris) */
    line-height: 0;
    width: 24px;
    height: 24px;
}

.ws-stars__star svg {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    display: block;
}

/* Etoile pleine */
.ws-stars__star.is-filled {
    color: #fbbf24;
}

/* === DEMI-ETOILE : overlay SVG clipe a 50% === */
.ws-stars__star.is-half {
    /* Le 1er svg reste en couleur vide (gris) */
}

.ws-stars__star-fill {
    position: absolute;
    inset: 0;
    width: 50%;
    height: 100%;
    overflow: hidden;
    color: #fbbf24; /* Couleur remplie */
    pointer-events: none;
    line-height: 0;
}

.ws-stars__star-fill svg {
    position: absolute;
    left: 0;
    top: 0;
    width: 200%; /* Le svg garde sa taille originale, on coupe la moitie droite via overflow:hidden */
    height: 100%;
}

/* === PRESETS : couleur auto selon source === */
/* Trustpilot : vert */
.ws-stars--preset-trustpilot .ws-stars__star.is-filled,
.ws-stars--preset-trustpilot .ws-stars__star-fill {
    color: #00b67a;
}

/* Google : jaune Google Reviews */
.ws-stars--preset-google .ws-stars__star.is-filled,
.ws-stars--preset-google .ws-stars__star-fill {
    color: #fbbc04;
}

/* Facebook : bleu */
.ws-stars--preset-facebook .ws-stars__star.is-filled,
.ws-stars--preset-facebook .ws-stars__star-fill {
    color: #1877f2;
}

/* === TEXT + LOGO === */
.ws-stars__text {
    font-size: 15px;
    font-weight: 600;
    color: #1a1a2e;
    white-space: nowrap;
}

.ws-stars__logo {
    display: inline-flex;
    align-items: center;
    line-height: 0;
}

.ws-stars__logo img,
.ws-stars__logo svg {
    display: block;
    max-height: 26px;
    width: auto;
}