.pdp-atc-selector .pdp-atc-selector__container {
	display: flex;
	flex-direction: column;
	row-gap: 1.5rem;
}

.pdp-atc-selector h3,
.pdp-atc-selector label {
	display: block;
	margin-bottom: 0.5rem;
	font-size: 16px;
	font-weight: 500;
	line-height: 20px;
}

.pdp-atc-selector .pdp-atc-selector__select {
	column-gap: 0.5rem;
	column-gap: 0.5rem;
	display: flex;
	flex-wrap: wrap;
	row-gap: 0.5rem;
	width: 100%;
}

.pdp-atc-selector .pdp-atc-selector__select a[role='link'],
.pdp-atc-selector .pdp-atc-selector__select button {
	--tw-border-opacity: 1;
	--tw-text-opacity: 1;

	padding: 0.75rem 1.25rem;
	border-width: 1px;
	border-color: rgb(225 225 225 / var(--tw-border-opacity, 1));
	font-size: 14px;
	font-weight: 700;
	line-height: 20px;
	color: rgb(5 1 17 / var(--tw-text-opacity, 1));
	border-radius: 0.25rem;
	transition-duration: 0.3s;
	transition-property: all;
	transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
}

.pdp-atc-selector .pdp-atc-selector__select a[role='link']:hover,
.pdp-atc-selector .pdp-atc-selector__select button:hover {
	--tw-bg-opacity: 1;
	--tw-text-opacity: 1;

	background-color: rgb(5 1 17 / var(--tw-bg-opacity, 1));
	color: rgb(255 255 255 / var(--tw-text-opacity, 1));
}

@media (min-width: 768px) {
	.pdp-atc-selector .pdp-atc-selector__select a[role='link'],
	.pdp-atc-selector .pdp-atc-selector__select button {
		font-size: 16px;
		line-height: 20px;
	}
}

.pdp-atc-selector .pdp-atc-selector__select a[role='link'].is-selected,
.pdp-atc-selector .pdp-atc-selector__select button.is-selected {
	--tw-border-opacity: 1;
	--tw-bg-opacity: 1;
	--tw-text-opacity: 1;

	border-color: rgb(5 1 17 / var(--tw-border-opacity, 1));
	background-color: rgb(5 1 17 / var(--tw-bg-opacity, 1));
	color: rgb(255 255 255 / var(--tw-text-opacity, 1));
}
