/* ── WRM Currency ─────────────────────────────────────────────────
   Non-invasive secondary price hint + opt-in switcher.
   Luxury palette: gold #c9a84c, brown #704e17, parchment #c0ba9b.
   ─────────────────────────────────────────────────────────────── */

/* The hint — small, muted, sits inline after the base price */
.wrm-fx-hint {
  display: inline-block;
  margin-left: 0.4em;
  font-size: 0.78em;
  font-weight: 400;
  letter-spacing: 0.01em;
  color: #704e17;
  opacity: 0.7;
  white-space: nowrap;
  vertical-align: baseline;
  font-variant-numeric: tabular-nums;
}

/* On dark CTAs the brown disappears — switch to muted gold */
.jct-btn-buy .wrm-fx-hint,
.jct-card.jct-mode-full .wrm-fx-hint,
.has-dark-background .wrm-fx-hint,
[data-theme="dark"] .wrm-fx-hint,
.dark-bg .wrm-fx-hint {
  color: #c9a84c;
  opacity: 0.85;
}

/* When the price sits inside a button we want the hint on a second
   line so the button doesn't grow wide. Opt-in via .wrm-fx-stack
   class on the parent. */
.wrm-fx-stack .wrm-fx-hint {
  display: block;
  margin-left: 0;
  margin-top: 2px;
  font-size: 0.7em;
  text-align: center;
}

/* Hide when only one currency is visible (set by JS) */
.wrm-fx-hint[hidden] { display: none !important; }

/* ── Switcher ────────────────────────────────────────────────────── */

.wrm-cur-switcher {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 13px;
  line-height: 1;
  font-family: inherit;
}
.wrm-cur-switcher__label {
  color: #888;
  letter-spacing: 0.02em;
}
.wrm-cur-switcher__select {
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  background: transparent;
  border: 1px solid rgba(112, 78, 23, 0.28);
  border-radius: 999px;
  color: #704e17;
  padding: 5px 24px 5px 12px;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  cursor: pointer;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='10' height='10' viewBox='0 0 10 10'><path d='M2 4l3 3 3-3' fill='none' stroke='%23704e17' stroke-width='1.4' stroke-linecap='round' stroke-linejoin='round'/></svg>");
  background-repeat: no-repeat;
  background-position: right 8px center;
  transition: border-color 160ms ease, color 160ms ease;
}
.wrm-cur-switcher__select:hover,
.wrm-cur-switcher__select:focus {
  border-color: #c9a84c;
  color: #5a3e10;
  outline: none;
}
.wrm-cur-switcher--minimal .wrm-cur-switcher__select {
  border-color: transparent;
  padding-left: 4px;
}
.wrm-cur-switcher--inline {
  vertical-align: baseline;
}