/* Effets de halo bleu partagés par toutes les pages (tableau de bord, Params, profil, connexion).
   Désactivés sur écran tactile et pour les personnes qui ont demandé moins d'animations. */

/* Traînée bleue qui suit le pointeur sur toute la page (dessinée par effets.js) */
.spot-pointeur { position: fixed; inset: 0; width: 100%; height: 100%; z-index: 40; pointer-events: none; }

/* Les cartes se teintent de bleu soutenu le long de leur bordure, du côté du pointeur */
.lumiere { position: relative; }
.lumiere::before {
    content: ''; position: absolute; inset: 0; border-radius: inherit; padding: 1.5px; pointer-events: none;
    background: radial-gradient(230px circle at var(--px, 50%) var(--py, 50%), rgba(59, 110, 235, 0.9), rgba(37, 80, 200, 0.4) 45%, transparent 72%);
    -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
    -webkit-mask-composite: xor;
    mask: linear-gradient(#000 0 0) content-box exclude, linear-gradient(#000 0 0);
    opacity: 0; transition: opacity 0.35s ease;
}
.lumiere::after {
    content: ''; position: absolute; inset: 0; border-radius: inherit; pointer-events: none;
    background: radial-gradient(340px circle at var(--px, 50%) var(--py, 50%), rgba(37, 80, 200, 0.14), transparent 66%);
    opacity: 0; transition: opacity 0.35s ease;
}
.lumiere:hover::before, .lumiere:hover::after { opacity: 1; }

@media (hover: none), (prefers-reduced-motion: reduce) {
    .spot-pointeur { display: none; }
    .lumiere::before, .lumiere::after { display: none; }
}

/* Logo de l'entreprise : sur une pastille claire, pour rester lisible quel que soit sa couleur */
.logo-ligne { display: flex; justify-content: center; margin: 0 0 14px; }
.logo-entreprise { display: block; width: auto; height: auto; max-height: 64px; max-width: min(260px, 70%); padding: 8px 16px; border-radius: 14px; background: #fff; box-shadow: 0 4px 18px rgba(0, 0, 0, 0.35); }

/* Sélecteur de langue à drapeaux (static/i18n.js) */
.vad-langues { display: inline-flex; align-items: center; gap: 4px; padding: 4px; border-radius: 999px;
    background: rgba(255, 255, 255, 0.08); border: 1px solid rgba(255, 255, 255, 0.16); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); }
.vad-langues button { position: relative; width: 36px; height: 36px; padding: 0; border: 0; border-radius: 50%; background: none; cursor: pointer;
    display: grid; place-items: center; opacity: 0.55; transition: opacity 0.2s, transform 0.25s cubic-bezier(0.3, 1.5, 0.5, 1), background 0.2s, box-shadow 0.2s; -webkit-tap-highlight-color: transparent; }
.vad-langues button svg { width: 26px; height: 26px; border-radius: 50%; box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.4), 0 2px 6px rgba(0, 0, 0, 0.35); pointer-events: none; }
.vad-langues button:hover { opacity: 1; transform: scale(1.1); }
.vad-langues button[aria-pressed="true"] { opacity: 1; background: rgba(255, 255, 255, 0.18); box-shadow: 0 0 0 2px #38bdf8, 0 0 14px rgba(56, 189, 248, 0.5); }
.vad-langues button:focus-visible { outline: 2px solid #a5b4fc; outline-offset: 2px; }
@media (max-width: 820px), (pointer: coarse) { .vad-langues button { width: 44px; height: 44px; } .vad-langues button svg { width: 30px; height: 30px; } }
/* Coin supérieur droit des pages sans barre d'actions (connexion, accès refusé) */
.vad-langues-coin { position: fixed; top: max(12px, env(safe-area-inset-top)); right: max(12px, env(safe-area-inset-right)); z-index: 5; }