/* Custom price range layout – tuned for "min تا max تومان"
 *
 * Desktop (>=900px):
 *   320/000 تا 1/980/000 تومان   (all in one line, with spaces)
 *
 * Mobile (<900px):
 *   320/000 تا
 *   1/980/000 تومان
 */

/* Base: allow wrapping inside price cells and strip theme "badge" look */
.rtbl .price-badge,
.rtbl .price,
.rtbl span.price-text {
  white-space: normal !important;
  background: none !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
}

/* Make sure custom price cells can wrap if any nowrap leaked in */
table td.mtbl-price-cell,
table th.mtbl-price-cell {
  white-space: normal !important;
}

/* Base layout for all mtbl-price-range elements */
table .mtbl-price-range {
  display: inline-block !important;
  direction: rtl !important;
  white-space: normal !important;
  font-variant-numeric: tabular-nums;
}

/* Reset inner pieces to inline and zero margins by default */
table .mtbl-price-range .min,
table .mtbl-price-range .sep,
table .mtbl-price-range .max,
table .mtbl-price-range .currency {
  display: inline !important;
  margin: 0 !important;
  padding: 0 !important;
  line-height: 1.6 !important;
}

/* Mild styling for the separator on all viewports */
table .mtbl-price-range .sep {
  margin: 0 0.25em !important;
}

/* Mild spacing for the currency token */
table .mtbl-price-range .currency {
  margin-right: 0.25em !important;
  margin-left: 0.25em !important;
}

/* =======================
 * Desktop (>= 900px)
 * =======================
 * Everything in one line:
 *   320/000 تا 1/980/000 تومان
 */
@media (min-width: 900px) {
  table .mtbl-price-range.mtbl-price-range-toman {
    white-space: nowrap !important;
  }
}

/* =======================
 * Mobile (< 900px)
 * =======================
 * Two-line layout:
 *   320/000 تا
 *   1/980/000 تومان
 */
@media (max-width: 899.98px) {
  table .mtbl-price-range.mtbl-price-range-toman {
    white-space: normal !important;
  }

  /* First line: "min تا" */
  table .mtbl-price-range.mtbl-price-range-toman .min,
  table .mtbl-price-range.mtbl-price-range-toman .sep {
    display: inline !important;
  }

  /* Second line: "max تومان" */
  table .mtbl-price-range.mtbl-price-range-toman .max {
    display: block !important; /* forces a new line before max */
  }

  table .mtbl-price-range.mtbl-price-range-toman .currency {
    display: inline !important;
  }
}
