Selected checkbox in a disabled checkbox group has the wrong fill color

[LFDanLu]

Provide a general summary of the issue here

The fill color for a selected checkbox in a disabled checkbox group has the wrong fill color, see below.

🤔 Expected Behavior?

😯 Current Behavior

Current:

💁 Possible Solution

The css for

react-spectrum/packages/@adobe/spectrum-css-temp/components/checkbox/skin.css

Lines 98 to 106 in 6c61f5b

	.spectrum-Checkbox-input,
	.spectrum-Checkbox-input:checked {
	&:disabled + .spectrum-Checkbox-box,
	&:disabled:active + .spectrum-Checkbox-box {
	&:before {
	border-color: var(--spectrum-checkbox-emphasized-box-border-color-disabled);
	background-color: var(--spectrum-checkbox-emphasized-box-background-color-disabled);
	}
	}

should win over

react-spectrum/packages/@adobe/spectrum-css-temp/components/checkbox/skin.css

Lines 185 to 192 in 6c61f5b

	&.spectrum-Checkbox--quiet {
	.spectrum-Checkbox-input:checked + .spectrum-Checkbox-box,
	&.is-indeterminate .spectrum-Checkbox-box,
	&.is-indeterminate .spectrum-Checkbox-input:focus-visible + .spectrum-Checkbox-box {
	&:before {
	border-color: var(--spectrum-checkbox-quiet-box-border-color-selected);
	}
	}

🔦 Context

No response

🖥️ Steps to Reproduce

See https://reactspectrum.blob.core.windows.net/reactspectrum/6c61f5b1db5f52ebc654bf754a15594bb0662f6f/storybook/index.html?path=/story/checkboxgroup--controlled-value&args=isDisabled:true&providerSwitcher-express=false

Version

3.31

What browsers are you seeing the problem on?

Firefox, Chrome, Safari, Microsoft Edge

If other, please specify.

No response

What operating system are you using?

MacOS 14.1

🧢 Your Company/Team

Adobe Admin Experience

🕷 Tracking Issue

No response