.ohmwc-switcher {
	display: inline-flex;
	gap: 10px;
	align-items: center;
	flex-wrap: wrap;
}

.ohmwc-switcher--list {
	display: flex;
	flex-direction: column;
	gap: 4px;
	align-items: flex-start;
}

.ohmwc-switcher__item {
	display: inline-block;
	padding: 4px 10px;
	border: 1px solid currentColor;
	border-radius: 999px;
	font-size: 0.85em;
	line-height: 1.4;
	text-decoration: none;
	opacity: 0.65;
	transition: opacity 0.15s ease;
}

.ohmwc-switcher__item:hover,
.ohmwc-switcher__item:focus-visible {
	opacity: 1;
}

/* Active state is signalled by weight + underline only, so the theme keeps control of colour. */
.ohmwc-switcher__item.is-active {
	opacity: 1;
	font-weight: 600;
	text-decoration: underline;
	text-underline-offset: 3px;
}

/* Dropdown style (settings default): a native <select> that inherits the theme's
 * header typography. One custom chevron (appearance:none kills the native arrow
 * AND any theme-applied double arrow); flat text control elsewhere. */
.ohmwc-switcher--dropdown {
	display: inline-flex;
	gap: 6px;
	align-items: center;
}

.ohmwc-switcher--dropdown select {
	appearance: none;
	-webkit-appearance: none;
	background-color: transparent;
	color: inherit;
	font-family: inherit;
	font-size: 0.9em;
	line-height: 1.4;
	padding: 4px 18px 4px 8px;
	margin: 0;
	border: 1px solid currentColor;
	border-radius: 999px;
	cursor: pointer;
	max-width: 9em;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 6'%3E%3Cpath d='M1 1l4 4 4-4' fill='none' stroke='%231a1a1a' stroke-width='1.5' stroke-linecap='round'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 7px center;
	background-size: 9px 6px;
}

/* The no-JS submit button: hidden by default (CSS loads in <head>, so no flash);
 * a <noscript> style in the form markup reveals it for visitors without JS. */
.ohmwc-switcher--dropdown .ohmwc-switcher__go {
	display: none;
}

/* Themed custom dropdown (JS builds it from the native select):
 * inherits the theme's typography and colours — no OS chrome anywhere. */
.ohmwc-dd {
	position: relative;
	display: inline-flex;
	align-items: center;
}

.ohmwc-dd__btn {
	display: inline-flex;
	align-items: center;
	gap: 0.35em;
	background: none;
	border: 0;
	padding: 0;
	margin: 0;
	color: inherit;
	font-family: inherit;
	font-size: inherit;
	line-height: inherit;
	cursor: pointer;
}

.ohmwc-dd__chevron {
	display: inline-block;
	width: 9px;
	height: 6px;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 6'%3E%3Cpath d='M1 1l4 4 4-4' fill='none' stroke='%231a1a1a' stroke-width='1.5' stroke-linecap='round'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: center;
	background-size: 9px 6px;
	transition: transform 0.12s ease;
}

.ohmwc-dd--open .ohmwc-dd__chevron {
	transform: rotate(180deg);
}

.ohmwc-dd__list {
	position: absolute;
	top: 100%;
	left: -8px;
	margin: 6px 0 0;
	min-width: 8.5em;
	background: #fff;
	color: #1a1a1a;
	border: 1px solid rgba(0, 0, 0, 0.1);
	border-radius: 4px;
	box-shadow: 0 10px 30px rgba(0, 0, 0, 0.12);
	padding: 4px;
	display: none;
	z-index: 9999;
}

.ohmwc-dd--open .ohmwc-dd__list {
	display: block;
}

.ohmwc-dd__option {
	display: block;
	width: 100%;
	text-align: left;
	background: none;
	border: 0;
	border-radius: 3px;
	padding: 0.45em 0.7em;
	color: inherit;
	font-family: inherit;
	font-size: 0.9em;
	line-height: 1.4;
	cursor: pointer;
	white-space: nowrap;
}

.ohmwc-dd__option:hover,
.ohmwc-dd__option:focus-visible {
	background: rgba(0, 0, 0, 0.06);
	outline: none;
}

.ohmwc-dd__option.is-active {
	font-weight: 600;
}

/* Nav/menu placement: blend into the menu like a plain item — no pill, no extra
 * chrome, just the currency text and one chevron, in the theme's own type. */
li.menu-item-ohmwc-currency .ohmwc-switcher,
li.menu-item-ohmwc-currency .ohmwc-switcher--dropdown {
	display: inline-flex;
	gap: 0;
}

li.menu-item-ohmwc-currency .ohmwc-switcher--dropdown select {
	font-size: inherit;
	border: 0;
	border-radius: 0;
	padding: 0 16px 0 0;
	background-color: transparent;
	background-position: right 4px center;
	min-height: 1em;
}

li.menu-item-ohmwc-currency .ohmwc-switcher__item {
	border: 0;
	border-radius: 0;
	padding: 0 0.5em;
	font-size: inherit;
	opacity: 0.55;
	vertical-align: middle;
}

li.menu-item-ohmwc-currency .ohmwc-switcher__item + .ohmwc-switcher__item {
	border-left: 1px solid currentColor;
	padding-left: 0.65em;
	margin-left: 0.15em;
}

li.menu-item-ohmwc-currency .ohmwc-switcher__item.is-active {
	opacity: 1;
}

/* Floating fallback (only when no menu/shortcode placement renders) — docked at the
 * top-right so it reads as part of the header, not an isolated widget. */
.ohmwc-float {
	position: fixed;
	right: 14px;
	top: 14px;
	z-index: 9999;
	display: inline-flex;
	background: #ffffff;
	color: #1a1a1a;
	border: 1px solid rgba(0, 0, 0, 0.12);
	border-radius: 999px;
	padding: 9px 14px;
	box-shadow: 0 6px 20px rgba(0, 0, 0, 0.16);
	font-size: 14px;
}

@media (max-width: 480px) {
	.ohmwc-float {
		right: 10px;
		top: 10px;
		font-size: 13px;
		padding: 7px 10px;
	}
}

@media print {
	.ohmwc-float {
		display: none;
	}
}