/*
 * Tovuti overrides for the vendored Plyr — kept here so a Plyr upgrade can't overwrite them.
 *
 * Control bar sized to the player's own width (Plyr's breakpoints are viewport-only): below 700px the
 * progress bar takes its own row, then low-priority controls drop out as the player narrows. Captions,
 * settings and download always stay; wrapping is the fallback so no control is clipped. The player is
 * the container, so fullscreen sizes to the screen rather than the page column.
 */
.video-content .plyr {
    container: tovuti-video / inline-size;
}

@container tovuti-video (max-width: 700px) {
    .plyr .plyr__controls {
        flex-wrap: wrap;
        row-gap: 4px;
    }

    .plyr .plyr__controls .plyr__controls__item.plyr__progress__container {
        flex: 1 0 100%;
        order: -1;
        margin-left: 0;
        padding-left: 0;
    }

    .plyr .plyr__controls .plyr__controls__item.plyr__time + .plyr__time {
        display: none;
    }

    /* Plyr lifts captions to clear a one-row bar; add the progress row */
    .plyr:not(.plyr--hide-controls) .plyr__controls:not(:empty) ~ .plyr__captions {
        transform: translateY(calc(var(--plyr-control-spacing, 10px) * -4 - 24px));
    }
}

@container tovuti-video (max-width: 520px) {
    .plyr .plyr__controls [data-plyr="restart"],
    .plyr .plyr__controls [data-plyr="rewind"],
    .plyr .plyr__controls [data-plyr="fast-forward"] {
        display: none;
    }
}

@container tovuti-video (max-width: 420px) {
    .plyr .plyr__volume input[type="range"],
    .plyr .plyr__controls [data-plyr="pip"] {
        display: none;
    }
}

@container tovuti-video (max-width: 300px) {
    .plyr .plyr__controls {
        --plyr-control-spacing: 6px;
    }

    .plyr .plyr__controls .plyr__controls__item.plyr__time {
        display: none;
    }
}