@layer clickui {/* The wrapper class is applied alongside FormRoot's styled-components class.
   The .wrapper.wrapper double-class boost matches the specificity behavior of
   the original `styled(FormRoot)` chain so these overrides reliably beat
   FormRoot's `align-items: flex-start` regardless of stylesheet insertion
   order between CSS Modules and the runtime-injected styled-components. */
.wrapper__rpthW.wrapper__rpthW {
  /* stylelint-disable-next-line plugin/no-unsupported-browser-features -- `fit-content`
     keyword on `max-width` is widely supported on evergreen browsers; the original
     styled-components rule used the same value. */
  max-width: fit-content;
  align-items: center;
}

.checkinput__oErG6 {
  display: flex;
  width: var(--click-checkbox-size-all);
  height: var(--click-checkbox-size-all);
  flex-shrink: 0;
  justify-content: center;
  align-items: center;
  border: 1px solid var(--checkbox-stroke-default);
  border-radius: var(--click-checkbox-radii-all);
  background: var(--checkbox-bg-default);
  cursor: pointer;
}

.checkinput_variant_default__7KgZ1 {
  --checkbox-bg-default: var(--click-checkbox-color-variations-default-background-default);
  --checkbox-bg-hover: var(--click-checkbox-color-variations-default-background-hover);
  --checkbox-bg-active: var(--click-checkbox-color-variations-default-background-active);
  --checkbox-stroke-default: var(--click-checkbox-color-variations-default-stroke-default);
  --checkbox-stroke-active: var(--click-checkbox-color-variations-default-stroke-active);
}

.checkinput_variant_var1__dF7nF {
  --checkbox-bg-default: var(--click-checkbox-color-variations-var1-background-default);
  --checkbox-bg-hover: var(--click-checkbox-color-variations-var1-background-hover);
  --checkbox-bg-active: var(--click-checkbox-color-variations-var1-background-active);
  --checkbox-stroke-default: var(--click-checkbox-color-variations-var1-stroke-default);
  --checkbox-stroke-active: var(--click-checkbox-color-variations-var1-stroke-active);
}

.checkinput_variant_var2__pHifP {
  --checkbox-bg-default: var(--click-checkbox-color-variations-var2-background-default);
  --checkbox-bg-hover: var(--click-checkbox-color-variations-var2-background-hover);
  --checkbox-bg-active: var(--click-checkbox-color-variations-var2-background-active);
  --checkbox-stroke-default: var(--click-checkbox-color-variations-var2-stroke-default);
  --checkbox-stroke-active: var(--click-checkbox-color-variations-var2-stroke-active);
}

.checkinput_variant_var3__8KFg4 {
  --checkbox-bg-default: var(--click-checkbox-color-variations-var3-background-default);
  --checkbox-bg-hover: var(--click-checkbox-color-variations-var3-background-hover);
  --checkbox-bg-active: var(--click-checkbox-color-variations-var3-background-active);
  --checkbox-stroke-default: var(--click-checkbox-color-variations-var3-stroke-default);
  --checkbox-stroke-active: var(--click-checkbox-color-variations-var3-stroke-active);
}

.checkinput_variant_var4__-C02i {
  --checkbox-bg-default: var(--click-checkbox-color-variations-var4-background-default);
  --checkbox-bg-hover: var(--click-checkbox-color-variations-var4-background-hover);
  --checkbox-bg-active: var(--click-checkbox-color-variations-var4-background-active);
  --checkbox-stroke-default: var(--click-checkbox-color-variations-var4-stroke-default);
  --checkbox-stroke-active: var(--click-checkbox-color-variations-var4-stroke-active);
}

.checkinput_variant_var5__DuiuL {
  --checkbox-bg-default: var(--click-checkbox-color-variations-var5-background-default);
  --checkbox-bg-hover: var(--click-checkbox-color-variations-var5-background-hover);
  --checkbox-bg-active: var(--click-checkbox-color-variations-var5-background-active);
  --checkbox-stroke-default: var(--click-checkbox-color-variations-var5-stroke-default);
  --checkbox-stroke-active: var(--click-checkbox-color-variations-var5-stroke-active);
}

.checkinput_variant_var6__DqZFO {
  --checkbox-bg-default: var(--click-checkbox-color-variations-var6-background-default);
  --checkbox-bg-hover: var(--click-checkbox-color-variations-var6-background-hover);
  --checkbox-bg-active: var(--click-checkbox-color-variations-var6-background-active);
  --checkbox-stroke-default: var(--click-checkbox-color-variations-var6-stroke-default);
  --checkbox-stroke-active: var(--click-checkbox-color-variations-var6-stroke-active);
}

.checkinput_variant_var7__5tG25 {
  --checkbox-bg-default: var(--click-checkbox-color-variations-var7-background-default);
  --checkbox-bg-hover: var(--click-checkbox-color-variations-var7-background-hover);
  --checkbox-bg-active: var(--click-checkbox-color-variations-var7-background-active);
  --checkbox-stroke-default: var(--click-checkbox-color-variations-var7-stroke-default);
  --checkbox-stroke-active: var(--click-checkbox-color-variations-var7-stroke-active);
}

.checkinput__oErG6:hover {
  background: var(--checkbox-bg-hover);
}

.checkinput__oErG6[data-state='checked'],
.checkinput__oErG6[data-state='indeterminate'] {
  border-color: var(--checkbox-stroke-active);
  background: var(--checkbox-bg-active);
}

/* stylelint-disable no-descending-specificity -- disabled state intentionally
   defined after checked/indeterminate to mirror the source cascade order;
   matches the styled-components rule which used a nested `&[data-disabled]`
   block placed after the state selectors. */
.checkinput__oErG6[data-disabled] {
  border-color: var(--click-checkbox-color-stroke-disabled);
  background: var(--click-checkbox-color-background-disabled);
  cursor: not-allowed;
}

.checkinput__oErG6[data-disabled][data-state='checked'],
.checkinput__oErG6[data-disabled][data-state='indeterminate'] {
  border-color: var(--click-checkbox-color-stroke-disabled);
  background: var(--click-checkbox-color-background-disabled);
}
/* stylelint-enable no-descending-specificity */

.checkicon__wvW5M {
  color: var(--click-checkbox-color-check-active);
}

.checkicon__wvW5M[data-disabled] {
  color: var(--click-checkbox-color-check-disabled);
}
}