/* =========================
   MM Elementor Ajax Search
   Smooth + Clean UI
   Mobile overlay only
   ========================= */

/* فونت کلی + جلوگیری از تداخل المنتور */
.mmes-widget,
.mmes-results,
.mmes-widget *,
.mmes-results * {
  font-family: "yekanbakh", "YekanBakh", "Yekan-Bakh-FaNum", sans-serif !important;
  -webkit-font-smoothing: antialiased !important;
  -moz-osx-font-smoothing: grayscale !important;
}

/* ---------- Widget ---------- */
.mmes-widget {
  position: relative !important;
  display: inline-block !important;
}

.mmes-widget .mmes-icon-btn {
  background: transparent !important;
  border: 0 !important;
  padding: 0 !important;
  cursor: pointer !important;
  line-height: 0 !important;
  transition: transform 180ms ease, opacity 180ms ease !important;
  will-change: transform !important;
}

.mmes-widget .mmes-icon-btn:hover {
  transform: translateY(-1px) !important;
}

.mmes-widget .mmes-icon-btn:active {
  transform: translateY(0) scale(0.98) !important;
}

.mmes-widget .mmes-icon-btn img {
  display: block !important;
  width: 40px !important;
  height: 40px !important;
}

/* پاپ‌آپ (با کلاس is-open باز می‌شود)
   نکته: اگر در HTML style="display:none" داشته باشه، این خط خنثی‌اش می‌کنه */
.mmes-widget .mmes-pop {
  display: block !important;
  position: absolute !important;
  top: 100% !important;
  left: 50% !important;
  transform: translateX(-50%) translateY(6px) !important;
  margin-top: 10px !important;
  z-index: 999999 !important;
  width: 360px !important;
  max-width: 92vw !important;

  opacity: 0 !important;
  pointer-events: none !important;
  transition: opacity 220ms ease, transform 220ms ease !important;
}

.mmes-widget .mmes-pop.is-open {
  opacity: 1 !important;
  pointer-events: auto !important;
  transform: translateX(-50%) translateY(0) !important;
}

.mmes-widget .mmes-pop__inner {
  background: rgba(255,255,255,0.92) !important;
  border: 1px solid rgba(214,214,214,0.9) !important;
  border-radius: 14px !important;
  padding: 12px !important;

  backdrop-filter: blur(10px) !important;
  -webkit-backdrop-filter: blur(10px) !important;

  box-shadow:
    0 18px 45px rgba(16, 18, 24, 0.12),
    0 2px 10px rgba(16, 18, 24, 0.06) !important;

  transform: translateZ(0) !important;
}

.mmes-input-wrap {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
}

/* فیلد */
.mmes-input {
  flex: 1 !important;
  height: 44px !important;
  border: 1px solid #D6D6D6 !important;
  border-radius: 12px !important;
  padding: 0 12px !important;
  outline: none !important;
  font-size: 14px !important;
  background: rgba(255,255,255,0.9) !important;
  color: #111 !important;
  transition: box-shadow 180ms ease, border-color 180ms ease !important;
}

.mmes-input::placeholder {
  color: #8a8a8a !important;
}

.mmes-input:focus {
  border-color: rgba(36, 32, 55, 0.55) !important;
  box-shadow: 0 0 0 4px rgba(36, 32, 55, 0.10) !important;
}

.mmes-go {
  border: 0 !important;
  background: transparent !important;
  padding: 0 !important;
  cursor: pointer !important;
  line-height: 0 !important;
  transition: transform 180ms ease, opacity 180ms ease !important;
  will-change: transform !important;
}

.mmes-go:hover { transform: translateY(-1px) !important; }
.mmes-go:active { transform: translateY(0) scale(0.98) !important; }

.mmes-go img {
  width: 32px !important;
  height: 32px !important;
  display: block !important;
}

/* Loader */
.mmes-loader {
  margin-top: 10px !important;
  width: 100% !important;
  height: 3px !important;
  background: rgba(241,241,241,0.95) !important;
  border-radius: 999px !important;
  overflow: hidden !important;
  position: relative !important;
}

.mmes-loader::after {
  content: "" !important;
  position: absolute !important;
  left: -35% !important;
  top: 0 !important;
  height: 100% !important;
  width: 35% !important;
  background: #242037 !important;
  border-radius: 999px !important;
  animation: mmes_load 0.9s ease-in-out infinite !important;
  opacity: 0.95 !important;
}

@keyframes mmes_load {
  0% { left: -35%; }
  100% { left: 100%; }
}

/* پیشنهادها (3 نتیجه) */
.mmes-suggest {
  list-style: none !important;
  padding: 0 !important;
  margin: 12px 0 0 0 !important;
}

.mmes-suggest__item {
  margin-bottom: 8px !important;
}

.mmes-suggest__item a {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  padding: 10px !important;
  border-radius: 12px !important;
  text-decoration: none !important;
  border: 1px solid rgba(214,214,214,0.95) !important;
  background: rgba(255,255,255,0.92) !important;

  transition: transform 180ms ease, box-shadow 180ms ease, border-color 180ms ease !important;
  will-change: transform !important;
}

.mmes-suggest__item a:hover {
  transform: translateY(-1px) !important;
  border-color: rgba(36, 32, 55, 0.20) !important;
  box-shadow: 0 10px 28px rgba(16, 18, 24, 0.10) !important;
}

.mmes-suggest__thumb {
  width: 52px !important;
  height: 52px !important;
  border-radius: 12px !important;
  overflow: hidden !important;
  flex: 0 0 auto !important;
  background: #f5f5f5 !important;
}

.mmes-suggest__thumb img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  display: block !important;
}

.mmes-suggest__title {
  flex: 1 !important;
  display: flex !important;
  align-items: center !important;
  min-height: 52px !important;
  font-size: 14px !important;
  color: #111 !important;
}

.mmes-suggest__empty {
  padding: 10px !important;
  color: #666 !important;
  border: 1px solid rgba(214,214,214,0.95) !important;
  border-radius: 12px !important;
  background: rgba(255,255,255,0.92) !important;
}

/* دکمه مشاهده بیشتر (ویجت) */
.mmes-more {
  display: none !important;
  width: 100% !important;
  height: 44px !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
  border-radius: 12px !important;
  text-decoration: none !important;
  margin-top: 10px !important;

  background: #242037 !important;
  color: #fff !important;
  border: 1px solid #242037 !important;

  font-size: 14px !important;
  cursor: pointer !important;

  transition: transform 180ms ease, box-shadow 180ms ease, opacity 180ms ease !important;
  will-change: transform !important;
}

.mmes-more.is-visible { display: flex !important; }

.mmes-more:hover {
  transform: translateY(-1px) !important;
  box-shadow: 0 12px 30px rgba(36, 32, 55, 0.22) !important;
}

.mmes-more:active { transform: translateY(0) scale(0.99) !important; }

/* ---------- Results page (Shortcode) ---------- */
.mmes-results {
  width: 100% !important;
  max-width: 1392px !important;
  margin: 0 auto !important;
}

.mmes-results__input {
  width: 100% !important;
  height: 44px !important;
  border: 1px solid #D6D6D6 !important;
  border-radius: 12px !important;
  padding: 0 14px !important;
  outline: none !important;
  font-size: 14px !important;
  background: rgba(255,255,255,0.92) !important;
  color: #111 !important;
  transition: box-shadow 180ms ease, border-color 180ms ease !important;
}

.mmes-results__input:focus {
  border-color: rgba(36, 32, 55, 0.55) !important;
  box-shadow: 0 0 0 4px rgba(36, 32, 55, 0.10) !important;
}

.mmes-results__meta {
  margin-top: 10px !important;
  color: #666 !important;
  font-size: 14px !important;
}

.mmes-results__empty {
  margin-top: 12px !important;
  color: #666 !important;
  font-size: 14px !important;
}

/* Grid: 1392px و کارت 300px */
.mmes-results__list {
  width: 1392px !important;
  max-width: 100% !important;
  margin: 16px auto 0 auto !important;

  list-style: none !important;
  padding: 0 !important;

  display: grid !important;
  grid-template-columns: repeat(4, 300px) !important;
  gap: 16px !important;
  justify-content: center !important;
}

.mmes-card {
  width: 300px !important;
  border: 1px solid rgba(214,214,214,0.95) !important;
  border-radius: 14px !important;
  overflow: hidden !important;
  background: rgba(255,255,255,0.94) !important;

  transition: transform 200ms ease, box-shadow 200ms ease, border-color 200ms ease !important;
  will-change: transform !important;
}

.mmes-card:hover {
  transform: translateY(-2px) !important;
  border-color: rgba(36, 32, 55, 0.20) !important;
  box-shadow: 0 18px 45px rgba(16, 18, 24, 0.12) !important;
}

.mmes-card__img {
  width: 100% !important;
  height: 180px !important;
  background: #f5f5f5 !important;
}

.mmes-card__img img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  display: block !important;
}

.mmes-card__body {
  padding: 12px !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 10px !important;
}

.mmes-card__title {
  font-size: 14px !important;
  color: #111 !important;
  line-height: 1.7 !important;
}

.mmes-card__title a {
  color: #111 !important;
  text-decoration: none !important;
  display: block !important;
}

.mmes-card__more {
  height: 44px !important;
  width: 100% !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  border-radius: 12px !important;
  text-decoration: none !important;

  background: #242037 !important;
  border: 1px solid #242037 !important;
  color: #fff !important;

  font-size: 14px !important;
  transition: transform 180ms ease, box-shadow 180ms ease !important;
  will-change: transform !important;
}

.mmes-card__more:hover {
  transform: translateY(-1px) !important;
  box-shadow: 0 12px 30px rgba(36, 32, 55, 0.22) !important;
}

.mmes-card__more:active { transform: translateY(0) scale(0.99) !important; }

/* Pagination */
.mmes-pagination {
  list-style: none !important;
  padding: 0 !important;
  margin: 18px 0 0 0 !important;
  display: flex !important;
  gap: 8px !important;
  justify-content: center !important;
  align-items: center !important;
  flex-wrap: wrap !important;
}

.mmes-page-btn {
  height: 44px !important;
  min-width: 44px !important;
  padding: 0 14px !important;
  border-radius: 12px !important;
  border: 1px solid #242037 !important;
  background: #242037 !important;
  color: #fff !important;
  cursor: pointer !important;
  font-size: 14px !important;

  transition: transform 180ms ease, box-shadow 180ms ease, opacity 180ms ease !important;
  will-change: transform !important;
}

.mmes-page-btn:hover {
  transform: translateY(-1px) !important;
  box-shadow: 0 12px 30px rgba(36, 32, 55, 0.18) !important;
}

.mmes-page-btn[disabled] {
  opacity: 0.45 !important;
  cursor: not-allowed !important;
  box-shadow: none !important;
  transform: none !important;
}

/* Responsive */
@media (max-width: 1320px) {
  .mmes-results__list {
    width: 100% !important;
    grid-template-columns: repeat(3, 300px) !important;
  }
}

@media (max-width: 980px) {
  .mmes-results__list {
    width: 100% !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
  .mmes-card { width: 100% !important; }
  .mmes-card__img { height: 170px !important; }
}

/* موبایل: کارت‌ها 2 تا 2 تا کنار هم */
@media (max-width: 560px) {
  .mmes-results__list {
    width: 100% !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 12px !important;
  }
  .mmes-card { width: 100% !important; }
  .mmes-card__img { height: 140px !important; }
  .mmes-card__body { padding: 10px !important; gap: 8px !important; }
  .mmes-card__title { font-size: 13px !important; line-height: 1.6 !important; }
  .mmes-card__more { height: 42px !important; font-size: 13px !important; }
}

@media (max-width: 360px) {
  .mmes-results__list {
    grid-template-columns: repeat(1, minmax(0, 1fr)) !important;
  }
}

/* =========================
   ✅ Mobile-only overlay + modal center
   ========================= */

@media (max-width: 640px) {

  /* وقتی پاپ‌آپ بازه، کل پس‌زمینه تیره شود */
  body.mmes-overlay-open::before {
    content: "" !important;
    position: fixed !important;
    inset: 0 !important;
    background: rgba(0, 0, 0, 0.40) !important;
    z-index: 999998 !important;
  }

  /* اسکرول پشت مودال قطع شود */
  body.mmes-overlay-open {
    overflow: hidden !important;
    touch-action: none !important;
  }

  /* پاپ‌آپ وسط صفحه مثل مودال */
  .mmes-widget .mmes-pop {
    position: fixed !important;
    top: 50% !important;
    left: 50% !important;
    margin-top: 0 !important;
    width: min(92vw, 420px) !important;
    max-width: 92vw !important;

    transform: translate(-50%, -50%) scale(0.98) !important;
    z-index: 999999 !important;
  }

  .mmes-widget .mmes-pop.is-open {
    transform: translate(-50%, -50%) scale(1) !important;
  }

  .mmes-widget .mmes-pop__inner {
    border-radius: 16px !important;
    padding: 14px !important;
  }
}

/* احترام به تنظیمات کاهش حرکت */
@media (prefers-reduced-motion: reduce) {
  .mmes-widget .mmes-icon-btn,
  .mmes-widget .mmes-pop,
  .mmes-input,
  .mmes-go,
  .mmes-suggest__item a,
  .mmes-more,
  .mmes-card,
  .mmes-card__more,
  .mmes-page-btn {
    transition: none !important;
    animation: none !important;
  }
}