/* MMCDS Frontend Styles - from line 1 */

.mmcds-filter{
  display: inline-flex;
  align-items: center;
  gap: 16px; /* فاصله متن تا دراپ‌داون */
  direction: rtl;
}

/* Label: فیلتر اخبار */
.mmcds-filter__label{
  font-family: yekanbakh, sans-serif !important;
  font-weight: 500 !important;
  font-style: normal !important; /* Medium via weight */
  font-size: 18px !important;
  text-align: right !important;
  color: #1E2023 !important;
  line-height: 1.4;
  white-space: nowrap;
}

/* Select wrapper (برای آیکن) */
.mmcds-filter__select-wrap{
  position: relative;
  display: inline-block;
  width: 306px; /* طبق درخواست */
  max-width: 100%;
}

/* آیکن انتهای دراپ‌داون */
.mmcds-filter__select-wrap::after{
  content: "";
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 18px;
  height: 18px;

  background-image: var(--mmcds-dd-icon);
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;

  /* انتهای فیلد در RTL هم درست کار می‌کند */
  inset-inline-end: 16px;

  pointer-events: none; /* کلیک select مختل نشه */
}

/* Select */
.mmcds-filter__select{
  background: #FFFFFF !important;
  border: 1px solid #D6D6D6 !important;

  width: 306px !important;
  max-width: 100% !important;
  height: 44px !important;

  border-radius: 6px !important;

  padding-top: 10px !important;
  padding-right: 16px !important;
  padding-bottom: 10px !important;
  padding-left: 16px !important;

  /* جا برای آیکن */
  padding-inline-end: 44px !important;

  font-family: yekanbakh, sans-serif !important;
  font-weight: 500 !important;
  font-size: 14px !important;

  text-align: right !important;
  color: #1E2023 !important;

  outline: none !important;
  box-shadow: none !important;

  appearance: none !important;
  -webkit-appearance: none !important;
  -moz-appearance: none !important;

  cursor: pointer;
}

/* Focus */
.mmcds-filter__select:focus{
  border-color: #D6D6D6 !important;
  outline: none !important;
  box-shadow: none !important;
}

/* Optional: loading state (Loop sync) */
[data-mmcds-sync="1"].mmcds-is-loading{
  opacity: .6;
  pointer-events: none;
  transition: opacity .15s ease;
}

/* Responsive */
@media (max-width: 640px){
  .mmcds-filter{
    width: 100%;
    flex-wrap: wrap;
    gap: 12px;
  }

  .mmcds-filter__select-wrap,
  .mmcds-filter__select{
    width: 100% !important;
  }
}
/* MMCDS Filterbar */
.mmcds-filterbar{
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  align-items: center;
  direction: rtl;
}

.mmcds-filterbar__btn{
  border: 1px solid #D6D6D6 !important;
  background: #FFFFFF !important;
  border-radius: 999px !important;
  padding: 10px 14px !important;

  font-family: yekanbakh, sans-serif !important;
  font-weight: 500 !important;
  font-size: 14px !important;
  color: #1E2023 !important;

  cursor: pointer !important;
  outline: none !important;
  box-shadow: none !important;
  transition: transform .12s ease, opacity .12s ease;
}

.mmcds-filterbar__btn:hover{
  transform: translateY(-1px);
}

.mmcds-filterbar__btn.is-active{
  border-color: #1E2023 !important;
}

.mmcds-filterbar__btn.is-disabled{
  opacity: .45 !important;
  cursor: not-allowed !important;
}
/* ===== MMCDS Filterbar Buttons Style (No Border) ===== */

.mmcds-filterbar{
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  align-items: center;
  direction: rtl;
}

/* حالت عادی */
.mmcds-filterbar__btn{
  background: #FFFFFF !important;
  color: #1E2023 !important;

  font-family: yekanbakh, sans-serif !important;
  font-weight: 500 !important;
  font-style: normal !important;
  font-size: 16px !important;
  text-align: right !important;

  border: 0 !important;
  outline: none !important;
  box-shadow: none !important;

  border-radius: 6px !important;
  padding: 10px 14px !important;
  line-height: 1.2;

  cursor: pointer !important;

  transition: background-color .15s ease, color .15s ease;
}

/* هاور */
.mmcds-filterbar__btn:hover{
  background: #242037 !important;
  color: #FFFFFF !important;
}

/* فعال مثل هاور */
.mmcds-filterbar__btn.is-active{
  background: #242037 !important;
  color: #FFFFFF !important;
}

/* غیرفعال */
.mmcds-filterbar__btn.is-disabled{
  opacity: .45 !important;
  cursor: not-allowed !important;
  pointer-events: none !important;
}
/* ===== Mobile layout fixes ===== */
@media (max-width: 640px){

  /* Dropdown row: label + select side-by-side */
  .mmcds-filter{
    width: 100%;
    flex-wrap: nowrap;         /* مهم: نره خط بعد */
    justify-content: space-between;
    gap: 12px;                 /* فاصله موبایل کمی کمتر */
  }

  .mmcds-filter__label{
    flex: 0 0 auto;
    font-size: 16px !important; /* اگر خواستی 18 هم بمونه حذفش کن */
    white-space: nowrap;
  }

  .mmcds-filter__select-wrap{
    flex: 1 1 auto;
    width: auto;               /* override width:306px */
    max-width: 100%;
  }

  .mmcds-filter__select{
    width: 100% !important;    /* تمام فضای باقی‌مانده */
    max-width: 100% !important;
  }

  /* Filter buttons: horizontal scroll + hint that more exists */
  .mmcds-filterbar{
    position: relative;
    width: 100%;
    flex-wrap: nowrap;         /* دکمه‌ها کنارهم */
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
    gap: 10px;

    /* فاصله داخلی تا دکمه‌ها به لبه نچسبند */
    padding: 0 10px 0 34px;    /* سمت چپ فضای "hint" */
    scroll-snap-type: x proximity;

    /* hint: لبه‌ی چپ محو می‌شود تا کاربر بفهمد ادامه دارد */
    background:
      linear-gradient(to left, #FFFFFF 55%, rgba(255,255,255,0)) left / 34px 100% no-repeat;
    background-attachment: local;
  }

  .mmcds-filterbar__btn{
    flex: 0 0 auto;
    white-space: nowrap;       /* متن دکمه نره دو خط */
    scroll-snap-align: start;
  }

  /* (اختیاری) اسکرول‌بار ظریف */
  .mmcds-filterbar::-webkit-scrollbar{
    height: 6px;
  }
  .mmcds-filterbar::-webkit-scrollbar-thumb{
    border-radius: 999px;
  }
}
