/* Hoshma Player Pro - Front CSS */
.mfp-player, .mfp-player *{
  box-sizing:border-box;
  font-family: var(--mfp-font, 'Estedad', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif);
}
.mfp-player{
  /* مقادیر پیش‌فرض - با تنظیمات کاربر در class-mfp-frontend.php overrride می‌شوند */
  --mfp-primary:#7c3aed;
  --mfp-accent:#06b6d4;
  --mfp-bg:#0b1020;
  --mfp-fg:#e5e7eb;
  --mfp-playlist-bg:#0b1020;
  --mfp-controls-bg:#000000;
  --mfp-controls-bg-rgb:0, 0, 0;
  --mfp-ad-badge-bg:#facc15;
  --mfp-ad-badge-color:#0f172a;
  --mfp-ad-skip-bg:#000000;
  --mfp-ad-skip-bg-rgb:0, 0, 0;
  --mfp-ad-skip-color:#ffffff;
  --mfp-ad-cta-color:#ffffff;
  --mfp-font: 'Estedad', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  --mfp-sub-size:18px;
  --mfp-sub-bg:rgba(0,0,0,.6);

  position:relative; width:100%;
  max-width:100%;
  background:var(--mfp-bg); color:var(--mfp-fg);
  border-radius:16px; overflow:hidden;
  box-shadow:0 18px 50px rgba(15,23,42,.25);
  user-select:none;
  direction: ltr !important;

  /* تضمین استک طبیعی بین ویجت‌های متوالی */
  display:block;
  clear:both;
  float:none;
  isolation:isolate;

  /* جلوگیری از فشرده/همپوشانی شدن داخل والد flex (مثل Elementor با --display:flex) */
  flex: 0 0 100%;
  min-width: 0;
  min-height: 0;
}
.mfp-player.mfp-audio,
.mfp-player.mfp-video,
.mfp-player .mfp-controls,
.mfp-player .mfp-bottom,
.mfp-player .mfp-audio-bar,
.mfp-player .mfp-audio-info,
.mfp-player .mfp-progress,
.mfp-player .mfp-progress .played,
.mfp-player .mfp-progress .buffer{
  direction: ltr !important;
}
/* پلی‌لیست‌ها در سایت‌های فارسی RTL هستند (شماره/کاور راست، دکمه پلی چپ) */
.mfp-player.mfp-video-playlist,
.mfp-player.mfp-audio-playlist{
  direction: rtl !important;
}
/* تنها زیرنویس و برند و badge تبلیغ از data-dir / inset استفاده می‌کنند */

/* ---------- Video Player ---------- */
/* تکنیک کلاسیک و بولت‌پروف برای نسبت‌تصویر روی همه مرورگرها و iframe ادیتور:
   padding-top درصدی روی والد + height:0 + بچه‌های absolute. */
.mfp-video{
  display:block;
  width:100%;
  height:0 !important;
  padding-top: var(--mfp-ar, 56.25%) !important;
  aspect-ratio:auto !important;
}
.mfp-video .mfp-stage{ position:absolute; inset:0; }
.mfp-video video{ width:100%; height:100%; display:block; background:#000; object-fit:contain; }

.mfp-video .mfp-poster{
  position:absolute; inset:0; background-size:cover; background-position:center;
  display:flex; align-items:center; justify-content:center;
  transition:opacity .3s;
}
.mfp-video .mfp-poster.hidden{ opacity:0; pointer-events:none; }
.mfp-poster .mfp-big-play{
  width:88px; height:88px; border-radius:50%;
  background: linear-gradient(135deg, var(--mfp-primary), var(--mfp-accent));
  box-shadow:0 14px 40px rgba(0,0,0,.5);
  display:flex; align-items:center; justify-content:center;
  cursor:pointer; transition:transform .15s;
}
.mfp-poster .mfp-big-play:hover{ transform:scale(1.06); }
.mfp-poster .mfp-big-play svg{
  width:30px !important; height:30px !important;
  fill:#fff !important;
  display:block !important;
  opacity:1 !important; visibility:visible !important;
  max-width:none !important; max-height:none !important;
}

.mfp-video .mfp-subs{
  position:absolute; left:50%; transform:translateX(-50%);
  bottom:34px; max-width:84%;
  background: var(--mfp-sub-bg);
  color:#fff;
  padding:6px 14px; border-radius:8px;
  font-size: var(--mfp-sub-size);
  line-height:1.6;
  text-align:center;
  pointer-events:none;
  white-space:pre-wrap;
  backdrop-filter: blur(4px);
}
.mfp-subs[data-dir="rtl"]{ direction:rtl; unicode-bidi: plaintext; }
.mfp-subs[data-dir="ltr"]{ direction:ltr; unicode-bidi: plaintext; }
.mfp-subs.hidden{ display:none; }

.mfp-video .mfp-brand{
  position:absolute; top:14px; inset-inline-start:14px;
  background: rgba(0,0,0,.4); color:#fff; font-size:12px;
  padding:4px 10px; border-radius:999px; backdrop-filter: blur(4px);
  pointer-events:none;
}

/* Controls */
.mfp-controls{
  position:absolute; left:0; right:0; bottom:0;
  padding:12px 14px 10px;
  background: linear-gradient(to top, rgba(var(--mfp-controls-bg-rgb), .85), rgba(var(--mfp-controls-bg-rgb), 0));
  opacity:0; transform:translateY(8px);
  transition: opacity .2s, transform .2s;
  z-index:5;
}
/* استفاده از .mfp-video به‌جای .mfp-player تا انتخابگر هنگام
   تو‌در‌تو بودن (پلیر داخل پلی‌لیست که والد هم کلاس .mfp-player دارد) به
   اشتباه روی والد بدون .is-playing فعال نشود و کنترل‌ها همیشه دیده نشوند. */
.mfp-video.is-playing:hover .mfp-controls,
.mfp-video:not(.is-playing) .mfp-controls,
.mfp-video.show-controls .mfp-controls{
  opacity:1; transform:translateY(0);
}

.mfp-progress-wrap{
  position:relative; height:18px; cursor:pointer; display:flex; align-items:center;
  touch-action: none; /* اجازه‌ی drag افقی روی نوار بدون تداخل با اسکرول صفحه */
}
.mfp-progress{
  position:relative; width:100%; height:5px; background:rgba(255,255,255,.25);
  border-radius:999px; overflow:hidden;
}
.mfp-progress .buffer{ position:absolute; inset:0; width:0%; background:rgba(255,255,255,.2); }
.mfp-progress .played{
  position:absolute; inset:0; width:0%;
  background: linear-gradient(90deg, var(--mfp-primary), var(--mfp-accent));
}
.mfp-progress-wrap .thumb{
  position:absolute; width:20px; height:14px; border-radius:50%;
  background:#fff; top:50%; left:0;
  transform:translate(-50%,-50%);
  box-shadow:0 2px 8px rgba(0,0,0,.4);
  opacity:0; transition:opacity .15s, transform .12s;
  pointer-events:none;
}
.mfp-progress-wrap:hover .thumb,
.mfp-progress-wrap.is-seeking .thumb{ opacity:1; }
.mfp-progress-wrap.is-seeking .thumb{ transform:translate(-50%,-50%) scale(1.15); }

.mfp-bottom{
  display:flex; align-items:center; gap:10px;
  margin-top:6px;
}
.mfp-btn-i{
  background:transparent; border:none; color:var(--mfp-fg); cursor:pointer;
  width:36px; height:36px; border-radius:10px;
  display:inline-flex; align-items:center; justify-content:center;
  transition:background .2s;
  padding:0; line-height:1;
}
.mfp-btn-i:hover{ background:rgba(255,255,255,.12); }
/* جلوگیری از مخفی‌شدن آیکون‌ها توسط استایل‌های قالب سایت (visibility/display/fill صفر) */
.mfp-btn-i svg{
  width:20px !important; height:20px !important;
  fill:currentColor !important; color:var(--mfp-fg) !important;
  display:inline-block !important;
  vertical-align:middle !important;
  opacity:1 !important; visibility:visible !important;
  max-width:none !important; max-height:none !important;
  pointer-events:none;
}
.mfp-btn-i svg[stroke]{ fill:none !important; stroke: currentColor !important; }
.mfp-btn-i svg path,
.mfp-btn-i svg polyline,
.mfp-btn-i svg line,
.mfp-btn-i svg circle{ fill:inherit; }
.mfp-btn-i svg[stroke] path,
.mfp-btn-i svg[stroke] polyline,
.mfp-btn-i svg[stroke] line{ fill:none !important; stroke:currentColor !important; }

/* دکمه‌های جلو/عقب با شماره‌ی کوچک روی آیکن */
.mfp-btn-i.mfp-seek-back,
.mfp-btn-i.mfp-seek-fwd{ position:relative; }
.mfp-btn-i.mfp-seek-back .mfp-seek-n,
.mfp-btn-i.mfp-seek-fwd  .mfp-seek-n{
  position:absolute; inset:auto 0 6px 0;
  text-align:center; font-size:9px; font-weight:800;
  line-height:5; color:currentColor !important; pointer-events:none;
  letter-spacing:.2px;
}

.mfp-time{ font-variant-numeric: tabular-nums; font-size:13px; opacity:.95; margin-inline:6px; }
.mfp-spacer{ flex:1; }

.mfp-vol{ display:flex; align-items:center; gap:6px; }
.mfp-vol .bar{
  width:0; overflow:hidden; transition:width .25s;
  height:4px; background:rgba(255,255,255,.25); border-radius:999px; position:relative;
}
.mfp-vol:hover .bar{ width:80px; }
.mfp-vol .bar .fill{
  position:absolute; inset:0; width:100%;
  background:#fff; border-radius:999px;
}

/* Menu */
.mfp-menu{ position:relative; }
.mfp-menu .mfp-menu-list{
  position:absolute; bottom:calc(100% + 8px); inset-inline-end:0;
  background:rgba(20,20,30,.96); border:1px solid rgba(255,255,255,.08);
  border-radius:10px; padding:6px; min-width:150px;
  box-shadow:0 12px 30px rgba(0,0,0,.5);
  display:none;
  backdrop-filter: blur(10px);
}
.mfp-menu.open .mfp-menu-list{ display:block; }
.mfp-menu-list button{
  display:flex; width:100%; justify-content:space-between; align-items:center;
  background:transparent; border:none; color:#fff; padding:7px 10px;
  border-radius:7px; cursor:pointer; font-size:13px;
}
.mfp-menu-list button:hover{ background:rgba(255,255,255,.08); }
.mfp-menu-list button.active{ color:var(--mfp-accent); }
.mfp-menu-list .group-title{ font-size:11px; color:#94a3b8; padding:6px 10px 2px; }

/* Ad badge & skip — لایه شفاف که کلیک از روش رد می‌شه تا کنترل‌ها کار کنن */
.mfp-ad-layer{
  position:absolute; inset:0; z-index:6;
  display:none;
  pointer-events:none;
}
.mfp-ad-layer.on{ display:block; }
.mfp-ad-layer > *{ pointer-events:auto; }
.mfp-ad-badge{
  position:absolute; top:14px; inset-inline-end:14px;
  background: var(--mfp-ad-badge-bg);
  color: var(--mfp-ad-badge-color);
  font-weight:700; font-size:12px;
  padding:4px 10px; border-radius:6px;
}
.mfp-ad-skip{
  position:absolute; bottom:80px; inset-inline-end:14px;
  background: rgba(var(--mfp-ad-skip-bg-rgb), .75);
  color: var(--mfp-ad-skip-color);
  border:1px solid rgba(255,255,255,.2);
  padding:8px 14px; border-radius:8px; cursor:pointer; font-size:13px;
}
.mfp-ad-skip[disabled]{ cursor:default; opacity:.75; }
.mfp-ad-cta{
  position:absolute; bottom:80px; inset-inline-start:14px;
  background: linear-gradient(135deg, var(--mfp-primary), var(--mfp-accent));
  color: var(--mfp-ad-cta-color);
  padding:8px 14px; border-radius:8px; cursor:pointer;
  font-size:13px; text-decoration:none;
}

/* ---------- Audio Player ---------- */
.mfp-audio{
  /* override حالت ویدیو در صورت ترکیب کلاس */
  height:auto !important; padding-top:0 !important; aspect-ratio:auto !important;
  display:flex; align-items:center; gap:14px; padding:12px 16px;
  background: var(--mfp-bg);
  border-radius:16px;
}
.mfp-audio.has-poster{ padding:14px; }
.mfp-audio .mfp-audio-cover{
  width:64px; height:64px; border-radius:12px; flex:none;
  background: linear-gradient(135deg, var(--mfp-primary), var(--mfp-accent));
  background-size:cover; background-position:center;
  display:flex; align-items:center; justify-content:center;
  box-shadow:0 10px 24px rgba(0,0,0,.3);
}
.mfp-audio.has-poster .mfp-audio-cover{ width:100px; height:100px;margin-top: 15px; }
.mfp-audio .mfp-audio-cover svg{
  width:26px !important; height:26px !important;
  fill:#fff !important; opacity:.9 !important;
  display:block !important; visibility:visible !important;
  max-width:none !important; max-height:none !important;
}
.mfp-audio-cover.with-img svg{ display:none !important; }

.mfp-audio .mfp-audio-info{ flex:1; min-width:0; }
.mfp-audio .mfp-audio-title{ color: var(--mfp-fg); font-weight:700; font-size:14px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; direction: rtl !important; }
.mfp-audio .mfp-audio-artist{ color: rgba(148,163,184,.95); font-size:12px; margin-top:8px; direction: rtl !important; }
.mfp-audio .mfp-audio-bar{
  margin-top:8px; display:flex; align-items:center; gap:10px;
}
.mfp-audio .mfp-audio-bar .mfp-progress-wrap{ flex:1; }
.mfp-audio .mfp-audio-bar .mfp-time{ font-size:11px; opacity:.85; color: var(--mfp-fg); }

.mfp-audio .mfp-audio-controls{
  display:flex; align-items:center; gap:4px;
}

/* ---------- Playlists ---------- */
/* هدر مرکزی پلی‌لیست (مشترک بین ویدیو/موزیک) */
.mfp-pl-header,
.mfp-apl-header{
  text-align:center;
  font-weight:800;
  font-size:18px;
  color: var(--mfp-fg);
  padding:6px 12px 14px;
  letter-spacing:.2px;
  direction: rtl;
  background: transparent;
}

.mfp-video-playlist{
  display:flex; flex-direction:column; gap:14px;
  background: var(--mfp-playlist-bg);
  border-radius:16px; padding:14px; color: var(--mfp-fg);
  box-shadow:0 18px 50px rgba(15,23,42,.3);
}
.mfp-video-playlist .mfp-pl-main{
  border-radius:16px; overflow:hidden; box-shadow:0 12px 30px rgba(15,23,42,.4); background:#000;
  position:relative; width:100%; height:0 !important; padding-top:56.25%; aspect-ratio:auto;
}
/* پلیر داخلی پلی‌لیست: کاملاً fill کند و از padding/height:0 خارج شود */
.mfp-video-playlist .mfp-pl-main > .mfp-player{
  position:absolute !important; inset:0 !important;
  width:100% !important; height:100% !important;
  padding-top:0 !important; aspect-ratio:auto !important;
}
/* لیست لیستی (مثل پلی‌لیست موزیک) */
.mfp-video-playlist .mfp-pl-list{
  max-height:420px; overflow:auto;
  border-top:1px dashed rgba(255,255,255,.08); padding-top:8px;
  display:flex; flex-direction:column; gap:6px;
  direction: rtl;
}
.mfp-video-playlist .mfp-pl-item{
  display:flex; align-items:center; gap:12px; padding:8px; border-radius:10px; cursor:pointer;
  background: transparent; border:1px solid transparent;
  transition: background .2s, border-color .2s;
  direction: rtl;
}
.mfp-video-playlist .mfp-pl-item:hover{ background:rgba(255,255,255,.05); }
.mfp-video-playlist .mfp-pl-item.active{
  background: linear-gradient(90deg, color-mix(in srgb, var(--mfp-primary) 22%, transparent), transparent);
  border-color: color-mix(in srgb, var(--mfp-primary) 35%, transparent);
}
.mfp-video-playlist .mfp-pl-thumb{
  width:96px; height:54px; flex:none; position:relative;
  background-size:cover; background-position:center; background-color:#111;
  border-radius:10px; overflow:hidden;
}
.mfp-video-playlist .mfp-pl-thumb::after{
  content:''; position:absolute; inset:0;
  background:linear-gradient(to top, rgba(0,0,0,.5), transparent 60%);
}
.mfp-video-playlist .mfp-pl-play{
  position:absolute; inset:0; display:flex; align-items:center; justify-content:center;
  pointer-events:none;
}
.mfp-video-playlist .mfp-pl-play svg{
  width:28px; height:28px;
  background: rgba(0,0,0,.55); border-radius:50%; padding:6px; fill:#fff;
  transition: background .2s;
}
.mfp-video-playlist .mfp-pl-item:hover .mfp-pl-play svg{
  background: linear-gradient(135deg,var(--mfp-primary),var(--mfp-accent));
}
.mfp-video-playlist .mfp-pl-info{ flex:1; min-width:0; }
.mfp-video-playlist .mfp-pl-title{
  font-size:13px; font-weight:700; color: var(--mfp-fg);
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
  direction: rtl;
}
.mfp-video-playlist .mfp-pl-desc{
  font-size:11px; color: rgba(148,163,184,.95); margin-top:3px;
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical;
  overflow:hidden; line-height:1.5;
  direction: rtl;
}
.mfp-video-playlist .mfp-pl-item.active .mfp-pl-title{ color:var(--mfp-accent); }
.mfp-video-playlist .mfp-pl-go{ flex:none; }

/* Audio playlist */
.mfp-audio-playlist{
  background: var(--mfp-playlist-bg);
  border-radius:16px; padding:14px; color: var(--mfp-fg);
  box-shadow:0 18px 50px rgba(15,23,42,.3);
}
.mfp-audio-playlist .mfp-apl-player{ margin-bottom:10px; }
.mfp-audio-playlist .mfp-apl-list{
  max-height:360px; overflow:auto; border-top:1px dashed rgba(255,255,255,.08); padding-top:8px;
  direction: rtl;
}
.mfp-audio-playlist .mfp-apl-item{
  display:flex; align-items:center; gap:12px; padding:8px; border-radius:10px; cursor:pointer;
  direction: rtl;
}
.mfp-audio-playlist .mfp-apl-item:hover{ background:rgba(255,255,255,.05); }
.mfp-audio-playlist .mfp-apl-item.active{
  background: linear-gradient(90deg, color-mix(in srgb, var(--mfp-primary) 22%, transparent), transparent);
}
.mfp-audio-playlist .mfp-apl-cover{
  width:46px; height:46px; border-radius:10px; background-size:cover; background-position:center;
  background-color: rgba(255,255,255,.06); flex:none;
  display:flex; align-items:center; justify-content:center;
}
.mfp-audio-playlist .mfp-apl-cover svg{ width:18px; height:18px; fill: rgba(148,163,184,.95); }
.mfp-audio-playlist .mfp-apl-cover.with-img svg{ display:none; }
.mfp-audio-playlist .mfp-apl-info{ flex:1; min-width:0; }
.mfp-audio-playlist .mfp-apl-title{ font-size:13px; font-weight:700; color: var(--mfp-fg); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.mfp-audio-playlist .mfp-apl-artist{ font-size:11px; color: rgba(148,163,184,.95); margin-top:2px; }
.mfp-audio-playlist .mfp-apl-desc{
  font-size:11px; color: rgba(148,163,184,.95); margin-top:3px; line-height:1.5;
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical;
  overflow:hidden;
}
.mfp-audio-playlist .mfp-apl-idx{ font-size:11px; color: rgba(148,163,184,.95); width:24px; text-align:center; }
.mfp-audio-playlist .mfp-apl-item.active .mfp-apl-title{ color:var(--mfp-accent); }

@media (max-width:560px){
  .mfp-video-playlist .mfp-pl-thumb{ width:78px; height:44px; }
  .mfp-pl-header,
  .mfp-apl-header{ font-size:16px; padding:4px 8px 10px; }
}

/* ============================================================
 *  Fullscreen — مهم
 *  چون .mfp-video از ترفند aspect-ratio (`padding-top:56.25%` + `height:0`)
 *  استفاده می‌کند، در حالت تمام‌صفحه روی موبایل، ارتفاع پلیر بیشتر از صفحه
 *  می‌شود و نوار کنترل/زیرنویس به زیر صفحه می‌رود. در این بخش، در حالت
 *  fullscreen واقعی این ترفند خنثی می‌شود تا پلیر دقیقاً اندازه صفحه شود.
 * ============================================================ */
.mfp-player:fullscreen,
.mfp-player:-webkit-full-screen{
  border-radius: 0 !important;
  width: 100% !important;
  height: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding-top: 0 !important;
  aspect-ratio: auto !important;
  background: #000 !important;
}
.mfp-player.mfp-video:fullscreen,
.mfp-player.mfp-video:-webkit-full-screen{
  display: block;
}
.mfp-player:fullscreen .mfp-stage,
.mfp-player:-webkit-full-screen .mfp-stage{
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
}
.mfp-player:fullscreen video,
.mfp-player:-webkit-full-screen video{
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
  background: #000;
}
.mfp-player:fullscreen .mfp-controls,
.mfp-player:-webkit-full-screen .mfp-controls{
  padding: 16px 22px 16px !important;
  padding-bottom: max(16px, env(safe-area-inset-bottom, 16px)) !important;
  z-index: 2147483647 !important;
}
.mfp-player:fullscreen .mfp-subs,
.mfp-player:-webkit-full-screen .mfp-subs{
  font-size: calc(var(--mfp-sub-size) * 1.4) !important;
  bottom: 110px !important;
  bottom: calc(110px + env(safe-area-inset-bottom, 0px)) !important;
  z-index: 2147483646 !important;
}
.mfp-player:fullscreen .mfp-ad-layer,
.mfp-player:-webkit-full-screen .mfp-ad-layer{
  z-index: 2147483640 !important;
}

/* ============================================================
 *  Fake Fullscreen — برای سافاری آیفون
 *  چون iPhone Safari از fullscreen API روی Element پشتیبانی نمی‌کند و
 *  webkitEnterFullscreen روی <video> پلیر بومی iOS را باز می‌کند (که
 *  کنترل‌ها/زیرنویس‌های سفارشی ما را نشان نمی‌دهد)، در iPhone از این
 *  حالت Fake استفاده می‌شود: کانتینر پلیر با position:fixed کل صفحه را
 *  می‌پوشاند تا کنترل‌ها و زیرنویس‌ها به‌درستی دیده شوند.
 * ============================================================ */
.mfp-player.mfp-fake-fs{
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  width: 100vw !important;
  height: 100vh !important;
  height: 100dvh !important;
  max-width: 100vw !important;
  z-index: 2147483647 !important;
  margin: 0 !important;
  border-radius: 0 !important;
  padding-top: 0 !important;
  aspect-ratio: auto !important;
  background: #000 !important;
  display: block !important;
}
.mfp-player.mfp-fake-fs .mfp-stage{
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
}
.mfp-player.mfp-fake-fs video{
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
  background: #000;
}
.mfp-player.mfp-fake-fs .mfp-controls{
  padding: 16px 20px 16px !important;
  padding-bottom: max(16px, env(safe-area-inset-bottom, 16px)) !important;
  z-index: 2147483647 !important;
}
.mfp-player.mfp-fake-fs .mfp-subs{
  font-size: calc(var(--mfp-sub-size) * 1.35) !important;
  bottom: 100px !important;
  bottom: calc(100px + env(safe-area-inset-bottom, 0px)) !important;
  z-index: 2147483646 !important;
}
.mfp-player.mfp-fake-fs .mfp-more-menu{
  top: max(12px, env(safe-area-inset-top, 12px)) !important;
  right: max(12px, env(safe-area-inset-right, 12px)) !important;
}
.mfp-player.mfp-fake-fs .mfp-ad-layer{
  z-index: 2147483640 !important;
}
.mfp-player.mfp-fake-fs .mfp-ad-badge{
  top: max(12px, env(safe-area-inset-top, 12px)) !important;
}
.mfp-player.mfp-fake-fs .mfp-ad-skip,
.mfp-player.mfp-fake-fs .mfp-ad-cta{
  bottom: max(100px, calc(100px + env(safe-area-inset-bottom, 0px))) !important;
}
/* بدنه‌ی صفحه هنگام Fake FS اسکرول نشود */
body.mfp-fake-fs-active,
html.mfp-fake-fs-active{
  overflow: hidden !important;
  touch-action: none !important;
}

/* ============================================================
 *  Mobile More-Menu (همبرگری بالا-راست فقط روی موبایل)
 *  داخلش: تصویر در تصویر + دانلود
 * ============================================================ */
.mfp-more-menu{
  display: none; /* پیش‌فرض روی دسکتاپ پنهان است */
  position: absolute;
  top: 10px; right: 10px;
  z-index: 5;
}
.mfp-more-toggle{
  background: rgba(0,0,0,.55);
  border: 1px solid rgba(255,255,255,.18);
  color:#fff; cursor:pointer;
  width:34px; height:34px;
  border-radius:10px;
  display: grid; place-items: center;
  padding:0; line-height:1;
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  transition: background .2s, transform .15s;
}
.mfp-more-toggle:hover{ background: rgba(0,0,0,.75); }
.mfp-more-toggle svg{
  width:18px !important; height:18px !important;
  fill: currentColor !important;
  display:block !important;
  pointer-events:none;
}
.mfp-more-list{
  position: absolute;
  top: calc(100% + 6px);
  right: 0;
  min-width: 168px;
  background: rgba(20,20,30,.96);
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 12px;
  padding: 6px;
  box-shadow: 0 12px 30px rgba(0,0,0,.5);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  display: none;
}
.mfp-more-menu.open .mfp-more-list{ display: block; }
.mfp-more-list button{
  display: flex; align-items: center; gap: 10px;
  width: 100%;
  background: transparent;
  border: none;
  color: #fff;
  padding: 8px 10px;
  border-radius: 8px;
  cursor: pointer;
  font-size: 13px;
  font-weight: 500;
  text-align: right;
  direction: rtl;
  font-family: inherit;
}
.mfp-more-list button:hover{ background: rgba(255,255,255,.08); }
.mfp-more-list button svg{
  width: 16px !important; height: 16px !important;
  fill: currentColor !important;
  display: inline-block !important;
  flex: 0 0 16px;
  pointer-events: none;
}
.mfp-more-list button svg[stroke]{
  fill: none !important;
  stroke: currentColor !important;
}
.mfp-more-list button span{ flex: 1; line-height: 1.4; }
/* روی تبلیغ، منوی بیشتر دیده نشود (با ad-badge همپوشانی پیدا نکند) */
.mfp-video:has(.mfp-ad-layer.on) .mfp-more-menu,
.mfp-video.mfp-is-ad .mfp-more-menu{
  display: none !important;
}

/* ---------- Mobile responsive fixes ---------- */
@media (max-width: 782px){
  /* فاصله‌ی اجباری بین ویجت‌ها تا روی هم نیفتند، حتی داخل والد flex */
  .mfp-player{
    margin-bottom: 14px;
    width: 100% !important;
    max-width: 100% !important;
    flex: 1 1 100% !important;
    flex-basis: 100% !important;
    min-width: 0 !important;
  }
  
  .mfp-poster .mfp-big-play{
    width: 60px;
    height: 60px;
  }
  .mfp-ad-cta{
    font-size: 10px;
  }
  .mfp-ad-skip{
    font-size: 10px;
  }
  .mfp-player.mfp-fake-fs .mfp-subs{
    bottom: 80px;
    font-size: 11px;
  }
  .mfp-video .mfp-subs{
    position: absolute;
  left: 50%;
  transform: translateX(-50%);
  bottom: 70px;
  max-width: 84%;
  background: var(--mfp-sub-bg);
  color: #fff;
  padding: 6px 14px;
  border-radius: 8px;
  font-size: 11px;
  line-height: 1.6;
  text-align: center;
  pointer-events: none;
  white-space: pre-wrap;
  backdrop-filter: blur(4px);
  }
  .mfp-player.mfp-fake-fs .mfp-subs{
    background-origin: 34px;
  }
  /* راه‌حل اصلی (بدون نیاز به :has): JS کلاس .mfp-flex-parent را روی هر والد flex
     و .mfp-elementor-ancestor را روی والدهای Elementor می‌گذارد. */
  .mfp-flex-parent{
    flex-wrap: wrap !important;
    align-items: flex-start !important;
  }
  .mfp-elementor-ancestor{
    flex: 0 0 100% !important;
    flex-basis: 100% !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    --width: 100% !important;
  }
  /* کانتینرهای Elementor (e-con / e-con-inner) را که پلیر ما در آن‌هاست، wrap کن */
  .e-con-inner.mfp-elementor-ancestor,
  .e-con.mfp-elementor-ancestor{
    flex-wrap: wrap !important;
  }

  /* راه‌حل پشتیبان با :has() برای موارد بدون JS */
  .e-con:has(.mfp-player),
  .e-con-inner:has(.mfp-player),
  .elementor-section:has(.mfp-player) > .elementor-container,
  .elementor-row:has(.mfp-player){
    flex-wrap: wrap !important;
    align-items: flex-start !important;
  }
  .elementor-widget:has(.mfp-player),
  .elementor-element:has(> .elementor-widget-container > .mfp-player),
  .elementor-element:has(> .elementor-element > .elementor-widget-container > .mfp-player),
  .e-con > .elementor-element:has(.mfp-player),
  .e-con-inner > .elementor-element:has(.mfp-player),
  .elementor-column:has(.mfp-player){
    flex: 0 0 100% !important;
    flex-basis: 100% !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    --width: 100% !important;
  }
}

@media (max-width: 600px){
  /* جلوگیری از چسبیدن پلیر به لبه‌های راست/چپ صفحه روی موبایل */
  .mfp-player{
    margin-left: 8px;
    margin-right: 8px;
    width: calc(100% - 16px) !important;
    max-width: calc(100% - 16px) !important;
    border-radius: 14px;
  }

  /* ویدیو: حتماً ارتفاع درصدی بگیرد حتی اگر aspect-ratio محاسبه نشود */
  .mfp-video{ height:auto; min-height:0; }

  /* دکمه پخش بزرگ وسط ویدیو روی موبایل کوچک‌تر */
  .mfp-poster .mfp-big-play{ width:60px; height:60px; }
  .mfp-poster .mfp-big-play svg{ width:22px; height:22px; }

  /* نوار کنترل ویدیو روی موبایل: یک ردیف، آیکن کوچک‌تر، بدون wrap */
  .mfp-video .mfp-controls{
    padding:8px 6px 6px;
    overflow: visible;
  }
  .mfp-video .mfp-bottom{
    gap:2px;
    flex-wrap: nowrap;
    overflow: visible; /* مهم: تا منوی کیفیت/سرعت/زیرنویس clip نشود */
  }
  /* روی موبایل: PIP و دانلود را از نوار کنترل حذف کن (داخل منوی همبرگری بالا-راست می‌روند) */
  .mfp-video .mfp-bottom .mfp-pip,
  .mfp-video .mfp-bottom .mfp-dl{
    display: none !important;
  }
  /* و منوی همبرگری را روی موبایل نمایش بده */
  .mfp-video > .mfp-more-menu,
  .mfp-pl-main .mfp-more-menu{
    display: block;
  }
  .mfp-more-toggle{
    width: 32px; height: 32px;
    border-radius: 9px;
  }
  .mfp-more-toggle svg{ width: 16px !important; height: 16px !important; }
  .mfp-more-list{
    min-width: 160px;
    max-width: calc(100vw - 32px);
    right: 40px;
    top: 0px;
  }
  .mfp-video .mfp-bottom .mfp-btn-i{
    width:28px; height:28px;
    border-radius:6px;
    flex: 0 0 auto;
  }
  .mfp-video .mfp-bottom .mfp-btn-i svg{ width:15px; height:15px; }
  .mfp-video .mfp-bottom .mfp-btn-i.mfp-seek-back .mfp-seek-n,
  .mfp-video .mfp-bottom .mfp-btn-i.mfp-seek-fwd  .mfp-seek-n{
    font-size:7px; bottom:4px; line-height:5;
  }
  /* روی موبایل فقط دکمه بی‌صدا را نشان بده، نوار slider را پنهان کن (فضا کم است) */
  .mfp-video .mfp-vol{
    display: inline-flex;
    gap: 0;
  }
  .mfp-video .mfp-vol .bar{ display: none !important; }
  .mfp-video .mfp-vol:hover .bar{ display: none !important; }
  .mfp-video .mfp-brand{ display:none; }
  .mfp-video .mfp-time{
    font-size:10px;
    margin-inline:2px;
    flex: 0 0 auto;
    white-space: nowrap;
  }
  /* نوار پیشرفت روی موبایل: ناحیه‌ی لمس بزرگ‌تر، خود نوار ضخیم‌تر، thumb همیشه دیده شود */
  .mfp-video .mfp-progress-wrap{
    height:28px;
    padding-block: 6px; /* فضای لمس عمودی */
  }
  .mfp-video .mfp-progress{ height:7px; }
  .mfp-video .mfp-progress-wrap .thumb{
    width:17px; height:16px;
    opacity:1;
  }

  /* منوها (کیفیت/سرعت/زیرنویس) روی موبایل کوچک‌تر و قابل دیدن */
  .mfp-menu .mfp-menu-list{
    min-width: 130px;
    max-width: calc(100vw - 24px);
    max-height: 50vh;
    overflow-y: auto;
    padding: 4px;
    border-radius: 8px;
    z-index: 10;
  }
  .mfp-menu-list button{
    padding: 8px 10px;
    font-size: 12px;
  }
  .mfp-menu-list .group-title{ font-size: 10px; padding: 4px 10px 2px; }

  /* زیرنویس روی موبایل کوچک‌تر و نزدیک‌تر به پایین */
  .mfp-video .mfp-subs{ font-size:10px; bottom:15px; padding:4px 10px; }

  /* دکمه‌های تبلیغ (Skip / CTA) روی موبایل کوچک‌تر */
  .mfp-ad-skip,
  .mfp-ad-cta{
    bottom: 66px;
    padding: 5px 9px;
    font-size: 11px;
    border-radius: 6px;
    max-width: 45%;
    line-height: 1.3;
  }
  .mfp-ad-skip{ inset-inline-end: 8px; }
  .mfp-ad-cta{
    inset-inline-start: 8px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  .mfp-ad-badge{
    top: 8px;
    inset-inline-end: 8px;
    padding: 3px 7px;
    font-size: 10px;
    border-radius: 4px;
  }

  /* پلیر موزیک: چیدمان افقی نگه داشته شود (کاور و اطلاعات کنار هم) */
  .mfp-audio{
    flex-wrap: nowrap !important;
    padding:10px;
    gap:10px;
    align-items: center;
  }
  .mfp-audio .mfp-audio-cover{
    width:56px; height:56px; flex: 0 0 56px;
  }
  .mfp-audio.has-poster .mfp-audio-cover{
    width: 100px;
    height: 100px;
    flex: 0 0 80px;
  }
  .mfp-audio .mfp-audio-info{
    flex: 1 1 auto;
    min-width: 0;
    padding-top: 10px;
  }
  /* روی موبایل عنوان طولانی به دو خط بپیچد، نه نقطه‌چین */
  .mfp-audio .mfp-audio-title{
    font-size:13px;
    white-space: normal;
    text-overflow: clip;
    display:-webkit-box;
    -webkit-line-clamp:2;
            line-clamp:2;
    -webkit-box-orient:vertical;
    overflow:hidden;
    line-height:1.45;
    word-break: break-word;
    overflow-wrap: anywhere;
  }
  .mfp-audio .mfp-audio-artist{ font-size:11px; }

  /* عنوان آیتم‌های پلی‌لیست هم روی موبایل دو خطی شود */
  .mfp-video-playlist .mfp-pl-title,
  .mfp-audio-playlist .mfp-apl-title{
    white-space: normal;
    text-overflow: clip;
    display:-webkit-box;
    -webkit-line-clamp:2;
            line-clamp:2;
    -webkit-box-orient:vertical;
    overflow:hidden;
    line-height:1.45;
    word-break: break-word;
    overflow-wrap: anywhere;
  }

  /* نوار کنترل پلیر صوتی: progress در ردیف خودش، دکمه‌ها زیر */
  .mfp-audio .mfp-audio-bar{
    flex-wrap: wrap;
    gap:4px;
    margin-top:6px;
  }
  .mfp-audio .mfp-audio-bar .mfp-btn-i{
    width:28px; height:28px; border-radius:6px;
    flex: 0 0 auto;
  }
  .mfp-audio .mfp-audio-bar .mfp-btn-i svg{ width:15px; height:15px; }
  .mfp-audio .mfp-audio-bar .mfp-btn-i.mfp-seek-back .mfp-seek-n,
  .mfp-audio .mfp-audio-bar .mfp-btn-i.mfp-seek-fwd  .mfp-seek-n{
    font-size:7px; bottom:14px; line-height:5;
  }
  .mfp-audio .mfp-audio-bar .mfp-progress-wrap{
    flex:1 1 100%; order:-1;
    height:26px;
    padding-block: 5px;
  }
  .mfp-audio .mfp-audio-bar .mfp-progress{ height:6px; }
  .mfp-audio .mfp-audio-bar .mfp-progress-wrap .thumb{
    width:14px; height:14px;
    opacity:1;
  }
  .mfp-audio .mfp-audio-bar .mfp-time{
    font-size:10px;
    margin-inline:2px;
    flex: 0 0 auto;
    white-space: nowrap;
  }
  /* روی موبایل فقط دکمه بی‌صدا، بدون نوار slider */
  .mfp-audio .mfp-vol{
    display: inline-flex;
    gap: 0;
  }
  .mfp-audio .mfp-vol .bar{ display: none !important; }
  .mfp-audio .mfp-vol:hover .bar{ display: none !important; }

  /* پلی‌لیست‌ها */
  .mfp-audio-playlist{ padding:10px; }
  .mfp-audio-playlist .mfp-apl-list{ max-height:280px; }
}

/* موبایل خیلی کوچک: آیکن‌های ضروری فقط */
@media (max-width: 380px){
  .mfp-video .mfp-bottom .mfp-btn-i{ width:26px; height:26px; }
  .mfp-video .mfp-bottom .mfp-btn-i svg{ width:14px; height:14px; }
  .mfp-audio .mfp-audio-bar .mfp-btn-i{ width:26px; height:26px; }
  .mfp-audio .mfp-audio-bar .mfp-btn-i svg{ width:14px; height:14px; }
  .mfp-audio.has-poster .mfp-audio-cover{ width: 100px;
    height: 100px;
    flex: 0 0 80px; }
}

/* Loader */
.mfp-loading{
  position:absolute; inset:0; display:flex; align-items:center; justify-content:center;
  pointer-events:none; opacity:0; transition:opacity .2s;
}
.mfp-player.is-loading .mfp-loading{ opacity:1; }
.mfp-loading::after{
  content:''; width:44px; height:44px; border-radius:50%;
  border:3px solid rgba(255,255,255,.25); border-top-color:#fff;
  animation: mfp-spin 0.9s linear infinite;
}
@keyframes mfp-spin{ to{ transform: rotate(360deg); } }

/* ============================================================
 * Typography weights — هر نوع متن وزن مناسب خودش را داشته باشد
 * (عنوان‌ها بولد، توضیحات/زیرعنوان‌ها رگولار، دکمه‌ها متوسط)
 * ============================================================ */

/* عنوان اصلی پلیر موزیک و آیتم‌های پلی‌لیست → Bold */
.mfp-audio .mfp-audio-title,
.mfp-video-playlist .mfp-pl-title,
.mfp-audio-playlist .mfp-apl-title{
  font-weight: 700;
}

/* هدر مرکزی پلی‌لیست → ExtraBold */
.mfp-pl-header,
.mfp-apl-header{
  font-weight: 800;
}

/* زیرعنوان‌ها و توضیحات → Regular */
.mfp-audio .mfp-audio-artist,
.mfp-video-playlist .mfp-pl-desc,
.mfp-audio-playlist .mfp-apl-artist,
.mfp-audio-playlist .mfp-apl-desc,
.mfp-audio-playlist .mfp-apl-idx{
  font-weight: 400;
}

/* زمان پخش (شمارنده) → Regular */
.mfp-time, .mfp-time .cur, .mfp-time .dur{
  font-weight: 400;
}

/* برند روی پلیر → Medium */
.mfp-video .mfp-brand{
  font-weight: 500;
}

/* بج «تبلیغ» → Bold */
.mfp-ad-badge{
  font-weight: 700;
}

/* دکمه‌های Skip و CTA تبلیغ → Medium */
.mfp-ad-skip,
.mfp-ad-cta{
  font-weight: 500;
}

/* آیتم‌های منوهای کیفیت/سرعت/زیرنویس → Medium */
.mfp-menu-list button{
  font-weight: 500;
}
.mfp-menu-list button.active{
  font-weight: 700;
}
.mfp-menu-list .group-title{
  font-weight: 600;
}

/* اعداد روی دکمه‌های جلو/عقب → ExtraBold (همان قبلی، صرفاً تأکید) */
.mfp-btn-i.mfp-seek-back .mfp-seek-n,
.mfp-btn-i.mfp-seek-fwd  .mfp-seek-n{
  font-weight: 800;
}

/* زیرنویس روی ویدیو → Medium */
.mfp-video .mfp-subs{
  font-weight: 500;
}