/* ════════════════════════════════════════════════════════════════
   پلیر سفارشی محبوب — ویدیو و صوت
   نقطه‌زنی فصل‌ها مثل یوتیوب + جلوگیری از دانلود ساده
   ════════════════════════════════════════════════════════════════ */

.mb-player {
  --mb-accent: var(--melon, #E8614D);
  --mb-accent-light: var(--melon-light, #F28C7D);
  position: relative;
  width: 100%;
  font-family: inherit;
  direction: rtl;
  user-select: none;
  -webkit-user-select: none;
  border-radius: var(--radius-lg, 16px);
  overflow: hidden;
  background: #0b0b0d;
  color: #fff;
}

/* ── ویدیو ── */
.mb-player--video { aspect-ratio: 16 / 9; }
.mb-player__media {
  display: block;
  width: 100%;
  height: 100%;
  background: #000;
  outline: none;
}
.mb-player--video .mb-player__media { object-fit: contain; }

/* ── صوت ── */
.mb-player--audio {
  aspect-ratio: auto;
  background: linear-gradient(135deg, #1b1d24 0%, #2a2230 100%);
  padding: 16px;
  border-radius: var(--radius-md, 12px);
}
.mb-player--audio .mb-player__media {
  position: absolute;
  width: 1px; height: 1px;
  opacity: 0; pointer-events: none;
}
.mb-player--audio .mb-player__controls {
  position: static;
  background: none;
  padding: 0;
  opacity: 1 !important;
  transform: none !important;
}

/* ════ لودینگ ════ */
.mb-player__loading {
  position: absolute; inset: 0;
  display: none;
  align-items: center; justify-content: center;
  pointer-events: none; z-index: 4;
}
.mb-player.is-loading .mb-player__loading { display: flex; }
.mb-player__spinner {
  width: 46px; height: 46px;
  border: 3px solid rgba(255,255,255,.25);
  border-top-color: var(--mb-accent);
  border-radius: 50%;
  animation: mb-spin .8s linear infinite;
}
@keyframes mb-spin { to { transform: rotate(360deg); } }

/* ════ دکمه پخش بزرگ وسط (ویدیو) ════ */
.mb-player__center {
  position: absolute; inset: 0;
  display: flex; align-items: center; justify-content: center;
  z-index: 3; cursor: pointer;
  background: rgba(0,0,0,.15);
  transition: opacity .25s, background .25s;
}
.mb-player.is-playing .mb-player__center { opacity: 0; pointer-events: none; }
.mb-player__center-btn {
  width: 76px; height: 76px;
  border-radius: 50%;
  background: var(--mb-accent);
  color: #fff;
  display: flex; align-items: center; justify-content: center;
  font-size: 34px;
  box-shadow: 0 8px 30px rgba(0,0,0,.45);
  transition: transform .2s, background .2s;
}
.mb-player__center:hover .mb-player__center-btn { transform: scale(1.08); background: var(--mb-accent-light); }
.mb-player--audio .mb-player__center { display: none; }
.mb-player__center-btn i { margin-right: -3px; }

/* ════ نوار کنترل ════ */
.mb-player__controls {
  position: absolute; left: 0; right: 0; bottom: 0;
  z-index: 5;
  padding: 28px 12px 8px;
  background: linear-gradient(to top, rgba(0,0,0,.82) 0%, rgba(0,0,0,.45) 55%, transparent 100%);
  transition: opacity .25s, transform .25s;
}
.mb-player--video.is-hidden-ui .mb-player__controls { opacity: 0; transform: translateY(8px); pointer-events: none; }
.mb-player--video.is-hidden-ui { cursor: none; }

/* ════ نوار پیشرفت ════ */
.mb-player__progress {
  position: relative;
  padding: 8px 0;
  cursor: pointer;
}
.mb-player__track {
  position: relative;
  height: 5px;
  background: rgba(255,255,255,.28);
  border-radius: 4px;
  transition: height .12s;
}
.mb-player__progress:hover .mb-player__track { height: 8px; }
.mb-player__buffered {
  position: absolute; top: 0; right: 0; height: 100%;
  background: rgba(255,255,255,.32);
  border-radius: 4px;
  width: 0;
}
.mb-player__played {
  position: absolute; top: 0; right: 0; height: 100%;
  background: var(--mb-accent);
  border-radius: 4px;
  width: 0;
}
.mb-player__scrubber {
  position: absolute; top: 50%;
  width: 14px; height: 14px;
  margin-right: -7px;
  background: #fff;
  border: 3px solid var(--mb-accent);
  border-radius: 50%;
  transform: translateY(-50%) scale(0);
  transition: transform .12s;
  right: 0;
  box-shadow: 0 1px 4px rgba(0,0,0,.4);
}
.mb-player__progress:hover .mb-player__scrubber { transform: translateY(-50%) scale(1); }

/* ── نقاط فصل (نقطه‌زنی) ── */
.mb-player__ticks { position: absolute; inset: 0; pointer-events: none; }
.mb-player__tick {
  position: absolute; top: 50%;
  width: 3px; height: 12px;
  margin-right: -1.5px;
  background: rgba(255,255,255,.9);
  transform: translateY(-50%);
  border-radius: 2px;
}

/* ── تولتیپ هاور (عنوان فصل + زمان) ── */
.mb-player__tooltip {
  position: absolute; bottom: 26px;
  transform: translateX(50%);
  background: rgba(20,20,24,.96);
  color: #fff;
  padding: 6px 10px;
  border-radius: 8px;
  font-size: 12px;
  white-space: nowrap;
  pointer-events: none;
  opacity: 0;
  transition: opacity .12s;
  box-shadow: 0 4px 16px rgba(0,0,0,.5);
  max-width: 240px; overflow: hidden; text-overflow: ellipsis;
  z-index: 6;
}
.mb-player__tooltip.show { opacity: 1; }
.mb-player__tooltip b { color: var(--mb-accent-light); font-weight: 700; }
.mb-player__tooltip .mb-tt-time { color: rgba(255,255,255,.7); margin-right: 6px; }

/* ════ ردیف دکمه‌ها ════ */
.mb-player__bar {
  display: flex; align-items: center; gap: 4px;
  margin-top: 2px;
}
.mb-player--audio .mb-player__bar { gap: 6px; }
.mb-btn {
  background: none; border: none; cursor: pointer;
  color: #fff;
  width: 38px; height: 38px;
  display: flex; align-items: center; justify-content: center;
  font-size: 18px;
  border-radius: 50%;
  transition: background .15s, color .15s;
  flex-shrink: 0;
  padding: 0;
}
.mb-btn:hover { background: rgba(255,255,255,.16); }
.mb-btn.is-active { color: var(--mb-accent-light); }
.mb-player--audio .mb-btn { color: #f3f3f5; }

.mb-player__time {
  font-size: 13px;
  color: rgba(255,255,255,.92);
  white-space: nowrap;
  letter-spacing: .3px;
  font-variant-numeric: tabular-nums;
  margin: 0 4px;
  direction: ltr;
}
.mb-player__time .sep { opacity: .55; margin: 0 3px; }

.mb-player__now {
  font-size: 12.5px;
  color: rgba(255,255,255,.78);
  white-space: nowrap;
  overflow: hidden; text-overflow: ellipsis;
  max-width: 38%;
  display: flex; align-items: center; gap: 5px;
}
.mb-player__now i { color: var(--mb-accent-light); font-size: 13px; }
.mb-player__spacer { flex: 1; }

/* ── کنترل صدا ── */
.mb-player__volume { display: flex; align-items: center; }
.mb-player__volume-slider {
  width: 0; opacity: 0;
  transition: width .2s, opacity .2s;
  overflow: hidden;
  height: 4px;
  -webkit-appearance: none; appearance: none;
  background: rgba(255,255,255,.3);
  border-radius: 4px;
  cursor: pointer;
  direction: ltr;
}
.mb-player__volume:hover .mb-player__volume-slider,
.mb-player__volume-slider:focus { width: 70px; opacity: 1; margin: 0 4px; }
.mb-player__volume-slider::-webkit-slider-thumb {
  -webkit-appearance: none; appearance: none;
  width: 12px; height: 12px; border-radius: 50%;
  background: #fff; cursor: pointer;
}
.mb-player__volume-slider::-moz-range-thumb {
  width: 12px; height: 12px; border: none; border-radius: 50%;
  background: #fff; cursor: pointer;
}

/* ════ منوی سرعت ════ */
.mb-player__menu {
  position: absolute; bottom: 56px; left: 12px;
  background: rgba(20,20,24,.97);
  border-radius: 10px;
  padding: 6px;
  display: none;
  flex-direction: column;
  min-width: 96px;
  box-shadow: 0 8px 28px rgba(0,0,0,.55);
  z-index: 7;
}
.mb-player__menu.show { display: flex; }
.mb-player__menu button {
  background: none; border: none; color: #fff;
  padding: 8px 12px; text-align: right;
  font-size: 13px; cursor: pointer; border-radius: 6px;
  font-family: inherit; direction: ltr;
}
.mb-player__menu button:hover { background: rgba(255,255,255,.12); }
.mb-player__menu button.is-active { color: var(--mb-accent-light); font-weight: 700; }
.mb-player--audio .mb-player__menu { bottom: 52px; left: 8px; }

/* ════ پنل فهرست فصل‌ها ════ */
.mb-player__chapters-panel {
  position: absolute; top: 0; bottom: 0; left: 0;
  width: 290px; max-width: 80%;
  background: rgba(15,15,18,.96);
  backdrop-filter: blur(8px);
  z-index: 8;
  transform: translateX(-100%);
  transition: transform .28s ease;
  display: flex; flex-direction: column;
  overflow: hidden;
}
.mb-player__chapters-panel.show { transform: translateX(0); }
.mb-player__chapters-head {
  display: flex; align-items: center; justify-content: space-between;
  padding: 14px 16px;
  border-bottom: 1px solid rgba(255,255,255,.1);
  font-size: 14px; font-weight: 700;
  flex-shrink: 0;
}
.mb-player__chapters-list { overflow-y: auto; padding: 6px; }
.mb-chapter-item {
  display: flex; align-items: center; gap: 10px;
  padding: 10px 12px; border-radius: 8px;
  cursor: pointer; transition: background .15s;
  text-align: right; width: 100%;
  background: none; border: none; color: #fff; font-family: inherit;
}
.mb-chapter-item:hover { background: rgba(255,255,255,.1); }
.mb-chapter-item.is-active { background: rgba(232,97,77,.22); }
.mb-chapter-item.is-active .mb-chapter-title { color: var(--mb-accent-light); font-weight: 700; }
.mb-chapter-time {
  font-size: 11.5px; color: rgba(255,255,255,.6);
  font-variant-numeric: tabular-nums; direction: ltr;
  background: rgba(255,255,255,.1); padding: 2px 7px; border-radius: 6px;
  flex-shrink: 0;
}
.mb-chapter-title { font-size: 13px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* ── حالت صوت: پنل فصل‌ها به‌صورت زیرین ── */
.mb-player--audio .mb-player__chapters-panel {
  position: static; transform: none; width: 100%; max-width: 100%;
  background: rgba(0,0,0,.18); border-radius: 10px;
  margin-top: 12px; max-height: 220px;
  display: none;
}
.mb-player--audio .mb-player__chapters-panel.show { display: flex; }
.mb-player--audio .mb-player__center,
.mb-player--audio .mb-player__loading { }

/* ════ ریسپانسیو ════ */
@media (max-width: 480px) {
  .mb-player__now { display: none; }
  .mb-btn { width: 34px; height: 34px; font-size: 16px; }
  .mb-player__time { font-size: 12px; }
  .mb-player__center-btn { width: 62px; height: 62px; font-size: 28px; }
}


/* ════════════════════════════════════════════════════════════════
   پلی‌لیست محبوب — پادکست چندقسمتی و ویدیوی چندقسمتی
   ════════════════════════════════════════════════════════════════ */

.mb-stage {
  display: grid;
  gap: 16px;
  grid-template-columns: minmax(0, 1fr) 340px;
  align-items: start;
  direction: rtl;
}
.mb-stage--single { grid-template-columns: minmax(0, 1fr); }
.mb-stage__main { min-width: 0; }
@media (max-width: 991px) {
  .mb-stage { grid-template-columns: minmax(0, 1fr); }
}

/* ── کارت «در حال پخش» (حالت صوت) ── */
.mb-np {
  background: var(--bg-primary, #fff);
  border: 1px solid var(--border-color, #eee);
  border-radius: var(--radius-lg, 20px);
  overflow: hidden;
  box-shadow: var(--shadow-md, 0 4px 12px rgba(0,0,0,.08));
}
.mb-np__top {
  display: flex; align-items: center; gap: 14px;
  padding: 16px;
}
.mb-np__cover {
  width: 104px; height: 104px; flex-shrink: 0;
  border-radius: 16px; overflow: hidden;
  background: var(--bg-secondary, #f4f4f6);
  position: relative;
  box-shadow: 0 8px 22px rgba(0,0,0,.14);
}
.mb-np__cover img { width: 100%; height: 100%; object-fit: cover; display: block; }
.mb-np__cover-fallback {
  width: 100%; height: 100%;
  display: flex; align-items: center; justify-content: center;
  color: rgba(255,255,255,.45); font-size: 34px;
}
.mb-np__body { min-width: 0; flex: 1; }
.mb-np__kicker {
  font-size: 11.5px; font-weight: 700; color: var(--melon, #E8614D);
  display: flex; align-items: center; gap: 5px; margin-bottom: 6px;
}
.mb-np__title {
  font-size: 16px; font-weight: 800; color: var(--text-primary, #111);
  line-height: 1.7; margin: 0 0 4px;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.mb-np__sub { font-size: 12.5px; color: var(--text-muted, #9CA3AF); display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.mb-np__player { padding: 0 12px 12px; }
.mb-np__player .mb-player { border-radius: var(--radius-md, 12px); }

@media (max-width: 480px) {
  .mb-np__top { padding: 14px; gap: 12px; }
  .mb-np__cover { width: 78px; height: 78px; border-radius: 13px; }
  .mb-np__title { font-size: 14.5px; }
}

/* ── نوار عنوان زیر پلیر ویدیو ── */
.mb-vhead {
  background: var(--bg-primary, #fff);
  border: 1px solid var(--border-color, #eee);
  border-radius: var(--radius-lg, 20px);
  padding: 14px 16px;
  margin-top: 12px;
}
.mb-vhead .mb-np__title { font-size: 17px; }

/* ── جعبهٔ پلی‌لیست ── */
.mb-pl {
  background: var(--bg-primary, #fff);
  border: 1px solid var(--border-color, #eee);
  border-radius: var(--radius-lg, 20px);
  overflow: hidden;
  display: flex; flex-direction: column;
  max-height: 620px;
}
@media (max-width: 991px) { .mb-pl { max-height: 460px; } }

.mb-pl__head {
  padding: 13px 14px;
  border-bottom: 1px solid var(--border-color, #eee);
  background: var(--bg-secondary, #f8f8fa);
  flex-shrink: 0;
}
.mb-pl__title-row { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.mb-pl__title {
  font-size: 14px; font-weight: 800; color: var(--text-primary, #111);
  display: flex; align-items: center; gap: 7px; margin: 0;
  min-width: 0;
}
.mb-pl__title i { color: var(--melon, #E8614D); }
.mb-pl__title span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mb-pl__count {
  font-size: 11.5px; font-weight: 800;
  background: var(--melon-bg, #FFF0EE); color: var(--melon-dark, #C94535);
  padding: 3px 9px; border-radius: 11px; flex-shrink: 0;
}
.mb-pl__tools { display: flex; align-items: center; gap: 6px; margin-top: 10px; }
.mb-pl__search {
  flex: 1; min-width: 0;
  display: flex; align-items: center; gap: 6px;
  background: var(--bg-primary, #fff);
  border: 1px solid var(--border-color, #eee);
  border-radius: 10px; padding: 6px 10px;
}
.mb-pl__search i { font-size: 12px; color: var(--text-muted, #9CA3AF); }
.mb-pl__search input {
  border: none; outline: none; background: none;
  font-family: inherit; font-size: 12.5px; width: 100%;
  color: var(--text-primary, #111);
}
.mb-pl__tool {
  width: 32px; height: 32px; flex-shrink: 0;
  border-radius: 9px;
  border: 1px solid var(--border-color, #eee);
  background-color: var(--bg-primary, #fff);
  color: var(--text-muted, #9CA3AF);
  cursor: pointer; font-size: 14px;
  display: flex; align-items: center; justify-content: center;
  position: relative;
}
.mb-pl__tool:hover { color: var(--melon, #E8614D); border-color: var(--melon-light, #F28C7D); }
.mb-pl__tool.is-active { background-color: var(--melon-bg, #FFF0EE); color: var(--melon-dark, #C94535); border-color: var(--melon-light, #F28C7D); }
.mb-pl__tool .mb-pl__badge-one {
  position: absolute; bottom: 1px; left: 3px;
  font-size: 8px; font-weight: 900; line-height: 1;
}

/* ── آیتم‌های پلی‌لیست ── */
.mb-pl__items {
  overflow-y: auto; overflow-x: hidden;
  padding: 6px;
  display: flex; flex-direction: column; gap: 3px;
  scrollbar-width: thin;
}
.mb-pl-item {
  display: flex; align-items: center; gap: 10px;
  padding: 8px; border-radius: 12px;
  text-decoration: none; color: inherit;
  cursor: pointer;
  border: none; background-color: transparent; font-family: inherit; text-align: right;
  width: 100%;
}
.mb-pl-item:hover { background-color: var(--bg-secondary, #f6f6f8); }
.mb-pl-item.is-active { background-color: var(--melon-bg, #FFF0EE); box-shadow: inset 0 0 0 1.5px var(--melon-light, #F28C7D); }
.mb-pl-item.is-locked { opacity: .72; }
.mb-pl-item.is-hidden { display: none; }

.mb-pl-item__num {
  width: 22px; flex-shrink: 0;
  font-size: 12px; font-weight: 800;
  color: var(--text-muted, #9CA3AF);
  text-align: center;
  font-variant-numeric: tabular-nums;
}
.mb-pl-item.is-active .mb-pl-item__num { color: var(--melon, #E8614D); }

.mb-pl-item__thumb {
  width: 52px; height: 52px; flex-shrink: 0;
  border-radius: 10px; overflow: hidden;
  position: relative;
  background: var(--bg-secondary, #f4f4f6);
}
.mb-pl-item__thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.mb-pl-item__thumb-fallback {
  width: 100%; height: 100%;
  display: flex; align-items: center; justify-content: center;
  color: rgba(255,255,255,.55); font-size: 18px;
}
.mb-pl-item__thumb-time {
  position: absolute; bottom: 2px; left: 2px;
  background: rgba(0,0,0,.72); color: #fff;
  font-size: 9.5px; padding: 1px 4px; border-radius: 4px;
  direction: ltr; font-variant-numeric: tabular-nums;
}
.mb-pl--video .mb-pl-item__thumb { width: 76px; height: 44px; border-radius: 8px; }

.mb-pl-item__body { flex: 1; min-width: 0; }
.mb-pl-item__title {
  font-size: 13px; font-weight: 600; line-height: 1.6;
  color: var(--text-primary, #111);
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.mb-pl-item.is-active .mb-pl-item__title { color: var(--melon-dark, #C94535); font-weight: 800; }
.mb-pl-item__meta {
  font-size: 11px; color: var(--text-muted, #9CA3AF);
  margin-top: 3px;
  display: flex; align-items: center; gap: 6px; flex-wrap: wrap;
}
.mb-pl-item__meta .mb-tag {
  padding: 1px 7px; border-radius: 8px; font-size: 10px; font-weight: 700;
  background: var(--bg-secondary, #f1f1f4); color: var(--text-secondary, #555);
}
.mb-pl-item__meta .mb-tag.free { background: #ECFDF5; color: #059669; }
.mb-pl-item__meta .mb-tag.paid { background: #FEF2F2; color: #DC2626; }
.mb-pl-item__meta .mb-tag.premium { background: #F5F3FF; color: #7C3AED; }
/* برچسب نوع رسانه در پلی‌لیست ترکیبی (صوت + ویدیو) */
.mb-pl-item__meta .mb-tag.audio { background: #FFF7ED; color: #C2410C; }
.mb-pl-item__meta .mb-tag.video { background: #EEF2FF; color: #4338CA; }

/* قسمت صوتی داخل قاب ویدیو: کاور به‌جای تصویر ویدیو دیده می‌شود */
.mb-stage__video { position: relative; }
.mb-stage.is-audio-track .mb-player__media { object-fit: cover; }
.mb-audio-chip {
  display: none;
  position: absolute; top: 12px; right: 12px; z-index: 6;
  align-items: center; gap: 6px;
  padding: 5px 12px; border-radius: 20px;
  background: rgba(0,0,0,.6); color: #fff;
  font-size: 11.5px; font-weight: 700;
  backdrop-filter: blur(6px);
  pointer-events: none;
}
.mb-stage.is-audio-track .mb-audio-chip { display: inline-flex; }

.mb-pl-item__state {
  width: 24px; flex-shrink: 0;
  display: flex; align-items: center; justify-content: center;
  color: var(--text-muted, #9CA3AF); font-size: 13px;
}
.mb-pl-item.is-active .mb-pl-item__state { color: var(--melon, #E8614D); }

/* اکولایزر آیتم فعال */
.mb-eq { display: none; align-items: flex-end; gap: 2px; height: 14px; }
.mb-pl-item.is-active .mb-eq { display: flex; }
.mb-pl-item.is-active .mb-pl-item__state > i { display: none; }
.mb-eq span {
  width: 3px; border-radius: 2px;
  background: var(--melon, #E8614D);
  height: 5px;
  animation: mb-eq-bounce .9s ease-in-out infinite;
  animation-play-state: paused;
}
.mb-eq span:nth-child(2) { animation-delay: .18s; }
.mb-eq span:nth-child(3) { animation-delay: .36s; }
.mb-stage.is-playing .mb-eq span { animation-play-state: running; }
@keyframes mb-eq-bounce {
  0%, 100% { height: 4px; }
  50%      { height: 14px; }
}

.mb-pl__empty {
  padding: 24px 16px; text-align: center;
  font-size: 12.5px; color: var(--text-muted, #9CA3AF);
  display: none;
}
.mb-pl__empty.show { display: block; }

/* نوار پیشرفت کوچک زیر آیتم فعال */
.mb-pl-item__bar {
  position: absolute; right: 0; bottom: 0; height: 3px;
  background: var(--melon, #E8614D);
  width: 0;
  border-radius: 2px;
}
.mb-pl-item { position: relative; }

/* زمان کنار عنوان — فقط در لیست تمام‌عرض دیده می‌شود
   (در ستون کناری روی کاور نمایش داده می‌شود و تکراری است) */
.mb-pl-item__time { display: none; }
.mb-plb .mb-pl-item__time { display: inline-flex; align-items: center; gap: 4px; }


/* ════════════════════════════════════════════════════════════════
   لیست کامل قسمت‌ها — تمام‌عرض، زیر پلیر
   ════════════════════════════════════════════════════════════════ */

.mb-plb {
  grid-column: 1 / -1;          /* در گرید .mb-stage هر دو ستون را می‌گیرد */
  background: var(--bg-primary, #fff);
  border: 1px solid var(--border-color, #eee);
  border-radius: var(--radius-lg, 20px);
  overflow: hidden;
  direction: rtl;
}

.mb-plb__head {
  display: flex; align-items: center; justify-content: space-between;
  gap: 10px; flex-wrap: wrap;
  padding: 14px 18px;
  background: var(--bg-secondary, #f8f8fa);
  border-bottom: 1px solid var(--border-color, #eee);
}
.mb-plb__title {
  font-size: 15px; font-weight: 800; color: var(--text-primary, #111);
  display: flex; align-items: center; gap: 8px; margin: 0; min-width: 0;
}
.mb-plb__title i { color: var(--melon, #E8614D); }
.mb-plb__title span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mb-plb__meta { display: flex; align-items: center; gap: 7px; flex-wrap: wrap; }
.mb-plb__chip {
  font-size: 11.5px; font-weight: 700;
  background: var(--melon-bg, #FFF0EE); color: var(--melon-dark, #C94535);
  padding: 4px 10px; border-radius: 11px;
  display: inline-flex; align-items: center; gap: 5px;
}

.mb-plb__body { padding: 8px; }
.mb-plb__group + .mb-plb__group { margin-top: 6px; }
.mb-plb__group-head {
  display: flex; align-items: center; justify-content: space-between; gap: 8px;
  padding: 10px 10px 8px;
  margin-top: 4px;
  border-bottom: 1px dashed var(--border-color, #eee);
}
.mb-plb__group-title {
  font-size: 13px; font-weight: 800; color: var(--text-primary, #111);
  display: flex; align-items: center; gap: 6px; min-width: 0;
}
.mb-plb__group-title i { color: var(--melon, #E8614D); font-size: 12px; }
.mb-plb__group-count { font-size: 11px; color: var(--text-muted, #9CA3AF); flex-shrink: 0; }
.mb-plb__group.is-hidden { display: none; }

/* قسمت‌ها دقیقاً زیر هم — یک ردیف کامل برای هر قسمت */
.mb-plb__items { display: flex; flex-direction: column; }
.mb-plb .mb-pl-item {
  gap: 12px;
  padding: 11px 10px;
  border-radius: 14px;
}
.mb-plb .mb-pl-item + .mb-pl-item { border-top: 1px solid var(--border-color, #f0f0f2); }
.mb-plb .mb-pl-item__num { width: 30px; font-size: 13px; }
.mb-plb .mb-pl-item__thumb { width: 60px; height: 60px; border-radius: 12px; }
.mb-plb--video .mb-pl-item__thumb { width: 104px; height: 60px; border-radius: 10px; }
.mb-plb .mb-pl-item__thumb-time { display: none; }   /* زمان در متادیتا نشان داده می‌شود */
.mb-plb .mb-pl-item__title { font-size: 14px; -webkit-line-clamp: 1; }
.mb-plb .mb-pl-item__meta { font-size: 11.5px; margin-top: 5px; }
.mb-plb .mb-pl-item__state { width: 34px; font-size: 15px; }
.mb-plb .mb-pl-item.is-active { box-shadow: inset 0 0 0 1.5px var(--melon-light, #F28C7D); }

@media (max-width: 575px) {
  .mb-plb__head { padding: 12px 14px; }
  .mb-plb__body { padding: 6px; }
  .mb-plb .mb-pl-item { gap: 9px; padding: 9px 6px; }
  .mb-plb .mb-pl-item__num { width: 22px; font-size: 12px; }
  .mb-plb .mb-pl-item__thumb { width: 48px; height: 48px; border-radius: 10px; }
  .mb-plb--video .mb-pl-item__thumb { width: 78px; height: 46px; }
  .mb-plb .mb-pl-item__title { font-size: 13px; }
  .mb-plb .mb-pl-item__state { width: 24px; }
}

/* ستون کناری روی موبایل تکراری است — لیست تمام‌عرض کافی است */
@media (max-width: 991px) {
  .mb-pl--aside { display: none; }
}


/* ════════════════════════════════════════════════════════════════
   کنترل‌های مشترک — پلیر «درس» و نوار پخش پایین صفحه
   ════════════════════════════════════════════════════════════════ */

.lp-ctl {
  width: 34px; height: 34px; flex-shrink: 0;
  display: flex; align-items: center; justify-content: center;
  border: none; border-radius: 50%; background: transparent;
  font-family: inherit; font-size: 15px; cursor: pointer; padding: 0;
  transition: background .18s, color .18s, filter .18s;
}
.lp-ctl:disabled { opacity: .35; cursor: default; }

/* دکمهٔ «۱۰ ثانیه جلو/عقب» — عدد روی آیکون چرخشی */
.lp-ctl--seek { position: relative; }
.lp-ctl--seek b {
  position: absolute; top: 50%; left: 50%;
  transform: translate(-50%, -40%);
  font-size: 7.5px; font-weight: 700; pointer-events: none;
}

/* قرص سرعت پخش */
.lp-ctl--pill {
  width: auto; min-width: 46px; height: 28px; padding: 0 11px;
  border: 1px solid var(--border-color, #E5E7EB); border-radius: 999px;
  font-size: 11px; font-weight: 700; direction: ltr;
  color: var(--text-secondary, #6B7280);
}

/* نوار پیشرفت ساده (نوار پایین صفحه) */
.lp-bar-wrap { position: relative; padding: 7px 0; cursor: pointer; }
.lp-track {
  position: relative; height: 4px; border-radius: 4px; direction: ltr;
  background: var(--border-color, #E5E7EB);
}
.lp-track__played {
  position: absolute; top: 0; left: 0; height: 100%; width: 0;
  background: var(--melon, #E8614D); border-radius: 4px;
}
.lp-track__ticks { position: absolute; inset: 0; pointer-events: none; }
.lp-track__tick {
  position: absolute; top: 50%; width: 6px; height: 6px; margin-left: -3px;
  transform: translateY(-50%);
  background: var(--melon-dark, #C94535); border-radius: 50%;
}
.lp-track__dot {
  position: absolute; top: 50%; left: 0;
  width: 11px; height: 11px; margin-left: -5.5px;
  background: #fff; border: 2px solid var(--melon, #E8614D); border-radius: 50%;
  transform: translateY(-50%) scale(0); transition: transform .12s;
}
.lp-bar-wrap:hover .lp-track__dot { transform: translateY(-50%) scale(1); }

.lp-time {
  flex-shrink: 0; font-size: 11px; direction: ltr;
  color: var(--text-muted, #9CA3AF); font-variant-numeric: tabular-nums;
}
.lp-vol {
  width: 110px; height: 4px; cursor: pointer; direction: ltr;
  accent-color: var(--melon, #E8614D);
}


/* ════════════════════════════════════════════════════════════════
   اسکین «درس» — تصویر بالا، کنترل‌ها زیر آن روی زمینهٔ روشن
   با data-mb-skin="lesson" روی ریشهٔ پلیر فعال می‌شود.
   ════════════════════════════════════════════════════════════════ */

.mb-player.mb-skin-lesson {
  --sk-fg: var(--text-secondary, #6B7280);
  --sk-hover: var(--bg-secondary, #F5F5F5);
  --sk-rail: var(--border-color, #E5E7EB);
  background: transparent;
  color: var(--text-primary, #1A1A2E);
  border-radius: 0; overflow: visible; aspect-ratio: auto;
  /* پدینگ حالت صوت در این اسکین لازم نیست — قاب خودش کادر دارد. */
  padding: 0;
}

/* قاب تصویر/کاور */
.mb-skin__screen {
  position: relative; aspect-ratio: 16 / 9;
  background: #0b0b0d; border-radius: 14px; overflow: hidden;
}
.mb-skin__screen .mb-player__media {
  width: 100%; height: 100%; display: block; object-fit: contain; background: #000;
}
.mb-skin__screen--audio .mb-player__media {
  position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none;
}
.mb-skin__art { position: absolute; inset: 0; }
.mb-skin__art img { width: 100%; height: 100%; object-fit: cover; display: block; }
.mb-skin__art-fallback {
  width: 100%; height: 100%;
  display: flex; align-items: center; justify-content: center;
  color: rgba(255, 255, 255, .5); font-size: 54px;
}

/* دکمهٔ پخش وسط تصویر — حلقهٔ سفید */
.mb-skin-lesson .mb-player__center { background: rgba(0, 0, 0, .12); }
.mb-skin-lesson .mb-player__center-btn {
  width: 76px; height: 76px;
  background: rgba(255, 255, 255, .14);
  border: 2px solid rgba(255, 255, 255, .92);
  color: #fff; font-size: 30px; box-shadow: none;
  backdrop-filter: blur(3px);
}
.mb-skin-lesson .mb-player__center:hover .mb-player__center-btn {
  background: rgba(255, 255, 255, .28); transform: scale(1.05);
}

/* تمام‌صفحه — گوشهٔ بالای تصویر */
.mb-skin__fs {
  position: absolute; top: 10px; right: 10px; z-index: 6;
  width: 30px; height: 30px; border: none; border-radius: 9px;
  display: flex; align-items: center; justify-content: center;
  background: rgba(0, 0, 0, .35); color: #fff; font-size: 13px;
  cursor: pointer; padding: 0; transition: background .2s;
}
.mb-skin__fs:hover { background: rgba(0, 0, 0, .58); }

/* نوار کنترل — زیر تصویر، بدون پس‌زمینهٔ تیره و بدون پنهان‌شدن خودکار */
.mb-skin-lesson .mb-player__controls {
  position: static; background: none;
  padding: 10px 4px 2px;
  opacity: 1 !important; transform: none !important; pointer-events: auto !important;
}
.mb-skin-lesson.is-hidden-ui { cursor: auto; }

.mb-skin__timeline { display: flex; align-items: center; gap: 12px; direction: ltr; }
.mb-skin-lesson .mb-player__progress { flex: 1; min-width: 0; padding: 7px 0; }
.mb-skin-lesson .mb-player__track { height: 4px; background: var(--sk-rail); }
.mb-skin-lesson .mb-player__progress:hover .mb-player__track { height: 6px; }
.mb-skin-lesson .mb-player__played { right: auto; left: 0; background: var(--mb-accent); }
.mb-skin-lesson .mb-player__buffered { right: auto; left: 0; background: rgba(0, 0, 0, .07); }
.mb-skin-lesson .mb-player__scrubber {
  right: auto; left: 0; margin-right: 0; margin-left: -7px; box-shadow: none;
}
.mb-skin-lesson .mb-player__tick {
  right: auto; margin-right: 0; margin-left: -3px;
  width: 6px; height: 6px; border-radius: 50%;
  background: var(--melon-dark, #C94535);
}
.mb-skin-lesson .mb-player__time {
  margin: 0; font-size: 11px; color: var(--sk-fg);
}
.mb-skin-lesson .mb-player__tooltip { bottom: 22px; }

.mb-skin-lesson .mb-player__bar {
  display: flex; align-items: center; gap: 6px;
  margin-top: 2px; padding-bottom: 4px; direction: ltr;
}
.mb-skin-lesson .mb-btn {
  width: 34px; height: 34px; font-size: 15px; color: var(--sk-fg);
}
.mb-skin-lesson .mb-btn:hover { background: var(--sk-hover); color: var(--mb-accent); }
.mb-skin-lesson .mb-play {
  width: 44px; height: 44px; font-size: 18px; color: #fff;
  background: var(--melon-gradient, #E8614D);
  box-shadow: 0 6px 16px rgba(232, 97, 77, .34);
}
.mb-skin-lesson .mb-play:hover { color: #fff; filter: brightness(1.06); }
.mb-skin-lesson .mb-speed.lp-ctl--pill { background: transparent; }
.mb-skin-lesson .mb-speed.lp-ctl--pill:hover { background: var(--sk-hover); }
.mb-skin-lesson .mb-player__menu { bottom: 54px; left: 6px; }

/* در این صفحه فهرست فصل‌ها ستون اختصاصی خودش را دارد */
.mb-skin-lesson .mb-player__chapters-panel { display: none !important; }

/* تمام‌صفحه — همان کنترل‌ها روی زمینهٔ مشکی */
.mb-skin-lesson:fullscreen {
  --sk-fg: rgba(255, 255, 255, .82);
  --sk-hover: rgba(255, 255, 255, .16);
  --sk-rail: rgba(255, 255, 255, .3);
  display: flex; flex-direction: column; background: #000;
}
.mb-skin-lesson:fullscreen .mb-skin__screen {
  flex: 1; min-height: 0; aspect-ratio: auto; border-radius: 0;
}
.mb-skin-lesson:fullscreen .mb-player__controls { padding: 10px 20px 18px; }
.mb-skin-lesson:fullscreen .mb-player__buffered { background: rgba(255, 255, 255, .22); }
.mb-skin-lesson:fullscreen .lp-ctl--pill { border-color: rgba(255, 255, 255, .3); color: rgba(255, 255, 255, .82); }

@media (max-width: 575px) {
  .mb-skin-lesson .mb-btn { width: 30px; height: 30px; font-size: 14px; }
  .mb-skin-lesson .mb-play { width: 40px; height: 40px; font-size: 16px; }
  .mb-skin-lesson .mb-player__bar { gap: 2px; }
  .mb-skin-lesson .mb-player__center-btn { width: 60px; height: 60px; font-size: 24px; }
}


/* ════════════════════════════════════════════════════════════════
   پلیر «صوت محبوب» — کارت تمام‌عرض + اسکین podcast
   (data-mb-skin="podcast"؛ پایهٔ ظاهری‌اش همان اسکین «درس» است)
   ════════════════════════════════════════════════════════════════ */

.pp-stage { display: flex; flex-direction: column; gap: 16px; direction: rtl; }

.pp-card {
  background: var(--bg-primary, #fff);
  border: 1px solid var(--border-color, #eee);
  border-radius: var(--radius-lg, 20px);
  box-shadow: var(--shadow-md, 0 4px 12px rgba(0,0,0,.08));
  padding: 18px 18px 12px;
}
.pp-card__top { display: flex; align-items: center; gap: 18px; margin-bottom: 6px; }
.pp-card__cover {
  width: 132px; height: 132px; flex-shrink: 0;
  border-radius: 18px; overflow: hidden; position: relative;
  background: var(--bg-secondary, #f4f4f6);
  box-shadow: 0 12px 28px rgba(0,0,0,.16);
}
.pp-card__cover img { width: 100%; height: 100%; object-fit: cover; display: block; }
.pp-card__cover .mb-np__cover-fallback { font-size: 42px; }
.pp-card__body { min-width: 0; flex: 1; }
.pp-card__kicker {
  font-size: 11.5px; font-weight: 700; color: var(--melon, #E8614D);
  display: flex; align-items: center; gap: 6px; margin-bottom: 6px;
}
.pp-card__kicker .mb-eq { display: flex; height: 12px; }
.pp-card__kicker .mb-eq span { background: var(--melon, #E8614D); animation-play-state: paused; }
.pp-stage.is-playing .pp-card__kicker .mb-eq span { animation-play-state: running; }
.pp-card__title {
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
  font-size: 18px; font-weight: 800; line-height: 1.7; margin: 0 0 4px;
  color: var(--text-primary, #111); text-decoration: none;
}
.pp-card__title:hover { color: var(--melon, #E8614D); }
.pp-card__sub {
  font-size: 12.5px; color: var(--text-muted, #9CA3AF);
  display: flex; align-items: center; gap: 12px; flex-wrap: wrap;
}
.pp-card__sub i { color: var(--melon, #E8614D); }

/* کنترل‌ها زیر کارت */
.mb-skin-podcast .mb-player__controls { padding: 6px 0 0; }
.mb-skin-podcast .mb-player__track { height: 5px; }
.mb-skin-podcast .mb-player__progress:hover .mb-player__track { height: 7px; }
.mb-skin-podcast .mb-player__time { min-width: 38px; text-align: center; font-size: 11.5px; font-variant-numeric: tabular-nums; }
.mb-skin-podcast .mb-player__scrubber { width: 14px; height: 14px; margin-left: -7px; }

.mb-skin-podcast .mb-pod__bar {
  display: grid; grid-template-columns: 1fr auto 1fr;
  align-items: center; gap: 8px; margin-top: 6px; padding-bottom: 2px;
}
.mb-pod__side { display: flex; align-items: center; gap: 4px; min-width: 0; }
.mb-pod__side--end { justify-content: flex-end; }
.mb-pod__center { display: flex; align-items: center; justify-content: center; gap: 6px; }

.mb-skin-podcast .mb-btn { width: 38px; height: 38px; font-size: 17px; }
.mb-skin-podcast .mb-play {
  width: 56px; height: 56px; font-size: 24px; margin: 0 6px;
  box-shadow: 0 10px 24px rgba(232, 97, 77, .36);
}
.mb-skin-podcast .mb-prev, .mb-skin-podcast .mb-next { font-size: 20px; }
.mb-skin-podcast .lp-ctl--seek { position: relative; }
.mb-skin-podcast .lp-ctl--seek i { font-size: 22px; }
.mb-skin-podcast .lp-ctl--seek b {
  position: absolute; inset: 0; display: flex; align-items: center; justify-content: center;
  font-size: 8.5px; font-weight: 800; line-height: 1; padding-top: 2px;
}

/* صدا: اسلایدر همیشه دیده می‌شود (در پلیر تیره فقط با هاور باز می‌شد) */
.mb-skin-podcast .mb-player__volume { display: flex; align-items: center; gap: 4px; direction: ltr; }
.mb-skin-podcast .mb-player__volume-slider,
.mb-skin-podcast .mb-player__volume:hover .mb-player__volume-slider {
  width: 78px; opacity: 1; margin: 0; height: 4px; overflow: visible;
  background: var(--sk-rail); cursor: pointer;
}
.mb-skin-podcast .mb-player__volume-slider::-webkit-slider-thumb {
  width: 13px; height: 13px; background: var(--melon, #E8614D);
  border: 2px solid var(--bg-primary, #fff); box-shadow: 0 1px 4px rgba(0,0,0,.25);
}
.mb-skin-podcast .mb-player__volume-slider::-moz-range-thumb {
  width: 11px; height: 11px; background: var(--melon, #E8614D);
  border: 2px solid var(--bg-primary, #fff); box-shadow: 0 1px 4px rgba(0,0,0,.25);
}
.mb-skin-podcast .mb-speed.lp-ctl--pill {
  width: auto; height: 30px; padding: 0 12px; border-radius: 15px;
  border: 1px solid var(--border-color, #E5E7EB); font-size: 12px; font-weight: 800;
  color: var(--sk-fg); background: transparent;
}
.mb-skin-podcast .mb-speed.is-active { border-color: var(--melon, #E8614D); color: var(--melon, #E8614D); }
.mb-skin-podcast .mb-chapters-btn.is-active { background: var(--melon-bg, #FFF0EE); color: var(--melon, #E8614D); }
.mb-skin-podcast .mb-player__menu {
  bottom: 50px; left: auto; right: 6px;
  background: var(--bg-primary, #fff); color: var(--text-primary, #111);
  border: 1px solid var(--border-color, #eee); box-shadow: 0 10px 28px rgba(0,0,0,.14);
}
.mb-skin-podcast .mb-player__menu button { color: var(--text-primary, #111); }
.mb-skin-podcast .mb-player__menu button:hover { background: var(--bg-secondary, #f5f5f5); }
.mb-skin-podcast .mb-player__menu button.is-active { color: var(--melon, #E8614D); }

/* عنوان موضوع جاری زیر کنترل‌ها */
.mb-pod__now { min-height: 0; text-align: center; }
.mb-skin-podcast .mb-player__now {
  display: inline-flex; align-items: center; gap: 6px; max-width: 100%;
  margin: 2px 0 4px; padding: 3px 10px; border-radius: 10px;
  background: var(--melon-bg, #FFF0EE); color: var(--melon-dark, #C94535);
  font-size: 11.5px; font-weight: 700; direction: rtl;
}
.mb-skin-podcast .mb-now-title { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mb-skin-podcast .mb-player__now:has(.mb-now-title:empty) { display: none; }

/* فهرست موضوعات: زیر کنترل‌ها باز می‌شود، نه به‌صورت پنل کشویی روی پلیر */
.mb-skin-podcast .mb-player__chapters-panel {
  display: none !important;
  position: static; width: auto; max-width: none; transform: none;
  margin-top: 10px; padding: 0;
  background: var(--bg-secondary, #F8F8FA); color: var(--text-primary, #111);
  border: 1px solid var(--border-color, #eee); border-radius: 14px;
  backdrop-filter: none; overflow: hidden; direction: rtl;
}
.mb-skin-podcast .mb-player__chapters-panel.show { display: block !important; }
.mb-skin-podcast .mb-player__chapters-head {
  display: flex; align-items: center; justify-content: space-between;
  padding: 10px 14px; border-bottom: 1px solid var(--border-color, #eee);
  font-size: 13px; font-weight: 800; color: var(--text-primary, #111);
}
.mb-skin-podcast .mb-player__chapters-head i { color: var(--melon, #E8614D); }
.mb-skin-podcast .mb-ch-close { width: 28px; height: 28px; font-size: 12px; }
.mb-skin-podcast .mb-player__chapters-list { max-height: 260px; overflow-y: auto; padding: 6px; }
.mb-skin-podcast .mb-chapter-item {
  display: flex; align-items: center; gap: 10px; width: 100%;
  padding: 9px 10px; border: 0; border-radius: 10px; background: none;
  color: var(--text-secondary, #6B7280); font-family: inherit; font-size: 13px;
  text-align: right; cursor: pointer; transition: background .15s, color .15s;
}
.mb-skin-podcast .mb-chapter-item:hover { background: var(--bg-primary, #fff); color: var(--text-primary, #111); }
.mb-skin-podcast .mb-chapter-item.is-active { background: var(--melon-bg, #FFF0EE); color: var(--melon-dark, #C94535); font-weight: 700; }
.mb-skin-podcast .mb-chapter-time {
  flex-shrink: 0; min-width: 44px; padding: 2px 7px; border-radius: 7px;
  background: var(--bg-primary, #fff); border: 1px solid var(--border-color, #eee);
  color: var(--text-secondary, #6B7280);
  font-size: 11px; font-weight: 700; direction: ltr; text-align: center;
}
.mb-skin-podcast .mb-chapter-item.is-active .mb-chapter-time { border-color: transparent; color: var(--melon, #E8614D); }

/* لیست قسمت‌ها زیر پلیر: تمام‌عرض */
.pp-stage .mb-plb { grid-column: auto; }

@media (max-width: 575px) {
  .pp-card { padding: 14px 12px 10px; }
  .pp-card__top { gap: 12px; }
  .pp-card__cover { width: 88px; height: 88px; border-radius: 14px; }
  .pp-card__title { font-size: 15px; }
  .mb-skin-podcast .mb-pod__bar { grid-template-columns: auto 1fr auto; gap: 4px; }
  .mb-skin-podcast .mb-player__volume-slider { display: none; }
  .mb-skin-podcast .mb-btn { width: 34px; height: 34px; font-size: 16px; }
  .mb-skin-podcast .mb-play { width: 50px; height: 50px; font-size: 22px; margin: 0 2px; }
  .mb-skin-podcast .lp-ctl--seek i { font-size: 20px; }
  .mb-pod__center { gap: 2px; }
}
