/**
 * MTX Smart Discount Rules Pro — storefront elements.
 *
 * One visual system, the "deal ticket": badges, pricing tables, and
 * countdowns all speak the price-tag vernacular — perforated edges,
 * a punched hole, receipt-style numerals.
 *
 * Designed to live inside any theme: type inherits the theme's body
 * font (numerals go tabular/mono), and every color routes through a
 * custom property a merchant can override:
 *
 *   .mtxsdr-badge, .mtxsdr-pricing-table, .mtxsdr-countdown {
 *     --mtxsdr-accent: #b3261e;  <- your brand
 *   }
 */

.mtxsdr-badge,
.mtxsdr-pricing-table,
.mtxsdr-countdown {
  /* Ledger green: savings = money kept (not red-sale noise). */
  --mtxsdr-accent: #0e6b45;
  --mtxsdr-ink: #22261f;
  --mtxsdr-paper: #fffdf7;
  --mtxsdr-perforation: color-mix(in srgb, var(--mtxsdr-accent) 45%, transparent);

  font-family: inherit;
  box-sizing: border-box;
}

.mtxsdr-badge *,
.mtxsdr-pricing-table *,
.mtxsdr-countdown * {
  box-sizing: border-box;
}

/* ------------------------------ Badge: the tag ------------------------------ */

.mtxsdr-badge {
  display: inline-flex;
  align-items: center;
  gap: 0.5em;
  margin: 0.35em 0;
  padding: 0.32em 0.85em 0.32em 0.65em;
  background: var(--mtxsdr-paper);
  color: var(--mtxsdr-accent);
  border: 1.5px solid var(--mtxsdr-accent);
  border-radius: 0.25em 0.6em 0.6em 0.25em;
  font-size: 0.82em;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  line-height: 1.2;
  position: relative;
}

/* Punched hole. */
.mtxsdr-badge__hole {
  width: 0.5em;
  height: 0.5em;
  border-radius: 50%;
  background: transparent;
  border: 1.5px solid var(--mtxsdr-accent);
  flex: none;
}

.mtxsdr-badge__text {
  font-variant-numeric: tabular-nums;
}

/* ------------------------------ Pricing table: the stamp card ------------------------------ */

.mtxsdr-pricing-table {
  margin: 1em 0;
  padding: 0.9em 1.1em 0.6em;
  max-width: 26em;
  background: var(--mtxsdr-paper);
  color: var(--mtxsdr-ink);
  border: 1.5px solid var(--mtxsdr-accent);
  border-radius: 0.6em;
  position: relative;
}

/* Perforated top edge. */
.mtxsdr-pricing-table::before {
  content: '';
  position: absolute;
  top: 0.55em;
  left: 1.1em;
  right: 1.1em;
  border-top: 1.5px dashed var(--mtxsdr-perforation);
}

.mtxsdr-pricing-table__title {
  margin: 0.55em 0 0.4em !important;
  font-size: 0.78em;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--mtxsdr-accent);
}

.mtxsdr-pricing-table__rows {
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

.mtxsdr-pricing-table__row {
  display: flex;
  align-items: baseline;
  gap: 0.6em;
  padding: 0.42em 0;
  margin: 0 !important;
  border-bottom: 1px dashed var(--mtxsdr-perforation);
  font-size: 0.95em;
}

.mtxsdr-pricing-table__row:last-child {
  border-bottom: none;
}

.mtxsdr-pricing-table__qty {
  font-variant-numeric: tabular-nums;
  font-family: ui-monospace, 'SF Mono', SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 0.92em;
  color: var(--mtxsdr-ink);
  flex: none;
}

/* Dotted leader between quantity and saving. */
.mtxsdr-pricing-table__dots {
  flex: 1;
  border-bottom: 2px dotted var(--mtxsdr-perforation);
  transform: translateY(-0.28em);
}

.mtxsdr-pricing-table__save {
  color: var(--mtxsdr-accent);
  flex: none;
}

.mtxsdr-pricing-table__save strong {
  font-variant-numeric: tabular-nums;
  font-size: 1.1em;
}

/* ------------------------------ Countdown: the receipt stamp ------------------------------ */

.mtxsdr-countdown {
  display: inline-flex;
  align-items: center;
  gap: 0.7em;
  margin: 0.5em 0 1em;
  padding: 0.45em 0.9em;
  background: var(--mtxsdr-paper);
  color: var(--mtxsdr-ink);
  border: 1.5px solid var(--mtxsdr-accent);
  border-left: 1.5px dashed var(--mtxsdr-accent);
  border-radius: 0 0.6em 0.6em 0;
}

.mtxsdr-countdown__label {
  font-size: 0.78em;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--mtxsdr-accent);
}

.mtxsdr-countdown__clock {
  font-family: ui-monospace, 'SF Mono', SFMono-Regular, Menlo, Consolas, monospace;
  font-variant-numeric: tabular-nums;
  font-size: 1.05em;
  font-weight: 600;
}

.mtxsdr-countdown--ended {
  opacity: 0.55;
}

/* ------------------------------ Free gift price label ------------------------------ */

.mtxsdr-free-gift-price,
.mtxsdr-free-gift {
  color: var(--mtxsdr-accent, #0e6b45);
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}
