/* ASE Vehicle Video — default styling for the [ase_vehicle_video] embed.
   Sized for vertical (YouTube Shorts) video by default, since that's the
   actual content DealerCenter is currently sending. If that ever changes
   to standard widescreen video, change padding-top below to 56.25% (16:9)
   instead of the current 177.78% (9:16 vertical).
   Fully overridable via Elementor Custom CSS without touching this file. */

.ase-video-wrapper {
    position: relative;
    display: block;
    width: 100%;
    max-width: 360px;
    margin: 0 auto;
    border-radius: 8px;
    overflow: hidden;
    background: #000;
    /* Classic padding-percentage technique (same approach YouTube's own
       embed code uses) instead of the CSS aspect-ratio property. This
       reserves the correct height reliably in every browser and inside
       any surrounding container's layout mode (flex, grid, etc.) —
       aspect-ratio can collapse to zero height inside some page-builder
       flex/grid containers, which was causing content below the video
       to render underneath it on mobile instead of after it. */
    height: 0;
    padding-top: 177.78%; /* 9:16 vertical video — height = width × 16/9 */
}

.ase-video-wrapper iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border: 0;
}