/* ── Visite guidée générique (src/components/tour/GuidedTourOverlay.js) ── */
.gt-layer { position: fixed; inset: 0; z-index: 10000; }
.gt-block { position: absolute; inset: 0; } /* empêche de cliquer sur la page pendant la visite */
.gt-dim { position: absolute; inset: 0; background: rgba(8, 12, 24, 0.62); animation: gt-fade 0.25s ease; }
/* Une seule couche sombre, jamais retirée : la zone mise en lumière est un « trou » (ombre étalée) qui glisse d'une cible à l'autre.
   Sans cible ou pendant un changement de page, le trou se referme en douceur ; seul l'anneau lumineux s'efface. */
.gt-hole {
    position: fixed;
    top: 50%;
    left: 50%;
    border-radius: 16px;
    background: transparent;
    box-shadow: 0 0 0 9999px rgba(8, 12, 24, 0.62);
    pointer-events: none;
    transition: top 0.4s cubic-bezier(0.2, 0.7, 0.2, 1), left 0.4s cubic-bezier(0.2, 0.7, 0.2, 1), width 0.4s cubic-bezier(0.2, 0.7, 0.2, 1), height 0.4s cubic-bezier(0.2, 0.7, 0.2, 1), background-color 0.25s ease;
}
.gt-hole::after {
    content: '';
    position: absolute;
    inset: 0;
    border-radius: inherit;
    box-shadow: 0 0 0 3px var(--primary), 0 0 24px 6px color-mix(in srgb, var(--primary) 45%, transparent);
    animation: gt-pulse 2s ease-in-out infinite;
    transition: opacity 0.25s ease;
}
.gt-hole.is-empty::after { opacity: 0; }
.gt-pop {
    position: fixed;
    max-width: calc(100vw - 24px);
    padding: 18px;
    border: 1px solid var(--border-color);
    border-radius: 18px;
    background: var(--bg-card);
    color: var(--text-main);
    box-shadow: 0 24px 60px -12px rgba(0, 0, 0, 0.45);
    transition: top 0.35s cubic-bezier(0.2, 0.7, 0.2, 1), left 0.35s cubic-bezier(0.2, 0.7, 0.2, 1);
    animation: gt-rise 0.3s cubic-bezier(0.2, 0.7, 0.2, 1);
}
.gt-pop.is-centered { top: 50%; left: 50%; transform: translate(-50%, -50%); }
/* Changement d'étape : la bulle reste affichée et glisse vers sa nouvelle place */
.gt-pop { transition: top 0.4s cubic-bezier(0.2, 0.7, 0.2, 1), left 0.4s cubic-bezier(0.2, 0.7, 0.2, 1); }
/* Changement de page : la zone en surbrillance se remplit de la même teinte que le fond, la page n'est plus entrevue */
.gt-layer.is-busy .gt-hole { background: rgba(8, 12, 24, 0.62); }
/* Étape « clique ici » : le calque laisse passer les clics, seules les bandes autour de la zone et la bulle les captent */
.gt-layer.is-interactive { pointer-events: none; }
.gt-layer.is-interactive .gt-block, .gt-layer.is-interactive .gt-pop { pointer-events: auto; }
.gt-layer.is-busy .gt-pop { pointer-events: none; } /* la bulle reste affichée et glisse vers sa nouvelle place */
/* Bulle « nue » : le contenu dessine lui-même sa boîte (ex. L.U.M.A. hors du cadre) */
.gt-pop.is-bare { padding: 0; border: 0; background: none; box-shadow: none; border-radius: 0; }
@keyframes gt-fade { from { opacity: 0; } to { opacity: 1; } }
@keyframes gt-rise { from { opacity: 0; translate: 0 8px; } to { opacity: 1; translate: 0 0; } }
@keyframes gt-pulse {
    0%, 100% { box-shadow: 0 0 0 3px var(--primary), 0 0 18px 4px color-mix(in srgb, var(--primary) 35%, transparent); }
    50% { box-shadow: 0 0 0 3px var(--primary), 0 0 30px 10px color-mix(in srgb, var(--primary) 55%, transparent); }
}
@media (prefers-reduced-motion: reduce) {
    .gt-hole, .gt-hole::after, .gt-pop, .gt-dim { animation: none; transition: none; }
}
