/* Display-currency switcher + converted money amounts */
.currency-switcher {
  position: relative;
  display: inline-block;
  font-size: .8rem;
  line-height: 1;
  z-index: 40;
  vertical-align: middle;
}
.currency-switcher > summary {
  list-style: none;
  cursor: pointer;
  user-select: none;
  display: inline-flex;
  align-items: center;
  gap: .3rem;
  padding: .35rem .6rem;
  border: 1px solid var(--border, rgba(255, 255, 255, .14));
  border-radius: 999px;
  font-weight: 600;
  color: inherit;
  background: rgba(15, 26, 46, .55);
}
.currency-switcher > summary::-webkit-details-marker { display: none; }
.currency-switcher > summary::after { content: "▾"; font-size: .7em; opacity: .7; }
.currency-switcher[open] > summary {
  border-color: var(--primary, #14b8a6);
  color: var(--primary, #14b8a6);
}
.currency-switcher > summary:focus-visible {
  outline: 2px solid var(--primary, #14b8a6);
  outline-offset: 2px;
}
.currency-menu {
  position: absolute;
  inset-inline-end: 0;
  inset-inline-start: auto;
  top: calc(100% + .35rem);
  z-index: 1200;
  min-width: 11.5rem;
  max-width: min(18rem, calc(100vw - 1.5rem));
  margin: 0;
  padding: .35rem;
  list-style: none;
  background: var(--surface-2, #162236);
  color: var(--text, #f1f5f9);
  border: 1px solid var(--border, rgba(255, 255, 255, .12));
  border-radius: .7rem;
  box-shadow: 0 14px 36px rgba(0, 0, 0, .45);
  overflow: hidden;
}
.currency-menu li { margin: 0; }
.currency-link {
  display: flex;
  align-items: center;
  gap: .6rem;
  padding: .55rem .65rem;
  border-radius: .45rem;
  color: var(--text, #f1f5f9);
  text-decoration: none;
  white-space: nowrap;
}
.currency-link:hover,
.currency-link:focus-visible {
  background: rgba(20, 184, 166, .14);
  color: #fff;
  outline: none;
}
.currency-link.is-active {
  color: var(--primary, #14b8a6);
  font-weight: 700;
  background: rgba(20, 184, 166, .12);
}
.currency-link .currency-code { min-width: 2.6rem; font-weight: 700; }
.currency-link .currency-label {
  color: #cbd5e1;
  font-size: .9em;
  opacity: 1;
}
.currency-link.is-active .currency-label,
.currency-link:hover .currency-label {
  color: inherit;
}
.lang-switcher + .currency-switcher,
.currency-switcher-wrap { margin-inline-start: .5rem; }

/* Auth: keep block layout (flex on <details> breaks absolute menu anchoring) */
.auth-card { overflow: visible; }
.auth-card .currency-switcher {
  display: block;
  margin: 0 auto 1rem;
  width: max-content;
  z-index: 50;
}
/* Center under the trigger: reset logical insets first so they don't
   override physical left in RTL (inset-inline-end maps to left). */
.auth-card .currency-menu {
  inset-inline: auto;
  left: 50%;
  right: auto;
  transform: translateX(-50%);
}
.landing-menu-lang .currency-switcher { margin-top: .75rem; }
.landing-menu-lang .currency-menu {
  inset-inline-start: 0;
  inset-inline-end: auto;
  transform: none;
}

.money .money-value { white-space: nowrap; }
.money.is-converted { cursor: help; }
.money .money-orig { display: inline-block; font-size: .78em; font-weight: 400; opacity: .7; white-space: nowrap; }
.stat-value .money .money-orig { display: block; font-size: .55em; margin-top: .15rem; }
.table-wrap { overflow-x: auto; }

@media (max-width: 420px) {
  .currency-menu {
    min-width: 10.5rem;
    max-width: calc(100vw - 1.25rem);
  }
}
