/**
 * SHIMMER LOGO NAVBAR — UN SEUL BALAYAGE AU CHARGEMENT
 * =====================================================
 * Meme effet que le lien "Localisation GPS" du footer (.ft-geo) :
 * un reflet blanc en biais (110deg) qui glisse a l'interieur des
 * lettres grace a background-clip:text. Ici il ne passe qu'UNE FOIS
 * a l'ouverture de la page (pas de boucle).
 *
 * Fonctionnement : le texte reel du logo (gris metallique 3D sur
 * desktop, bleu sur mobile) n'est pas touche. Un calque ::before
 * reprend exactement le meme texte (attribut data-shimmer) par-dessus,
 * transparent partout sauf dans la bande de reflet, et clippe sur la
 * forme des lettres.
 *
 * Pages concernees : index.php, produit.php, batterie.php,
 *   pages/produits.php, pages/devis.php, pages/batteries.php
 */

.logo-text-senegal {
    position: relative;
    isolation: isolate;
}

@supports ((-webkit-background-clip: text) or (background-clip: text)) {
    .logo-text-senegal::before {
        content: attr(data-shimmer);
        position: absolute;
        inset: 0;
        z-index: 2;
        pointer-events: none;
        white-space: nowrap;
        text-shadow: none;

        /* meme degrade que le footer : reflet BLANC. Le texte desktop est legerement grise (voir plus bas) pour que le blanc ressorte */
        background-image: linear-gradient(
            110deg,
            rgba(255, 255, 255, 0)  0%,
            rgba(255, 255, 255, 0)  38%,
            rgba(255, 255, 255, 1)  50%,
            rgba(255, 255, 255, 0)  62%,
            rgba(255, 255, 255, 0)  100%
        );
        background-size: 250% 100%;
        background-repeat: no-repeat;
        background-position: 150% 0;   /* hors champ avant le balayage */
        -webkit-background-clip: text;
                background-clip: text;
        -webkit-text-fill-color: transparent;
        color: transparent;

        /* un seul passage (iteration-count = 1), puis le calque reste invisible */
        animation: logoShimmerSweep 3s linear .6s 1 both;
    }
}


/* Desktop : base blanc-gris pour que le reflet blanc soit visible */
@media (min-width: 769px) {
    .logo .logo-text-senegal { color: #b4b9c6 !important; }
}

@keyframes logoShimmerSweep {
    0%   { background-position: 150% 0; }
    100% { background-position: -150% 0; }
}

/* Accessibilite : aucune animation si l'utilisateur la refuse */
@media (prefers-reduced-motion: reduce) {
    .logo-text-senegal::before {
        animation: none;
        display: none;
    }
}
