/* Ergopix — Médias responsives
   Remplace FitVids : le ratio est porté par --epx-ratio, posé côté PHP
   depuis les dimensions réelles du média. */

/* --- intégrations en iframe (YouTube, Vimeo, VOD Infomaniak…) --- */
.epx-fluid {
    position: relative;
    display: block;
    width: 100%;
    max-width: 100%;
    aspect-ratio: var(--epx-ratio, 16 / 9);
}
.epx-fluid > iframe,
.epx-fluid > object,
.epx-fluid > embed {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    border: 0;
}

/* --- shortcode [video] de WordPress (MP4 auto-hébergés) ---
   WordPress fige une largeur en pixels sur .wp-video ; le PHP la retire et
   pose le ratio à la place. MediaElement écrit ses propres styles en ligne,
   d'où les !important. */
.wp-video {
    width: 100% !important;
    max-width: 100%;
}
.wp-video-shortcode {
    width: 100% !important;
    height: auto !important;
    max-width: 100%;
    aspect-ratio: var(--epx-ratio, 16 / 9);
}
.mejs-container {
    width: 100% !important;
    max-width: 100%;
    height: auto !important;
    aspect-ratio: var(--epx-ratio, 16 / 9);
}
.mejs-container .mejs-mediaelement,
.mejs-container video,
.mejs-overlay,
.mejs-poster {
    width: 100% !important;
    height: 100% !important;
}
.mejs-poster img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}