/* رنگ‌بندی سرمه‌ای هماهنگ با سایت؛ برای تغییر فقط همین متغیرها را عوض کن */
.zfc-filters {
  --zfc-card: #14223a;
  --zfc-field: #0e1a2e;
  --zfc-border: #243a5e;
  --zfc-text: #dce8ff;
  --zfc-muted: #8fa3c8;
  --zfc-accent: var(--primaryColor, #4051b6);
  --zfc-accent-text: #fff;
  --zfc-radius: 14px;

  direction: rtl;
  width: 100%;
  margin: 10px 0 34px !important;
  padding: 22px 26px;
  background: var(--zfc-card);
  border: 1px solid var(--zfc-border);
  border-radius: 24px;
  color: var(--zfc-text);
  box-sizing: border-box;
}
.zfc-filters *, .zfc-filters *::before, .zfc-filters *::after { box-sizing: border-box; }

/* عنوان دسته بالای فرم، تمام‌عرض */
.archive_heading_bar:has(.zfc-filters) { flex-direction: column; align-items: stretch; gap: 0; width: 100%; height: auto; }
.archive_heading_bar:has(.zfc-filters) .zfc-filters { flex: 0 0 auto; }
.archive_heading_bar:has(.zfc-filters) .category_title { flex: 0 0 auto; }
.archive_heading_bar:has(.zfc-filters) { margin-bottom: 0 !important; padding-bottom: 34px; }
.archive_heading_bar:has(.zfc-filters) .zfc-filters { margin-bottom: 0 !important; }

.zfc-filters label { display: flex; flex-direction: column; gap: 9px; margin: 0; min-width: 0; }
.zfc-filters label > span { font-size: 13.5px; color: var(--zfc-muted); }

.zfc-filters input[type="text"],
.zfc-filters input:not([type]),
.zfc-filters select {
  width: 100%;
  height: 52px;
  padding: 0 18px;
  background-color: var(--zfc-field);
  border: 1px solid var(--zfc-border);
  border-radius: var(--zfc-radius);
  color: var(--zfc-text);
  font: inherit;
  font-size: 15px;
  outline: none;
  box-shadow: none;
  transition: border-color .15s;
}
.zfc-filters input::placeholder { color: var(--zfc-muted); }
.zfc-filters input:focus,
.zfc-filters select:focus { border-color: var(--zfc-accent); }
.zfc-filters select {
  appearance: none; -webkit-appearance: none; cursor: pointer;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%238fa3c8' stroke-width='2.2'><path d='m6 9 6 6 6-6'/></svg>");
  background-repeat: no-repeat; background-position: left 16px center; padding-left: 40px;
}
.zfc-filters select option { background: var(--zfc-field); color: var(--zfc-text); }

.zfc-main { display: grid; grid-template-columns: 1.4fr 1fr 1fr 1fr auto; gap: 18px; align-items: end; }

.zfc-filters button[type="submit"] {
  display: inline-flex; align-items: center; justify-content: center; gap: 12px;
  height: 52px; padding: 0 30px; border: 0; border-radius: var(--zfc-radius);
  background: var(--zfc-accent); color: var(--zfc-accent-text);
  font: inherit; font-size: 15px; font-weight: 700; cursor: pointer; white-space: nowrap;
  transition: filter .15s, transform .1s;
}
.zfc-filters button[type="submit"]:hover { filter: brightness(1.12); }
.zfc-filters button[type="submit"]:active { transform: translateY(1px); }

.zfc-toggle { display: none; }

.zfc-more { margin-top: 20px; border-top: 1px solid var(--zfc-border); }
.zfc-more > summary {
  list-style: none; display: flex; align-items: center; justify-content: space-between;
  padding: 16px 0; cursor: pointer; font-size: 15px; font-weight: 600; color: var(--zfc-text);
}
.zfc-more > summary::-webkit-details-marker { display: none; }
.zfc-more > summary span { font-size: 20px; color: var(--zfc-muted); transition: transform .2s; }
.zfc-more[open] > summary span { transform: rotate(45deg); }

.zfc-fields { display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px; padding-bottom: 6px; }
.zfc-actions { display: flex; align-items: center; justify-content: space-between; gap: 18px; flex-wrap: wrap; padding: 18px 0 6px; }

.zfc-switch { flex-direction: row !important; align-items: center; gap: 12px !important; cursor: pointer; }
.zfc-switch input { position: absolute; opacity: 0; pointer-events: none; }
.zfc-switch span { position: relative; padding-right: 58px; color: var(--zfc-text) !important; font-size: 15px !important; line-height: 30px; }
.zfc-switch span::before { content: ""; position: absolute; right: 0; top: 0; width: 48px; height: 30px; border-radius: 30px; background: var(--zfc-field); border: 1px solid var(--zfc-border); transition: background .15s; }
.zfc-switch span::after { content: ""; position: absolute; right: 21px; top: 5px; width: 20px; height: 20px; border-radius: 50%; background: #fff; transition: right .15s; }
.zfc-switch input:checked + span::before { background: var(--zfc-accent); border-color: var(--zfc-accent); }
.zfc-switch input:checked + span::after { right: 4px; }

.zfc-quick { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin-top: 14px; padding-top: 20px; border-top: 1px solid var(--zfc-border); }
.zfc-quick > span { color: var(--zfc-muted); font-size: 13px; margin-left: 4px; }
.zfc-quick button {
  padding: 8px 20px; background: transparent; border: 1px solid var(--zfc-border); border-radius: 999px;
  color: var(--zfc-text); font: inherit; font-size: 14px; cursor: pointer; transition: border-color .15s, color .15s, background .15s;
}
.zfc-quick button:hover { border-color: var(--zfc-accent); }
.zfc-quick button[aria-pressed="true"] { border-color: var(--zfc-accent); background: var(--zfc-accent); color: var(--zfc-accent-text); }
.zfc-quick a { margin-right: auto; color: #8fa0ff; font-size: 13px; text-decoration: none; }
.zfc-quick a:hover { text-decoration: underline; }

@media (max-width: 1100px) {
  .zfc-main { grid-template-columns: 1fr 1fr; }
  .zfc-main > button[type="submit"] { grid-column: 1 / -1; }
  .zfc-fields { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 640px) {
  .zfc-filters { padding: 16px; border-radius: 22px; }
  .zfc-toggle {
    display: flex; align-items: center; justify-content: space-between; width: 100%; height: 52px; padding: 0 18px;
    background: var(--zfc-field); border: 1px solid var(--zfc-border); border-radius: var(--zfc-radius);
    color: var(--zfc-text); font: inherit; font-size: 15px; cursor: pointer;
  }
  .zfc-ready .zfc-main, .zfc-ready .zfc-more, .zfc-ready .zfc-quick { display: none; }
  .zfc-ready.zfc-open .zfc-main { display: grid; grid-template-columns: 1fr; margin-top: 16px; gap: 16px; }
  .zfc-ready.zfc-open .zfc-more { display: block; }
  .zfc-ready.zfc-open .zfc-quick { display: flex; }
  .zfc-fields { grid-template-columns: 1fr; }
}

/* موبایل: فیلدهای فرم فیلتر هم موقع فوکوس زوم نشوند (حداقل ۱۶px) */
@media (max-width: 1000px) {
  .zfc-filters input[type="text"],
  .zfc-filters input:not([type]),
  .zfc-filters select { font-size: 16px; }
}
