/**
 * Inmotech sort buttons — FlameWP-like toolbar (not a dropdown).
 * GET param remains `order` (last_date_desc|last_date_asc|list_price_asc|list_price_desc).
 */

.inmotech-sort-wrap {
	width: 100%;
	margin: 0 0 1rem;
}

.inmotech-order-form,
.inmotech-sort,
.inmotech-sort * {
	font-family: "Montserrat", sans-serif !important;
	box-sizing: border-box;
}

form.ro_order.inmotech-order-form,
form.inmotech-order-form {
	display: flex;
	justify-content: flex-end;
	align-items: center;
	width: 100%;
	max-width: 100%;
	margin: 0;
	padding: 0;
	border: 0;
	background: transparent;
}

.inmotech-sort {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: flex-end;
	gap: 6px 14px;
	width: 100%;
}

.inmotech-sort__label {
	color: #062b3d;
	font-size: 13px;
	font-weight: 600;
	letter-spacing: 0.02em;
	line-height: 1.2;
	white-space: nowrap;
}

.inmotech-sort__button {
	appearance: none;
	-webkit-appearance: none;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	margin: 0;
	padding: 2px 0;
	border: 0;
	border-radius: 0;
	background: transparent;
	color: #062b3d;
	font-size: 13px;
	font-weight: 500;
	line-height: 1.3;
	letter-spacing: 0.01em;
	cursor: pointer;
	text-decoration: none;
	box-shadow: none;
}

.inmotech-sort__button:hover {
	color: #062b3d;
	text-decoration: underline;
	background: transparent;
}

.inmotech-sort__button:focus {
	outline: none;
}

.inmotech-sort__button:focus-visible {
	outline: 2px solid #062b3d;
	outline-offset: 3px;
}

.inmotech-sort__button.is-active,
.inmotech-sort__button[aria-pressed="true"] {
	color: #062b3d;
	font-weight: 600;
	text-decoration: underline;
	background: transparent;
	border: 0;
}

/* Native select kept for GET submit — never visible */
.inmotech-sort__native,
form.inmotech-order-form select[name="order"],
form.ro_order.inmotech-order-form select[name="order"],
.inmotech-sort-wrap select[name="order"] {
	position: absolute !important;
	width: 1px !important;
	height: 1px !important;
	padding: 0 !important;
	margin: -1px !important;
	overflow: hidden !important;
	clip: rect(0, 0, 0, 0) !important;
	white-space: nowrap !important;
	border: 0 !important;
	opacity: 0 !important;
	pointer-events: none !important;
}

@media (max-width: 782px) {
	.inmotech-sort {
		justify-content: flex-start;
		gap: 8px 12px;
	}

	.inmotech-sort__label {
		width: 100%;
		margin: 0 0 2px;
	}
}
