/* video.css — v22 (FINAL) */


.thumbMedia{position:relative;aspect-ratio:16/9}
.thumbMedia img,.thumbMedia video.pv{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.card .pv{opacity:0}
.card.is-playing .pv{opacity:1}
.card.is-playing img{opacity:0}



.vhVideoPage{
  --vh-bg: #0b0b10;
  --vh-line: rgba(255,255,255,.10);
  --vh-muted: rgba(255,255,255,.70);
  --vh-muted2: rgba(255,255,255,.55);
  --vh-white: #fff;

  --vh-gold: rgba(255,191,0,.98);
  --vh-gold-bg: rgba(255,191,0,.12);
  --vh-gold-br: rgba(255,191,0,.38);

  --vh-card-bg: rgba(10,10,14,.72);
}

.vhVideoPage, .vhVideoPage *{ box-sizing:border-box; }

/* ✅ هیچ آبی (حتی visited) */
.vhVideoPage a,
.vhVideoPage a:visited,
.vhVideoPage a:hover,
.vhVideoPage a:active{ color: inherit; }

/* ✅ کلاً Hover / حرکت / Transition خاموش */
.vhVideoPage .card,
.vhVideoPage .rvCard,
.vhVideoPage .stripCard,
.vhVideoPage .thumbMedia img,
.vhVideoPage .thumbMedia video,
.vhVideoPage .thumb{ transition:none !important; transform:none !important; }
.vhVideoPage .card:hover,
.vhVideoPage .rvCard:hover,
.vhVideoPage .stripCard:hover{ transform:none !important; }

/* Page wrap */
.vhVideoPage .wrap{
  max-width: 1180px;
  margin: 0 auto;
  padding: 14px 12px 44px;
}
@media (max-width:980px){
  .vhVideoPage .wrap{ max-width:100%; padding:10px 12px 26px; }
}

/* Layout */
.vhVideoPage .grid{
  margin-top: 14px;
  display: grid;
  grid-template-columns: 1.75fr .9fr;
  gap: 14px;
  align-items: start;
}
@media (max-width:980px){
  .vhVideoPage .grid{ grid-template-columns: 1fr; }
}

/* Card */
.vhVideoPage .card{
  background: var(--vh-card-bg);
  border: 1px solid var(--vh-line);
  border-radius: 18px;
  overflow: hidden;
}

/* ======================
   ✅ PLAYER (GUARANTEED)
   - رزرو ارتفاع 16:9 با ::before (بدون جابجایی اولیه)
   - Stage absolute تا ارتفاع اضافه نسازد
   - هر wrapper fluid/vast داخل playerWrap forced absolute
====================== */
.vhVideoPage .playerWrap{
  position:relative;
  background:#000;
  border-radius: 18px;
  overflow:hidden;
  border-bottom: 1px solid var(--vh-line);
}

/* ✅ 16:9 ثابت از لحظه اول */
.vhVideoPage .playerWrap::before{
  content:"";
  display:block;
  padding-top:56.25%;
}

/* Stage روی همان فضای رزروشده می‌نشیند */
.vhVideoPage .vhStage{
  position:absolute !important;
  inset:0 !important;
  width:100% !important;
  height:100% !important;
  overflow:hidden;
  background:#000;
  border-radius:18px;
}

/* هر چیزی داخل stage فول */
.vhVideoPage .vhStage > .player,
.vhVideoPage .vhStage > video.player,
.vhVideoPage .vhStage > img.restrictedPoster,
.vhVideoPage .vhStage > .playerEmbed,
.vhVideoPage .vhStage > .vh-ctp{
  position:absolute !important;
  inset:0 !important;
  width:100% !important;
  height:100% !important;
}

/* ✅ مهم: wrapperهای Fluid/VAST هر جا داخل playerWrap باشند */
.vhVideoPage .playerWrap .fluid_video_wrapper,
.vhVideoPage .playerWrap .fluid_video_wrapper_parent,
.vhVideoPage .playerWrap .fluid_player,
.vhVideoPage .playerWrap .fluid_video_wrapper_container,
.vhVideoPage .playerWrap div[id^="fluid_video_wrapper"],
.vhVideoPage .playerWrap .fluid_vast_container,
.vhVideoPage .playerWrap [class*="vast"],
.vhVideoPage .playerWrap [id*="vast"]{
  position:absolute !important;
  inset:0 !important;
  width:100% !important;
  height:100% !important;
  max-width:100% !important;
  max-height:100% !important;
}

/* داخل wrapper هم ویدیو/iframe 100% */
.vhVideoPage .playerWrap .fluid_video_wrapper video,
.vhVideoPage .playerWrap .fluid_video_wrapper iframe,
.vhVideoPage .playerWrap video.player,
.vhVideoPage .playerWrap iframe{
  position:absolute !important;
  inset:0 !important;
  width:100% !important;
  height:100% !important;
  display:block !important;
  background:#000 !important;
}

/* Player element */
.vhVideoPage .player,
.vhVideoPage video.player{
  display:block;
  width:100%;
  height:100%;
  background:#000;
  object-fit:contain;
}

/* Restricted poster */
.vhVideoPage .restrictedPoster{
  object-fit:cover;
  filter: saturate(.95) brightness(.78);
  transform: scale(1.02);
}

/* Content padding */
.vhVideoPage .cardPad{ padding:14px; }
@media (max-width:980px){ .vhVideoPage .cardPad{ padding:12px; } }

/* ✅ تیتر زیر پلیر راست‌چین */
.vhVideoPage .vhTitle{
  font-size: 18px;
  font-weight: 1000;
  margin: 0 0 10px;
  line-height: 1.35;
  text-align: right;
  color: #fff;
}
@media (max-width:980px){ .vhVideoPage .vhTitle{ font-size:16px; margin:0 0 8px; } }

.vhVideoPage .metaRow{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  font-size: 13px;
  color: var(--vh-muted);
}
@media (max-width:980px){ .vhVideoPage .metaRow{ gap:8px; font-size:12px; } }

.vhVideoPage .pill{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:6px 10px;
  border-radius:999px;
  border:1px solid var(--vh-line);
  background: rgba(0,0,0,.18);
}
.vhVideoPage .pill b{ color:#fff; }
.vhVideoPage .pill.orange{
  border-color: rgba(255,191,0,.35);
  background: rgba(255,191,0,.10);
}
.vhVideoPage .vhSmallNote{ opacity:.8; }

.vhVideoPage .desc{
  margin-top:12px;
  border:1px solid var(--vh-line);
  border-radius:14px;
  padding:12px;
  background: rgba(0,0,0,.16);
  line-height: 1.75;
  font-size: 14px;
  color: rgba(255,255,255,.88);
}
.vhVideoPage .descTitle{
  font-weight:1000;
  margin:0 0 8px;
  font-size:14px;
  color: #fff;
}

.vhVideoPage .tagRow{
  margin-top:12px;
  display:flex;
  gap:10px;
  flex-wrap:wrap;
}
.vhVideoPage .tagPill{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding: 8px 10px;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.12);
  background: rgba(255,255,255,.06);
  color: #fff;
  font-weight: 900;
  font-size: 13px;
}
.vhVideoPage .tagPill:hover{
  background: rgba(255,255,255,.09);
  border-color: rgba(255,191,0,.25);
}
.vhVideoPage .tagPill::before{ content:"#"; opacity:.55; font-weight:1000; }

.vhVideoPage .sideTitle{
  font-weight:1000;
  font-size:14px;
  margin:0;
  color: #fff;
}

/* ✅ Related layout */
.vhVideoPage .relGrid{
  display:flex;
  flex-direction:column;
  gap: 10px;
  padding: 10px;
}

/* ✅ کارت مخفی برای LoadMore */
.vhVideoPage .isHidden{ display:none !important; }

/* ✅ فیکس thumbMedia */
.vhVideoPage .thumb{
  position:relative;
  display:block;
  overflow:hidden;
  border-radius:14px;
  background:#000;
}
.vhVideoPage .thumb::before{ content:none !important; display:none !important; }

.vhVideoPage .thumbMedia{
  position:relative !important;
  display:block !important;
  width:100% !important;
  aspect-ratio:16/9 !important;
  overflow:hidden !important;
  line-height:0 !important;
  font-size:0 !important;
  background:#000 !important;
}
.vhVideoPage .thumbMedia > img,
.vhVideoPage .thumbMedia > video.pv{
  position:absolute !important;
  inset:0 !important;
  width:100% !important;
  height:100% !important;
  object-fit:cover !important;
  display:block !important;
  margin:0 !important;
  padding:0 !important;
  border:0 !important;
  max-width:none !important;
  max-height:none !important;
}
.vhVideoPage .thumbMedia > video.pv{ pointer-events:none !important; }

/* Shade */
.vhVideoPage .thumbShade{
  position:absolute;
  inset:0;
  background: linear-gradient(to top, rgba(0,0,0,.62), rgba(0,0,0,.10) 48%, transparent 78%);
  pointer-events:none;
  z-index:2;
}

/* Badge “تماشا کن” */
.vhVideoPage .watchNow{
  position:absolute;
  left:10px;
  bottom:10px;
  z-index:3;
  padding:6px 10px;
  border-radius:999px;
  background: var(--vh-gold-bg);
  border: 1px solid var(--vh-gold-br);
  color:#fff;
  font-weight:1000;
  font-size:12px;
  line-height:1;
  pointer-events:none;
  white-space:nowrap;
  backdrop-filter: blur(6px);
  text-shadow: 0 3px 14px rgba(0,0,0,.55);
}

/* Related card */
.vhVideoPage .rvCard{
  border-radius: 16px;
  overflow: hidden;
  display:flex;
  align-items:stretch;
  contain: layout paint;
  transform: translateZ(0);
  backface-visibility: hidden;
}
.vhVideoPage .rvCard .thumb{
  flex: 0 0 170px;
  height: 96px;
}
@media (max-width:980px){
  .vhVideoPage .rvCard .thumb{ flex-basis: 150px; height: 88px; }
}
.vhVideoPage .rvCard .meta{
  flex: 1 1 auto;
  padding: 10px 10px 12px;
  min-width: 0;
}

.vhVideoPage .rvCard .title{
  margin:0 0 6px;
  font-size: 13px;
  line-height: 1.25;
  text-align:right;
  color:#fff !important;
}
.vhVideoPage .rvCard .title a{
  color:#fff !important;
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
}

.vhVideoPage .sub{
  display:flex;
  gap:8px;
  font-size: 10.5px;
  color: rgba(255,255,255,.62);
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

/* Desktop random grid */
.vhVideoPage .deskOnly{ display:none; }
@media (min-width:980px){
  .vhVideoPage .deskOnly{ display:block; margin-top:14px; }
  .vhVideoPage .deskGrid{
    padding:0 12px 14px;
    display:grid;
    gap:12px;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    align-items:stretch;
  }
  .vhVideoPage .stripCard{ padding:10px; }
  .vhVideoPage .stripCard .meta{ padding-top:10px; }
  .vhVideoPage .stripCard .title{ text-align:right; }
}

/* Load more button */
.vhVideoPage .vhLoadMoreBtn{
  margin-top: 10px;
  width:100%;
  padding: 11px 12px;
  border-radius: 14px;
  background: rgba(255,191,0,.10);
  border: 1px solid rgba(255,191,0,.32);
  color:#fff;
  font-weight: 1000;
  cursor:pointer;
}
.vhVideoPage .vhLoadMoreBtn:hover{ background: rgba(255,191,0,.14); }
.vhVideoPage .vhLoadMoreBtn.vhDisabled{
  opacity:.65;
  cursor:default;
}

.vhVideoPage .vhEmpty{
  color:rgba(243,244,246,.70);
  font-size:12px;
}

/* Click-to-play */
.vhVideoPage .vh-ctp{
  position:absolute;
  inset:0;
  display:flex;
  align-items:center;
  justify-content:center;
  background:rgba(0,0,0,.20);
  cursor:pointer;
  user-select:none;
  -webkit-tap-highlight-color: transparent;
  z-index:50;
}
.vhVideoPage .vh-ctp-inner{
  display:flex;
  align-items:center;
  gap:10px;
  padding:12px 14px;
  border-radius:18px;
  background: var(--vh-gold-bg);
  border: 1px solid var(--vh-gold-br);
  backdrop-filter: blur(8px);
}
.vhVideoPage .vh-ctp .vh-icon{
  width:44px;height:44px;
  border-radius:999px;
  display:grid;place-items:center;
  background:rgba(255,255,255,.12);
  border:1px solid rgba(255,255,255,.18);
  color:#fff;
}
.vhVideoPage .vh-ctp b{ font-weight:1000; color:#fff; }

.vhVideoPage .vh-ctp.vh-arming{
  opacity:0 !important;
  pointer-events:none !important;
  background:transparent !important;
}

.vhVideoPage .vh-hidden{ display:none !important; }
.vhVideoPage .playerWrap.vh-playing > .vh-ctp{ display:none !important; }

@media (prefers-reduced-motion: reduce){
  .vhVideoPage *{ scroll-behavior:auto !important; transition:none !important; animation:none !important; }
}


.vhVideoPage .vhSub {
    display:flex;
    gap:10px;
    font-size:12px;
    opacity:.85;
    flex-wrap:wrap;
    color:rgba(255,255,255,.62);
}

.vhVideoPage .vhSub span {
    border:none !important;
}

.vhVideoPage .vhSub span::before,
.vhVideoPage .vhSub span::after {
    content:none !important;
    display:none !important;
    border:0 !important;
}



/* Vertical video poster fix */
.player,
.player__media {
  overflow: hidden;
}

.player video,
.player img,
.video-card__thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center center;
  display: block;
}



/* Player poster alignment refined fix */
.player {
  overflow: hidden;
}

.player video {
  width: 100%;
  height: 100%;
  max-height: 100%;
  object-fit: contain;
  object-position: center center;
  display: block;
}



/* External players */
.player .video-js {
  width: 100%;
  height: 100%;
}

.player .video-js .vjs-tech {
  object-fit: contain;
}

.player #vt-jwplayer {
  width: 100%;
  height: 100%;
}


/* PornPlayer custom styles */

/* Bokon HTML5 Player - basic skin */

/* Container keeps aspect ratio and centers content */
.bk-player {
  position: relative;
  width: 100%;
  max-width: 960px;
  margin: 0 auto;
  background: #000;
  color: #fff;
  font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  overflow: hidden;
}

/* 16:9 by default, can be overridden with data-aspect */
.bk-player::before {
  content: "";
  display: block;
  padding-top: 56.25%; /* 16:9 */
}

.bk-player[data-aspect="4:3"]::before {
  padding-top: 75%;
}

.bk-player[data-aspect="9:16"]::before {
  padding-top: 177.78%;
}

.bk-player__inner {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
}

/* Video area */
.bk-player__media {
  position: relative;
  flex: 1 1 auto;
  background: #000;
  display: grid;
  place-items: center;
}

.bk-player video {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: contain; /* مهم: تصویر عمودی کشیده نشود */
  background-color: #000;
}

/* Big play button */
.bk-player__bigplay {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  pointer-events: none;
  transition: opacity .2s ease;
}

.bk-player--playing .bk-player__bigplay,
.bk-player--loading .bk-player__bigplay {
  opacity: 0;
}

.bk-player__bigplay-btn {
  pointer-events: auto;
  width: 72px;
  height: 72px;
  border-radius: 999px;
  border: none;
  background: rgba(0,0,0,.6);
  display: grid;
  place-items: center;
  cursor: pointer;
  box-shadow: 0 8px 30px rgba(0,0,0,.6);
}

.bk-player__bigplay-btn::before {
  content: "";
  border-style: solid;
  border-width: 11px 0 11px 18px;
  border-color: transparent transparent transparent #fff;
  margin-left: 3px;
}

/* Controls bar */
.bk-player__controls {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 6px 10px;
  background: linear-gradient(to top, rgba(0,0,0,.7), rgba(0,0,0,.1));
  font-size: 12px;
}

.bk-player__btn {
  border: none;
  background: none;
  color: inherit;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  cursor: pointer;
  padding: 0;
}

.bk-player__btn svg {
  width: 16px;
  height: 16px;
}

/* Time */
.bk-player__time {
  min-width: 70px;
  text-align: center;
  font-variant-numeric: tabular-nums;
}

/* Progress */
.bk-player__progress-wrap {
  position: relative;
  flex: 1 1 auto;
  height: 6px;
  border-radius: 999px;
  background: rgba(255,255,255,.15);
  cursor: pointer;
  overflow: hidden;
}

.bk-player__progress-buffer {
  position: absolute;
  inset: 0;
  width: 0;
  background: rgba(255,255,255,.25);
}

.bk-player__progress-fill {
  position: absolute;
  inset: 0;
  width: 0;
  background: #ff3366;
}

.bk-player__scrubber {
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 12px;
  height: 12px;
  border-radius: 999px;
  background: #fff;
  box-shadow: 0 0 0 2px rgba(0,0,0,.4);
}

/* Volume */
.bk-player__volume-wrap {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  gap: 4px;
  width: 90px;
}

.bk-player__volume-range {
  -webkit-appearance: none;
  appearance: none;
  width: 100%;
  height: 4px;
  border-radius: 999px;
  background: rgba(255,255,255,.25);
  outline: none;
}

.bk-player__volume-range::-webkit-slider-thumb {
  -webkit-appearance: none;
  appearance: none;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: #fff;
}

.bk-player__volume-range::-moz-range-thumb {
  width: 10px;
  height: 10px;
  border: none;
  border-radius: 50%;
  background: #fff;
}

/* Small screens */
@media (max-width: 640px) {
  .bk-player__time {
    min-width: 58px;
    font-size: 11px;
  }

  .bk-player__volume-wrap {
    width: 70px;
  }
}


/* PornPlayer midroll demo overlay */
.bk-midroll-overlay {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(0,0,0,0.7);
  z-index: 20;
  pointer-events: none;
}
.bk-midroll-inner {
  padding: 12px 18px;
  border-radius: 4px;
  background: #ffcc00;
  color: #000;
  font-weight: 600;
  font-size: 14px;
}