/* Currency switcher (the module and any page that shows prices). Standalone: it loads on pages without the component's main stylesheet. */
/* The reference's pill: the chosen currency and a chevron, opening a rounded list over it. Colours follow the surrounding text; set
   --sb-currency-border / --sb-currency-bg / --sb-currency-ink to retune it on a coloured header. */
.sb-currency { position: relative; display: inline-flex; align-items: center; gap: 0.4rem; color: inherit; }
.sb-currency__select, .sb-currency__button { font: inherit; font-size: 0.875rem; letter-spacing: 0.02em; color: inherit; min-height: 40px; min-width: 5.125rem; border: 1px solid var(--sb-currency-border, color-mix(in srgb, currentColor 35%, transparent)); border-radius: 60px; background: transparent; }
.sb-currency__select { padding: 0 1.75rem 0 1rem; }
.sb-currency__select--hidden { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); opacity: 0; pointer-events: none; }
.sb-currency__button { position: relative; padding: 0 1.9rem 0 1rem; text-align: left; cursor: pointer; }
.sb-currency__button::after { content: ""; position: absolute; right: 0.95rem; top: 50%; width: 0.4rem; height: 0.4rem; border: solid currentColor; border-width: 0 1.5px 1.5px 0; transform: translateY(-70%) rotate(45deg); }
.sb-currency__button:focus-visible, .sb-currency__option:focus-visible { outline: 2px solid currentColor; outline-offset: 2px; }
.sb-currency__list { position: absolute; z-index: 1100; top: 0; left: 0; width: 100%; min-width: 5.125rem; margin: 0; padding: 0.15rem; list-style: none; border-radius: 1.25rem; background: var(--sb-currency-bg, var(--sb-bg-sand, #efe7da)); color: var(--sb-currency-ink, var(--sb-color-ink, #23251f)); box-shadow: 0 6px 18px rgba(0, 0, 0, 0.12); }
.sb-currency__list[hidden] { display: none; }
.sb-currency__option { display: flex; align-items: center; min-height: 2rem; padding: 0 0.85rem; border-radius: 60px; font-size: 0.875rem; letter-spacing: 0.02em; cursor: pointer; }
.sb-currency__option:hover, .sb-currency__option[aria-selected="true"], .sb-currency__option:focus { background: color-mix(in srgb, var(--sb-color-highlight, #c3a675) 50%, transparent); outline: 0; }
.sb-currency__option:focus-visible { outline: 2px solid var(--sb-currency-ink, var(--sb-color-ink, #23251f)); outline-offset: -2px; }
@media (max-width: 767px) { .sb-currency__option { min-height: 2.5rem; } }