.checkbox-input {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  margin: 0;
  opacity: 0;
  z-index: var(--z-index-above-content);
  cursor: pointer;
}

.checkbox-input:disabled {
  cursor: var(--cursor-not-allowed);
}

.checkbox-input:checked+ .checkbox-icon::before {
  opacity: 1 !important;
  transform: translate(-50%, -60%) rotate(45deg) scale(1) !important;
}

.checkbox-input:indeterminate+ .checkbox-icon::before {
  opacity: 1 !important;
  transform: translate(-50%, -50%) scale(1) !important;
}

.checkbox-input:checked+ .checkbox-icon {
  background-color: var(--background-color-input-binary-checked) !important;
  border-color: var(--border-color-input-binary-checked) !important;
}

.checkbox-input:checked:disabled+ .checkbox-icon {
  background-color: var(--background-color-disabled-subtle) !important;
  border-color: var(--border-color-disabled) !important;
}

.checkbox-input:checked:disabled+ .checkbox-icon::before {
  border-right-color: var(--color-disabled) !important;
  border-bottom-color: var(--color-disabled) !important;
}

.checkbox-input:indeterminate:disabled+ .checkbox-icon::before {
  background-color: var(--background-color-disabled-subtle) !important;
}

.checkbox-input:focus-visible+ .checkbox-icon {
  border-color: var(--border-color-input-binary-focus) !important;
  outline: var(--border-width-base) solid var(--border-color-blue-focus) !important;
  outline-offset: 0px !important;
}

.checkbox-input:enabled:hover+ .checkbox-icon {
  border-color: var(--border-color-input-binary) !important;
}

.checkbox-input:enabled:hover:checked+ .checkbox-icon {
  background-color: var(--background-color-input-binary-checked) !important;
  border-color: var(--border-color-input-binary-checked-hover) !important;
}

.checkbox-input:enabled:active+ .checkbox-icon {
  background-color: var(--background-color-input-binary-checked) !important;
  border-color: var(--border-color-input-binary) !important;
}

.checkbox-input:enabled:active:checked+ .checkbox-icon {
  background-color: var(--background-color-input-binary-checked) !important;
  border-color: var(--border-color-input-binary-checked-active) !important;
}

.checkbox-icon {
  display: inline-block;
  position: relative;
  pointer-events: none;
  width: var(--min-size-input-binary);
  height: var(--min-size-input-binary);
  border-radius: var(--border-radius-minimal);
  flex-shrink: 0;
  background-color: var(--background-color-base);
  border: var(--border-width-base) solid var(--border-color-input-binary);
}

.checkbox-icon[data-disabled='true'] {
  background-color: var(--background-color-disabled-subtle);
  border-color: var(--border-color-disabled);
}

.checkbox-icon[data-disabled='false'][data-status='error'] {
  border-color: var(--border-color-red);
}

.checkbox-icon::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  pointer-events: none;
  opacity: 0;
}

.checkbox-icon[data-indeterminate='true']::before {
  width: 10px;
  height: 2px;
  background-color: var(--color-on-solid);
  transform: translate(-50%, -50%) scale(1);
}

.checkbox-icon[data-indeterminate='false']::before {
  width: 5px;
  height: 10px;
  border-right: 2px solid var(--color-on-solid);
  border-bottom: 2px solid var(--color-on-solid);
  transform: translate(-50%, -60%) rotate(45deg) scale(1);
}

.checkbox-icon-wrapper {
  display: inline-flex;
  position: relative;
  vertical-align: middle;
}

.checkbox-view {
  display: flex;
  align-items: center;
  position: relative;
}

.checkbox-view[data-inline='true'] {
  display: inline-flex;
}

.checkbox-view[data-inline='false'] {
  min-height: var(--min-size-input-binary);
  margin-block-end: var(--spacing-8);
}

.checkbox-view[data-hide-label='true'][data-has-after-label='false'] {
  justify-content: center;
}

.checkbox-view:not([data-hide-label='true']), .checkbox-view[data-has-after-label='true'] {
  gap: var(--spacing-8);
}

.checkbox-view[data-inline='true']:not([data-hide-label='true']), .checkbox-view[data-inline='true'][data-has-after-label='true'] {
  margin-inline-end: var(--spacing-16);
}

.checkbox-view[data-inline='true']:last-child {
  margin-inline-end: 0 !important;
}

.checkbox-view[data-inline='false']:last-child {
  margin-block-end: 0 !important;
}