/* WooCommerce Radio Variations — clean pill-style radio buttons */

.wcrv-visually-hidden {
	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;
}

.wcrv-radio-group {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin: 4px 0 8px;
}

.wcrv-radio-option {
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 56px;
	padding: 10px 18px;
	border: 1.5px solid #d5d8dc;
	border-radius: 8px;
	background: #fff;
	color: #333;
	font-size: 14px;
	font-weight: 500;
	line-height: 1.2;
	cursor: pointer;
	user-select: none;
	transition: border-color 0.15s ease, background-color 0.15s ease, color 0.15s ease, box-shadow 0.15s ease;
}

.wcrv-radio-option:hover {
	border-color: #9aa0a6;
}

.wcrv-radio-input {
	position: absolute;
	opacity: 0;
	width: 0;
	height: 0;
	pointer-events: none;
}

/* Checked state */
.wcrv-radio-option:has(.wcrv-radio-input:checked) {
	border-color: #1f2937;
	background: #1f2937;
	color: #fff;
}

/* Fallback for browsers without :has() support */
.wcrv-radio-input:checked + .wcrv-radio-label {
	font-weight: 600;
}

/* Keyboard focus */
.wcrv-radio-input:focus-visible + .wcrv-radio-label,
.wcrv-radio-option:has(.wcrv-radio-input:focus-visible) {
	box-shadow: 0 0 0 2px #fff, 0 0 0 4px #1f2937;
}

/* Disabled / out-of-stock options */
.wcrv-radio-option.wcrv-disabled {
	opacity: 0.4;
	cursor: not-allowed;
	background: repeating-linear-gradient(
		-45deg,
		#f5f5f5,
		#f5f5f5 4px,
		#ececec 4px,
		#ececec 8px
	);
}

.wcrv-radio-option.wcrv-disabled .wcrv-radio-input {
	pointer-events: none;
}

.wcrv-radio-label {
	pointer-events: none;
}

/* Small screens: let pills wrap and shrink padding a touch */
@media (max-width: 480px) {
	.wcrv-radio-option {
		padding: 8px 14px;
		font-size: 13.5px;
	}
}
