/*
 * ANDROID / YOUTUBE 3.16 — Chrome com fullscreen em orientação livre.
 *
 * Mesma geometria CSS pura comprovada no Firefox 3.15:
 * - o frame ocupa o viewport preto;
 * - o iframe YouTube mantém uma janela visível 16:9 centralizada;
 * - portrait: preto acima/abaixo;
 * - landscape mais largo que 16:9: preto simétrico nas laterais;
 * - sem orientation.lock(), sem geometria por JavaScript.
 */
html.is-vislun-android-chrome
.vislun-video-wrapper.vislun-video-custom-player
.vislun-video-frame[data-vislun-youtube-model-active="1"]:is(
    :fullscreen,
    :-webkit-full-screen
) {
    position: fixed !important;
    inset: 0 !important;
    width: 100vw !important;
    height: 100vh !important;
    min-width: 100vw !important;
    min-height: 100vh !important;
    max-width: none !important;
    max-height: none !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
    background: #000000 !important;
    transform: none !important;
}

@media (min-aspect-ratio: 16/9) {
    html.is-vislun-android-chrome
    .vislun-video-wrapper.vislun-video-custom-player
    .vislun-video-frame[data-vislun-youtube-model-active="1"]:is(
        :fullscreen,
        :-webkit-full-screen
    )
    iframe.vislun-youtube-player {
        position: absolute !important;
        top: -50vh !important;
        right: auto !important;
        bottom: auto !important;
        left: 50% !important;
        width: 177.7777777778vh !important;
        height: 200vh !important;
        min-width: 0 !important;
        min-height: 0 !important;
        max-width: none !important;
        max-height: none !important;
        margin: 0 !important;
        transform: translateX(-50%) !important;
        z-index: 1 !important;
    }
}

@media (max-aspect-ratio: 16/9) {
    html.is-vislun-android-chrome
    .vislun-video-wrapper.vislun-video-custom-player
    .vislun-video-frame[data-vislun-youtube-model-active="1"]:is(
        :fullscreen,
        :-webkit-full-screen
    )::before,
    html.is-vislun-android-chrome
    .vislun-video-wrapper.vislun-video-custom-player
    .vislun-video-frame[data-vislun-youtube-model-active="1"]:is(
        :fullscreen,
        :-webkit-full-screen
    )::after {
        content: "";
        position: absolute;
        left: 0;
        right: 0;
        z-index: 2;
        display: block;
        background: #000000;
        pointer-events: none;
        height: calc(50vh - 28.125vw);
    }

    html.is-vislun-android-chrome
    .vislun-video-wrapper.vislun-video-custom-player
    .vislun-video-frame[data-vislun-youtube-model-active="1"]:is(
        :fullscreen,
        :-webkit-full-screen
    )::before {
        top: 0;
    }

    html.is-vislun-android-chrome
    .vislun-video-wrapper.vislun-video-custom-player
    .vislun-video-frame[data-vislun-youtube-model-active="1"]:is(
        :fullscreen,
        :-webkit-full-screen
    )::after {
        bottom: 0;
    }

    html.is-vislun-android-chrome
    .vislun-video-wrapper.vislun-video-custom-player
    .vislun-video-frame[data-vislun-youtube-model-active="1"]:is(
        :fullscreen,
        :-webkit-full-screen
    )
    iframe.vislun-youtube-player {
        position: absolute !important;
        top: calc(50vh - 56.25vw) !important;
        right: auto !important;
        bottom: auto !important;
        left: 0 !important;
        width: 100vw !important;
        height: 112.5vw !important;
        min-width: 0 !important;
        min-height: 0 !important;
        max-width: none !important;
        max-height: none !important;
        margin: 0 !important;
        transform: none !important;
        z-index: 1 !important;
    }
}

/* UI Vislun permanece acima do iframe/máscaras. */
html.is-vislun-android-chrome
.vislun-video-wrapper.vislun-video-custom-player
.vislun-video-frame[data-vislun-youtube-model-active="1"]:is(
    :fullscreen,
    :-webkit-full-screen
)
.vislun-youtube-direct-toggle-surface,
html.is-vislun-android-chrome
.vislun-video-wrapper.vislun-video-custom-player
.vislun-video-frame[data-vislun-youtube-model-active="1"]:is(
    :fullscreen,
    :-webkit-full-screen
)
.vislun-player-ui[data-vislun-player-ui="1"],
html.is-vislun-android-chrome
.vislun-video-wrapper.vislun-video-custom-player
.vislun-video-frame[data-vislun-youtube-model-active="1"]:is(
    :fullscreen,
    :-webkit-full-screen
)
.vislun-player-header,
html.is-vislun-android-chrome
.vislun-video-wrapper.vislun-video-custom-player
.vislun-video-frame[data-vislun-youtube-model-active="1"]:is(
    :fullscreen,
    :-webkit-full-screen
)
.vislun-video-post-click-layer {
    position: absolute;
    z-index: 70;
}

/* Mantém volume/settings disponíveis também em portrait fullscreen. */
html.is-vislun-android-chrome
.vislun-video-wrapper.vislun-video-custom-player
.vislun-video-frame[data-vislun-youtube-model-active="1"]:is(
    :fullscreen,
    :-webkit-full-screen
)
.vislun-player-volume {
    display: flex !important;
}

html.is-vislun-android-chrome
.vislun-video-wrapper.vislun-video-custom-player
.vislun-video-frame[data-vislun-youtube-model-active="1"]:is(
    :fullscreen,
    :-webkit-full-screen
)
.vislun-player-volume-control.is-volume-open
.vislun-player-volume {
    opacity: 1 !important;
    visibility: visible !important;
    transform: translate3d(-50%, 0, 0) !important;
    pointer-events: auto !important;
}

/*
 * ANDROID / YOUTUBE 3.16-R3 — Compartilhar com a mesma leitura visual
 * do cabeçalho no Chrome.
 *
 * O cabeçalho continua fornecendo o gradiente escuro. O botão Compartilhar
 * fica imediatamente acima dele, branco e totalmente opaco, sem recriar
 * a sombra radial isolada quando o cabeçalho está presente.
 */
html.is-vislun-android-chrome
.vislun-video-wrapper.vislun-video-custom-player
.vislun-video-frame[data-vislun-youtube-model-active="1"]:is(
    :fullscreen,
    :-webkit-full-screen
)
.vislun-player-header {
    z-index: 2 !important;
}

html.is-vislun-android-chrome
.vislun-video-wrapper.vislun-video-custom-player
.vislun-video-frame[data-vislun-youtube-model-active="1"]:is(
    :fullscreen,
    :-webkit-full-screen
)
.vislun-player-share-toggle {
    z-index: 3 !important;
    color: var(--vislun-player-white) !important;
    opacity: 1 !important;
}
