/* Native playback remains available; these rules only decorate enhanced players. */
.ravina-player { min-width: 0; max-width: 100%; }
.ravina-player + .ravina-player { margin-block-start: 1.5rem; }
.ravina-player .plyr {
    --plyr-color-main: var(--teal-deep);
    --plyr-font-family: var(--font-body);
    --plyr-font-size-base: 13px;
    --plyr-font-size-small: 12px;
    --plyr-control-radius: 9px;
    --plyr-control-icon-size: 18px;
    --plyr-control-spacing: 8px;
    --plyr-audio-controls-background: var(--white);
    --plyr-audio-control-color: var(--ink);
    --plyr-menu-background: var(--white);
    --plyr-menu-color: var(--ink);
    --plyr-tooltip-background: var(--night);
    --plyr-tooltip-color: var(--white);
    width: 100%; min-width: 0; border-radius: 14px; font-family: var(--font-body);
    /* Playback time progresses from left to right; surrounding text and menus stay Persian. */
    direction: ltr;
}
.ravina-player .plyr--audio { padding: .45rem; border: 1px solid rgba(0, 109, 105, .12); box-shadow: 0 6px 24px rgba(0, 60, 57, .06); }
.ravina-player .plyr__controls { gap: .2rem; }
.ravina-player .plyr__controls > .plyr__control,
.ravina-player .plyr__controls .plyr__menu > .plyr__control { min-width: 36px; min-height: 36px; }
.ravina-player .plyr__time { direction: ltr; unicode-bidi: isolate; font-variant-numeric: tabular-nums; white-space: nowrap; }
.ravina-player .plyr__tooltip { direction: rtl; font-family: var(--font-body); }
.ravina-player .plyr__menu__container { direction: rtl; text-align: right; }
.ravina-player .plyr:has([data-plyr="settings"][aria-expanded="true"]) { z-index: 5; }
.ravina-player .plyr__menu__container .plyr__control { text-align: right; }
.ravina-player .plyr__menu__container > div { max-height: var(--ravina-menu-space, 60vh); overflow-y: auto; }
.ravina-player .plyr__menu__container.ravina-menu--below { top: 100%; bottom: auto; margin-top: 10px; margin-bottom: 0; }
.ravina-player .plyr__menu__container.ravina-menu--below::after { top: auto; bottom: 100%; transform: rotate(180deg); }
.ravina-player .plyr__menu__container .plyr__menu__value { margin: 0 auto 0 0; padding: 0 1.1rem 0 0; }
.ravina-player .plyr__menu__container .plyr__control--forward { padding-right: 8px; padding-left: 28px; }
.ravina-player .plyr__menu__container .plyr__control--forward::after { right: auto; left: 7px; border-left-color: transparent; border-right-color: currentColor; }
.ravina-player .plyr__menu__container .plyr__control--back { padding-left: 8px; padding-right: 28px; }
.ravina-player .plyr__menu__container .plyr__control--back::after { left: auto; right: 7px; border-right-color: transparent; border-left-color: currentColor; }
.ravina-player .plyr__menu__container [role="menuitemradio"] { padding-right: 8px; padding-left: 12px; }
.ravina-player .plyr__menu__container [role="menuitemradio"]::before { margin-right: 0; margin-left: 8px; }
.ravina-player .plyr__menu__container [role="menuitemradio"]::after { left: auto; right: 13px; }
.ravina-player .plyr--video { overflow: visible; }
.ravina-player .plyr__video-wrapper { background: #081a19; overflow: hidden; border-radius: 14px; }
.ravina-player .plyr__video-wrapper video { border-radius: 0; max-height: 75vh; object-fit: contain; }
.ravina-player .plyr:is(:fullscreen, :-webkit-full-screen, .plyr--fullscreen-fallback),
.ravina-player .plyr:is(:fullscreen, :-webkit-full-screen, .plyr--fullscreen-fallback) .plyr__video-wrapper { border-radius: 0; }
.ravina-player .plyr:is(:fullscreen, :-webkit-full-screen, .plyr--fullscreen-fallback) video { height: 100%; max-height: none; }
.ravina-player .plyr--video .plyr__controls { padding: 2.8rem .65rem .65rem; }
.ravina-player .plyr__control--overlaid { padding: 1.1rem; background: var(--teal-deep); box-shadow: 0 4px 22px #0005; }
.ravina-player .plyr__control:focus-visible { outline: 3px solid #f2a900; outline-offset: 2px; }
.ravina-player__error { margin-block-start: .8rem; padding: .75rem 1rem; background: var(--red-pale); color: var(--red-deep); border-radius: var(--radius-sm); font-size: .8rem; }
.ravina-player [hidden] { display: none !important; }
.media-block--video .ravina-player figcaption { color: #c6d7d4; }

@media (max-width: 599px) {
    .media-block:has(.ravina-player) { padding: .8rem; }
    .ravina-player .plyr__controls { display: grid; grid-template-columns: repeat(3, 32px) minmax(30px, 1fr) repeat(3, 32px); padding: .45rem; gap: .1rem; }
    .ravina-player .plyr__controls > * { margin: 0; min-width: 0; }
    .ravina-player .plyr__controls > .plyr__progress__container { grid-column: 1 / -2; grid-row: 1; width: auto; margin: .45rem .4rem; }
    .ravina-player .plyr__controls > .plyr__time { margin: 0; font-size: 11px; }
    .ravina-player .plyr__time--duration { display: block; grid-column: -2; grid-row: 1; text-align: center; }
    .ravina-player .plyr__time--duration::before { display: none; }
    .ravina-player .plyr__controls > [data-plyr="rewind"] { grid-column: 1; grid-row: 2; }
    .ravina-player .plyr__controls > [data-plyr="play"] { grid-column: 2; grid-row: 2; }
    .ravina-player .plyr__controls > [data-plyr="fast-forward"] { grid-column: 3; grid-row: 2; }
    .ravina-player .plyr__time--current { grid-column: 4; grid-row: 2; text-align: center; }
    .ravina-player .plyr__volume { grid-column: 5; grid-row: 2; min-width: 0; width: auto; max-width: 36px; }
    .ravina-player .plyr__menu { grid-column: 6; grid-row: 2; }
    .ravina-player .plyr--audio .plyr__menu { grid-column: 6 / -1; justify-self: end; }
    .ravina-player .plyr__controls > [data-plyr="fullscreen"] { grid-column: 7; grid-row: 2; }
    .ravina-player .plyr__volume input { display: none; }
    .ravina-player .plyr__controls > .plyr__control,
    .ravina-player .plyr__controls .plyr__menu > .plyr__control { min-width: 32px; min-height: 36px; padding: 7px; }
    .ravina-player .plyr__controls [data-plyr="pip"],
    .ravina-player .plyr__controls [data-plyr="airplay"] { display: none; }
}

@media (max-width: 359px) {
    .ravina-player .plyr__controls { grid-template-columns: repeat(3, 28px) minmax(30px, 1fr) repeat(3, 28px); }
    .ravina-player .plyr__controls > .plyr__control,
    .ravina-player .plyr__controls .plyr__menu > .plyr__control { min-width: 28px; padding: 5px; }
}

@media (prefers-reduced-motion: reduce) {
    .ravina-player .plyr *, .ravina-player .plyr *::before, .ravina-player .plyr *::after { transition: none !important; animation: none !important; }
}