@enact/sandstone/FormCheckboxItem/FormCheckboxItem.module.css

Large-screen/TV support library for Enact, containing a variety of UI components.

.formCheckboxItem.hasSlotBefore .checkbox {
  margin-inline-end: 0.625rem;
}
.formCheckboxItem:global(.largeText) {
  font-size: 1.25rem;
  line-height: 1.3em;
}
:global(.enact-locale-km) .formCheckboxItem:global(.largeText) {
  line-height: 1.5em;
}
:global(.enact-locale-si) .formCheckboxItem:global(.largeText) {
  line-height: 1.5em;
}
:global(.enact-locale-th) .formCheckboxItem:global(.largeText) {
  line-height: 1.5em;
}
:global(.enact-locale-vi) .formCheckboxItem:global(.largeText) {
  line-height: 1.5em;
}
:global(.spotlight-input-key) .item:global(.neutral):global(.spottable):focus,
:global(.spotlight-input-mouse) .item:global(.neutral):global(.spottable):focus {
  color: var(--sand-formcheckboxitem-focus-text-color, var(--sand-focus-text-color, #ffffff));
}
:global(.spotlight-input-key) .item:global(.neutral):global(.spottable):focus .bg,
:global(.spotlight-input-mouse) .item:global(.neutral):global(.spottable):focus .bg {
  background-color: transparent;
  opacity: 0;
}
:global(.spotlight-input-key) .item:global(.neutral):global(.spottable):focus[disabled],
:global(.spotlight-input-mouse) .item:global(.neutral):global(.spottable):focus[disabled] {
  color: inherit;
}
:global(.spotlight-input-key) .item:global(.neutral):global(.spottable):focus[disabled] .bg,
:global(.spotlight-input-mouse) .item:global(.neutral):global(.spottable):focus[disabled] .bg {
  opacity: 0;
}
:global(.spotlight-input-key) .item:global(.neutral):global(.spottable):focus[disabled] .slotBefore,
:global(.spotlight-input-mouse) .item:global(.neutral):global(.spottable):focus[disabled] .slotBefore {
  opacity: initial;
}
:global(.spotlight-input-key) .item:global(.neutral):global(.spottable):focus[disabled].hasSlotBefore .slotBefore > :last-child,
:global(.spotlight-input-mouse) .item:global(.neutral):global(.spottable):focus[disabled].hasSlotBefore .slotBefore > :last-child {
  opacity: 0.4;
}
:global(.spotlight-input-touch) .item:global(.neutral):global(.spottable):active {
  color: var(--sand-formcheckboxitem-focus-text-color, var(--sand-focus-text-color, #ffffff));
}
:global(.spotlight-input-touch) .item:global(.neutral):global(.spottable):active .bg {
  background-color: transparent;
  opacity: 0;
}
:global(.spotlight-input-touch) .item:global(.neutral):global(.spottable):active[disabled] {
  color: inherit;
}
:global(.spotlight-input-touch) .item:global(.neutral):global(.spottable):active[disabled] .bg {
  opacity: 0;
}
:global(.spotlight-input-touch) .item:global(.neutral):global(.spottable):active[disabled] .slotBefore {
  opacity: initial;
}
:global(.spotlight-input-touch) .item:global(.neutral):global(.spottable):active[disabled].hasSlotBefore .slotBefore > :last-child {
  opacity: 0.4;
}
.item:global(.neutral)[disabled] {
  color: inherit;
}
:global(.spotlight-input-key) :global(.enact-a11y-high-contrast) .item:global(.neutral):global(.highContrast):global(.spottable):focus,
:global(.spotlight-input-mouse) :global(.enact-a11y-high-contrast) .item:global(.neutral):global(.highContrast):global(.spottable):focus {
  color: var(--sand-formcheckboxitem-focus-text-color, var(--sand-focus-text-color, #ffffff));
}
:global(.spotlight-input-key) :global(.enact-a11y-high-contrast) .item:global(.neutral):global(.highContrast):global(.spottable):focus .bg,
:global(.spotlight-input-mouse) :global(.enact-a11y-high-contrast) .item:global(.neutral):global(.highContrast):global(.spottable):focus .bg {
  background-color: transparent;
  opacity: 0;
}
:global(.spotlight-input-key) :global(.enact-a11y-high-contrast) .item:global(.neutral):global(.highContrast):global(.spottable):focus[disabled],
:global(.spotlight-input-mouse) :global(.enact-a11y-high-contrast) .item:global(.neutral):global(.highContrast):global(.spottable):focus[disabled] {
  color: inherit;
}
:global(.spotlight-input-key) :global(.enact-a11y-high-contrast) .item:global(.neutral):global(.highContrast):global(.spottable):focus[disabled] .bg,
:global(.spotlight-input-mouse) :global(.enact-a11y-high-contrast) .item:global(.neutral):global(.highContrast):global(.spottable):focus[disabled] .bg {
  opacity: 0;
}
:global(.spotlight-input-key) :global(.enact-a11y-high-contrast) .item:global(.neutral):global(.highContrast):global(.spottable):focus[disabled] .slotBefore,
:global(.spotlight-input-mouse) :global(.enact-a11y-high-contrast) .item:global(.neutral):global(.highContrast):global(.spottable):focus[disabled] .slotBefore {
  opacity: initial;
}
:global(.spotlight-input-key) :global(.enact-a11y-high-contrast) .item:global(.neutral):global(.highContrast):global(.spottable):focus[disabled].hasSlotBefore .slotBefore > :last-child,
:global(.spotlight-input-mouse) :global(.enact-a11y-high-contrast) .item:global(.neutral):global(.highContrast):global(.spottable):focus[disabled].hasSlotBefore .slotBefore > :last-child {
  opacity: 0.4;
}
:global(.spotlight-input-touch) :global(.enact-a11y-high-contrast) .item:global(.neutral):global(.highContrast):global(.spottable):active {
  color: var(--sand-formcheckboxitem-focus-text-color, var(--sand-focus-text-color, #ffffff));
}
:global(.spotlight-input-touch) :global(.enact-a11y-high-contrast) .item:global(.neutral):global(.highContrast):global(.spottable):active .bg {
  background-color: transparent;
  opacity: 0;
}
:global(.spotlight-input-touch) :global(.enact-a11y-high-contrast) .item:global(.neutral):global(.highContrast):global(.spottable):active[disabled] {
  color: inherit;
}
:global(.spotlight-input-touch) :global(.enact-a11y-high-contrast) .item:global(.neutral):global(.highContrast):global(.spottable):active[disabled] .bg {
  opacity: 0;
}
:global(.spotlight-input-touch) :global(.enact-a11y-high-contrast) .item:global(.neutral):global(.highContrast):global(.spottable):active[disabled] .slotBefore {
  opacity: initial;
}
:global(.spotlight-input-touch) :global(.enact-a11y-high-contrast) .item:global(.neutral):global(.highContrast):global(.spottable):active[disabled].hasSlotBefore .slotBefore > :last-child {
  opacity: 0.4;
}
:global(.enact-a11y-high-contrast) .item:global(.neutral):global(.highContrast)[disabled] {
  color: inherit;
}
:global(.spotlight-input-key) .item:global(.light):global(.spottable):focus,
:global(.spotlight-input-mouse) .item:global(.light):global(.spottable):focus {
  color: var(--sand-formcheckboxitem-focus-text-color, var(--sand-focus-text-color, #575e66));
}
:global(.spotlight-input-key) .item:global(.light):global(.spottable):focus .bg,
:global(.spotlight-input-mouse) .item:global(.light):global(.spottable):focus .bg {
  background-color: transparent;
  opacity: 0;
}
:global(.spotlight-input-key) .item:global(.light):global(.spottable):focus[disabled],
:global(.spotlight-input-mouse) .item:global(.light):global(.spottable):focus[disabled] {
  color: inherit;
}
:global(.spotlight-input-key) .item:global(.light):global(.spottable):focus[disabled] .bg,
:global(.spotlight-input-mouse) .item:global(.light):global(.spottable):focus[disabled] .bg {
  opacity: 0;
}
:global(.spotlight-input-key) .item:global(.light):global(.spottable):focus[disabled] .slotBefore,
:global(.spotlight-input-mouse) .item:global(.light):global(.spottable):focus[disabled] .slotBefore {
  opacity: initial;
}
:global(.spotlight-input-key) .item:global(.light):global(.spottable):focus[disabled].hasSlotBefore .slotBefore > :last-child,
:global(.spotlight-input-mouse) .item:global(.light):global(.spottable):focus[disabled].hasSlotBefore .slotBefore > :last-child {
  opacity: 0.4;
}
:global(.spotlight-input-touch) .item:global(.light):global(.spottable):active {
  color: var(--sand-formcheckboxitem-focus-text-color, var(--sand-focus-text-color, #575e66));
}
:global(.spotlight-input-touch) .item:global(.light):global(.spottable):active .bg {
  background-color: transparent;
  opacity: 0;
}
:global(.spotlight-input-touch) .item:global(.light):global(.spottable):active[disabled] {
  color: inherit;
}
:global(.spotlight-input-touch) .item:global(.light):global(.spottable):active[disabled] .bg {
  opacity: 0;
}
:global(.spotlight-input-touch) .item:global(.light):global(.spottable):active[disabled] .slotBefore {
  opacity: initial;
}
:global(.spotlight-input-touch) .item:global(.light):global(.spottable):active[disabled].hasSlotBefore .slotBefore > :last-child {
  opacity: 0.4;
}
.item:global(.light)[disabled] {
  color: inherit;
}
:global(.spotlight-input-key) .item:global(.game):global(.spottable):focus,
:global(.spotlight-input-mouse) .item:global(.game):global(.spottable):focus {
  color: var(--sand-formcheckboxitem-focus-text-color, var(--sand-focus-text-color, #ffffff));
}
:global(.spotlight-input-key) .item:global(.game):global(.spottable):focus .bg,
:global(.spotlight-input-mouse) .item:global(.game):global(.spottable):focus .bg {
  background-color: transparent;
  opacity: 0;
}
:global(.spotlight-input-key) .item:global(.game):global(.spottable):focus[disabled],
:global(.spotlight-input-mouse) .item:global(.game):global(.spottable):focus[disabled] {
  color: inherit;
}
:global(.spotlight-input-key) .item:global(.game):global(.spottable):focus[disabled] .bg,
:global(.spotlight-input-mouse) .item:global(.game):global(.spottable):focus[disabled] .bg {
  opacity: 0;
}
:global(.spotlight-input-key) .item:global(.game):global(.spottable):focus[disabled] .slotBefore,
:global(.spotlight-input-mouse) .item:global(.game):global(.spottable):focus[disabled] .slotBefore {
  opacity: initial;
}
:global(.spotlight-input-key) .item:global(.game):global(.spottable):focus[disabled].hasSlotBefore .slotBefore > :last-child,
:global(.spotlight-input-mouse) .item:global(.game):global(.spottable):focus[disabled].hasSlotBefore .slotBefore > :last-child {
  opacity: 0.4;
}
:global(.spotlight-input-touch) .item:global(.game):global(.spottable):active {
  color: var(--sand-formcheckboxitem-focus-text-color, var(--sand-focus-text-color, #ffffff));
}
:global(.spotlight-input-touch) .item:global(.game):global(.spottable):active .bg {
  background-color: transparent;
  opacity: 0;
}
:global(.spotlight-input-touch) .item:global(.game):global(.spottable):active[disabled] {
  color: inherit;
}
:global(.spotlight-input-touch) .item:global(.game):global(.spottable):active[disabled] .bg {
  opacity: 0;
}
:global(.spotlight-input-touch) .item:global(.game):global(.spottable):active[disabled] .slotBefore {
  opacity: initial;
}
:global(.spotlight-input-touch) .item:global(.game):global(.spottable):active[disabled].hasSlotBefore .slotBefore > :last-child {
  opacity: 0.4;
}
.item:global(.game)[disabled] {
  color: inherit;
}
:global(.spotlight-input-key) :global(.green) .item:global(.game):global(.spottable):focus,
:global(.spotlight-input-mouse) :global(.green) .item:global(.game):global(.spottable):focus {
  color: var(--sand-formcheckboxitem-focus-text-color, var(--sand-focus-text-color, #ffffff));
}
:global(.spotlight-input-key) :global(.green) .item:global(.game):global(.spottable):focus .bg,
:global(.spotlight-input-mouse) :global(.green) .item:global(.game):global(.spottable):focus .bg {
  background-color: transparent;
  opacity: 0;
}
:global(.spotlight-input-key) :global(.green) .item:global(.game):global(.spottable):focus[disabled],
:global(.spotlight-input-mouse) :global(.green) .item:global(.game):global(.spottable):focus[disabled] {
  color: inherit;
}
:global(.spotlight-input-key) :global(.green) .item:global(.game):global(.spottable):focus[disabled] .bg,
:global(.spotlight-input-mouse) :global(.green) .item:global(.game):global(.spottable):focus[disabled] .bg {
  opacity: 0;
}
:global(.spotlight-input-key) :global(.green) .item:global(.game):global(.spottable):focus[disabled] .slotBefore,
:global(.spotlight-input-mouse) :global(.green) .item:global(.game):global(.spottable):focus[disabled] .slotBefore {
  opacity: initial;
}
:global(.spotlight-input-key) :global(.green) .item:global(.game):global(.spottable):focus[disabled].hasSlotBefore .slotBefore > :last-child,
:global(.spotlight-input-mouse) :global(.green) .item:global(.game):global(.spottable):focus[disabled].hasSlotBefore .slotBefore > :last-child {
  opacity: 0.4;
}
:global(.spotlight-input-touch) :global(.green) .item:global(.game):global(.spottable):active {
  color: var(--sand-formcheckboxitem-focus-text-color, var(--sand-focus-text-color, #ffffff));
}
:global(.spotlight-input-touch) :global(.green) .item:global(.game):global(.spottable):active .bg {
  background-color: transparent;
  opacity: 0;
}
:global(.spotlight-input-touch) :global(.green) .item:global(.game):global(.spottable):active[disabled] {
  color: inherit;
}
:global(.spotlight-input-touch) :global(.green) .item:global(.game):global(.spottable):active[disabled] .bg {
  opacity: 0;
}
:global(.spotlight-input-touch) :global(.green) .item:global(.game):global(.spottable):active[disabled] .slotBefore {
  opacity: initial;
}
:global(.spotlight-input-touch) :global(.green) .item:global(.game):global(.spottable):active[disabled].hasSlotBefore .slotBefore > :last-child {
  opacity: 0.4;
}
:global(.green) .item:global(.game)[disabled] {
  color: inherit;
}
:global(.spotlight-input-key) :global(.orange) .item:global(.game):global(.spottable):focus,
:global(.spotlight-input-mouse) :global(.orange) .item:global(.game):global(.spottable):focus {
  color: var(--sand-formcheckboxitem-focus-text-color, var(--sand-focus-text-color, #ffffff));
}
:global(.spotlight-input-key) :global(.orange) .item:global(.game):global(.spottable):focus .bg,
:global(.spotlight-input-mouse) :global(.orange) .item:global(.game):global(.spottable):focus .bg {
  background-color: transparent;
  opacity: 0;
}
:global(.spotlight-input-key) :global(.orange) .item:global(.game):global(.spottable):focus[disabled],
:global(.spotlight-input-mouse) :global(.orange) .item:global(.game):global(.spottable):focus[disabled] {
  color: inherit;
}
:global(.spotlight-input-key) :global(.orange) .item:global(.game):global(.spottable):focus[disabled] .bg,
:global(.spotlight-input-mouse) :global(.orange) .item:global(.game):global(.spottable):focus[disabled] .bg {
  opacity: 0;
}
:global(.spotlight-input-key) :global(.orange) .item:global(.game):global(.spottable):focus[disabled] .slotBefore,
:global(.spotlight-input-mouse) :global(.orange) .item:global(.game):global(.spottable):focus[disabled] .slotBefore {
  opacity: initial;
}
:global(.spotlight-input-key) :global(.orange) .item:global(.game):global(.spottable):focus[disabled].hasSlotBefore .slotBefore > :last-child,
:global(.spotlight-input-mouse) :global(.orange) .item:global(.game):global(.spottable):focus[disabled].hasSlotBefore .slotBefore > :last-child {
  opacity: 0.4;
}
:global(.spotlight-input-touch) :global(.orange) .item:global(.game):global(.spottable):active {
  color: var(--sand-formcheckboxitem-focus-text-color, var(--sand-focus-text-color, #ffffff));
}
:global(.spotlight-input-touch) :global(.orange) .item:global(.game):global(.spottable):active .bg {
  background-color: transparent;
  opacity: 0;
}
:global(.spotlight-input-touch) :global(.orange) .item:global(.game):global(.spottable):active[disabled] {
  color: inherit;
}
:global(.spotlight-input-touch) :global(.orange) .item:global(.game):global(.spottable):active[disabled] .bg {
  opacity: 0;
}
:global(.spotlight-input-touch) :global(.orange) .item:global(.game):global(.spottable):active[disabled] .slotBefore {
  opacity: initial;
}
:global(.spotlight-input-touch) :global(.orange) .item:global(.game):global(.spottable):active[disabled].hasSlotBefore .slotBefore > :last-child {
  opacity: 0.4;
}
:global(.orange) .item:global(.game)[disabled] {
  color: inherit;
}