/**
 * MOBILE VIDEO ADAPTABILITY OVERRIDE (NUCLEAR FIX)
 * Forces removal of 16:9 aspect ratio hacks.
 */

@media (max-width: 768px) {

    /* 1. RESET CONTAINER (Kill the padding hack) */
    html body .feed-item__video-container,
    html body .profile-feed-video-wrapper {
        width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;

        /* NUCLEAR RESET OF PADDING HACK */
        padding-bottom: 0 !important;
        padding-top: 0 !important;
        padding: 0 !important;

        aspect-ratio: unset !important;
        background: #000 !important;
        display: block !important;
        margin: 0 !important;
        position: relative !important;
    }

    /* 2. RESET VIDEO ELEMENT (Make it flow naturally) */
    html body .feed-item__video-container video,
    html body .feed-item__video,
    html body .profile-feed-video-wrapper video,
    html body video {
        width: 100% !important;
        height: auto !important;

        /* Layout reset */
        position: static !important;
        /* Stop being absolute */
        display: block !important;

        /* Limit height to square (1:1) or screen height to prevent overflow */
        max-height: 85vh !important;

        /* VITAL: Show full video content */
        object-fit: contain !important;

        margin: 0 auto !important;
        top: auto !important;
        left: auto !important;
        transform: none !important;
    }

    /* 3. Handling Wrappers (Plyr/Others) */
    html body .plyr,
    html body .plyr__video-wrapper {
        width: 100% !important;
        height: auto !important;
        background: transparent !important;
        padding-bottom: 0 !important;
        aspect-ratio: unset !important;
    }
}