/* ============================================================
   منوی کشویی داشبورد ادمین در موبایل — کلاس translate-x-full
   جای دیگری در سایت استفاده نشده بود و Tailwind کامپایلش نکرده بود؛
   با transform (نه translate) و ترکیب تگ+کلاس بازنویسی شد تا مطمئن
   با اولویت بالاتر از هر قانون دیگری اعمال شود
   ============================================================ */
aside.translate-x-full { translate: none; transform: translateX(100%); }
aside.translate-x-0 { translate: none; transform: translateX(0); }
@media (min-width: 1024px) {
  aside.translate-x-full,
  aside.translate-x-0 { transform: none; }
}

/* ============================================================
   اصلاح چیدمان انتخاب صندلی در موبایل
   ============================================================ */

@media (max-width: 680px) {
  /* راهنما از کنار نقشه به زیر آن منتقل می‌شود تا نقشه تمام عرض را بگیرد */
  #seatmap-wrap {
    flex-direction: column;
    gap: 12px;
  }

  #seatmap-wrap .seatmap-legend {
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    gap: 8px 16px;
    padding-bottom: 0;
  }
}

/* نوار اسکرول باریک و کم‌رنگ برای نقشه صندلی */
#seatmap-wrap .seatmap-scroll {
  scrollbar-width: thin;
  scrollbar-color: rgba(139, 92, 246, 0.45) transparent;
}
#seatmap-wrap .seatmap-scroll::-webkit-scrollbar { height: 6px; }
#seatmap-wrap .seatmap-scroll::-webkit-scrollbar-track { background: transparent; }
#seatmap-wrap .seatmap-scroll::-webkit-scrollbar-thumb {
  background: rgba(139, 92, 246, 0.45);
  border-radius: 3px;
}

/* در موبایل کل نقشه کوچک می‌شود تا بدون اسکرول افقی در عرض جا شود */
@media (max-width: 680px) {
  #seatmap-wrap .seatmap-inner { gap: 12px !important; }
  #seatmap-wrap .seat-row { gap: 9px !important; }

  /* عرض میز باید دقیقاً برابر عرض ردیف صندلی (۵ صندلی + ۴ فاصله) باشد
     تا زیر صندلی‌های ۱ تا ۵ (و ۶ تا ۱۰) هم‌تراز شود و فضای خالی سمت راست نماند */
  #seatmap-wrap .seat-table {
    width: 236px !important;
    height: 72px !important;
    font-size: 0.7rem;
  }

  #seatmap-wrap button[aria-label^="Seat"] {
    width: 40px !important;
    height: 40px !important;
    font-size: 0.78rem !important;
  }

  /* میله «پرده» کوتاه‌تر */
  #seatmap-wrap .w-2 { height: 128px !important; }

  /* نام مهمان روی صندلی */
  #seatmap-wrap .seat-row span { max-width: 46px; }
}

/* ============================================================
   کارت فیلم — چیدمان دسکتاپ دست‌نخورده، فقط موبایل تغییر می‌کند
   ============================================================ */

/* دسکتاپ (پیش‌فرض): عکس کنار ژانر/عنوان/توضیحات، دقیقاً مثل قبل */
.movie-card-body {
  grid-template-areas:
    "poster genre"
    "poster title"
    "poster desc"
    "poster meta"
    "poster date";
}

/* موبایل: توضیحات از کنار عکس بیرون می‌آید و تمام‌عرض زیر آن می‌رود */
@media (max-width: 640px) {
  .movie-card-body {
    grid-template-areas:
      "poster genre"
      "poster title"
      "desc   desc"
      "meta   meta"
      "date   date";
  }
}

/* آیتم‌های سلکت زمینهٔ نیمه‌شفاف خود سلکت را ارث می‌برند و در پاپ‌آپ سفید
   مرورگر، متن سفید روی سفید گم می‌شود؛ یک زمینهٔ تیرهٔ مات لازم دارند */
select option { background-color: #171226; color: #fff; }