/*======================================================
CAPVID - AJOUTS (J'aime, lecteur, accessibilité)
Ce fichier complète capvid.css sans le modifier.
======================================================*/

/* ---- Bouton J'aime ---- */
.like-video{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    height:46px;
    min-width:84px;
    padding:0 20px;
    border-radius:999px;
    background:rgba(255,255,255,.05);
    border:1px solid rgba(255,255,255,.10);
    color:#fff;
    font-weight:700;
    transition:var(--transition);
}
.like-video i{ color:var(--gold); transition:transform .25s; }
.like-video:hover{ background:rgba(255,255,255,.10); transform:translateY(-3px); }
.like-video.liked{
    background:linear-gradient(135deg,rgba(215,38,56,.35),rgba(215,38,56,.18));
    border-color:rgba(255,90,90,.45);
}
.like-video.liked i{ color:#ff5a6e; }
.like-video.pop i{ animation:likePop .4s ease; }
@keyframes likePop{
    0%{ transform:scale(1); }
    40%{ transform:scale(1.6); }
    100%{ transform:scale(1); }
}

/* ---- Lecteur : aide et erreurs ---- */
.video-help{
    margin-top:14px;
    text-align:center;
    font-size:.92rem;
    color:var(--muted);
}
.video-help-link{
    display:inline-flex;
    align-items:center;
    gap:8px;
    margin-left:6px;
    padding:8px 16px;
    border-radius:999px;
    background:rgba(255,255,255,.08);
    border:1px solid rgba(255,255,255,.12);
    color:#fff;
    font-weight:700;
}
.video-help-link i{ color:#ff4040; }
.video-help-link:hover{ background:rgba(255,255,255,.16); }
.video-help.attention .video-help-link{
    animation:helpPulse 1.4s ease-in-out infinite;
    border-color:var(--gold);
}
@keyframes helpPulse{
    0%,100%{ box-shadow:0 0 0 0 rgba(255,201,40,.0); }
    50%{ box-shadow:0 0 0 8px rgba(255,201,40,.22); }
}
.video-error{
    position:absolute;
    inset:0;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:22px;
    padding:24px;
    text-align:center;
    background:rgba(7,22,40,.94);
    z-index:5;
}
.video-error p{ color:#fff; max-width:520px; }

/* ---- Recherche sans résultat ---- */
.no-results{
    margin:30px auto 10px;
    text-align:center;
    font-size:1.05rem;
}

/* ---- Accessibilité : focus visible au clavier ---- */
.video-thumbnail:focus-visible,
.like-video:focus-visible,
.share-video:focus-visible,
.btn-document:focus-visible,
.filter-btn:focus-visible,
.close-video:focus-visible,
.back-to-top:focus-visible,
.video-help-link:focus-visible{
    outline:3px solid var(--gold);
    outline-offset:3px;
}

/* ---- Image de présentation : flottement en CSS (plus léger que le JS) ---- */
@media (prefers-reduced-motion:no-preference){
    .presentation-right img{ animation:capvidFloat 7s ease-in-out infinite; }
}
@keyframes capvidFloat{
    0%,100%{ transform:translateY(0) rotate(0deg); }
    50%{ transform:translateY(-10px) rotate(1deg); }
}

/* ---- Respect du réglage "réduire les animations" ---- */
@media (prefers-reduced-motion:reduce){
    *,*::before,*::after{
        animation-duration:.01ms !important;
        animation-iteration-count:1 !important;
        scroll-behavior:auto !important;
    }
}

/* ---- Mobile ---- */
@media (max-width:600px){
    .video-grid{ grid-template-columns:1fr; gap:28px; }
    .close-video{ top:-14px; right:-6px; width:46px; height:46px; }
    .video-help-text{ display:block; margin-bottom:6px; }
    .video-help-link{ margin-left:0; }
}