/* Lecteur YouTube à la demande (pages/video.mjs) : vignette 16/9 + bouton lecture, la vidéo se charge au clic
   (assets/js/videos.js). Utilisé par les webinaires (Ressources en ligne) et les vidéos des proches aidants. */
.cra-lecteur { position: relative; aspect-ratio: 16 / 9; border-radius: 12px; overflow: hidden; background: var(--wp--preset--color--marine); }
.cra-lecteur iframe { width: 100%; height: 100%; border: 0; display: block; }
.cra-lecteur__bouton { all: unset; position: absolute; inset: 0; cursor: pointer; }
.cra-lecteur__bouton img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform 0.25s ease; }
.cra-lecteur__bouton:hover img { transform: scale(1.03); }
.cra-lecteur__bouton:focus-visible { outline: 3px solid var(--wp--preset--color--turquoise); outline-offset: -3px; border-radius: 12px; }
.cra-lecteur__play { position: absolute; left: 50%; top: 50%; width: 3.5rem; height: 3.5rem; transform: translate(-50%, -50%); border-radius: 999px; background: rgba(17, 25, 74, 0.82); box-shadow: 0 6px 18px rgba(17, 25, 74, 0.35); }
.cra-lecteur__play::after { content: ""; position: absolute; left: 54%; top: 50%; transform: translate(-50%, -50%); border-style: solid; border-width: 0.6rem 0 0.6rem 1rem; border-color: transparent transparent transparent #fff; }

/* Mention YouTube sous les vidéos (cookies, décision du 02/11). */
.cra-mention-video { display: flex; gap: 0.5rem; align-items: flex-start; margin-top: 1rem !important; font-size: 0.85rem; line-height: 1.5; color: var(--wp--preset--color--encre-2); }
.cra-mention-video .cra-ico { flex: none; margin-top: 0.2em; }

@media (prefers-reduced-motion: reduce) { .cra-lecteur__bouton img { transition: none; } }
