.nch-checkbox {
  display: flex;
  width: 100%;
  padding: 12px 20px;
  align-items: center;
  border-radius: 8px;
  border: 1px solid rgba(255, 255, 255, 0.10);
  background: rgba(255, 255, 255, 0.05);
  cursor: pointer;
  transition: all 0.3s ease;
  user-select: none;
}

.nch-checkbox .nch-checkbox__icon {
  margin-right: 20px;
  transition: opacity 0.3s ease, transform 0.3s ease;
}

.nch-checkbox .nch-checkbox__icon.nch-checkbox__icon__normal {
  display: block;
}

.nch-checkbox .nch-checkbox__icon.nch-checkbox__icon__selected {
  display: none;
}

.nch-checkbox .nch-checkbox__toggle-on {
  display: block;
}

.nch-checkbox .nch-checkbox__toggle-off {
  display: none;
}

/* Checked state */
.nch-checkbox.checked .nch-checkbox__icon.nch-checkbox__icon__normal {
  display: block;
}

.nch-checkbox.checked .nch-checkbox__icon.nch-checkbox__icon__selected {
  display: none;
}

.nch-checkbox .nch-checkbox__text {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
  line-clamp: 1;
  flex: 1 0 0;
  overflow: hidden;
  color: var(--7A8E96, #7A8E96);
  text-overflow: ellipsis;
  font-family: Inter;
  font-size: 12px;
  font-style: normal;
  font-weight: 700;
  line-height: normal;
  text-transform: uppercase;
  transition: color 0.3s ease;
}

.nch-checkbox.checked .nch-checkbox__text {
  color: var(--White, #FFF);
}


/* Toggle switch styling for checkbox */
.nch-dropdown__checkbox {
  position: relative;
  width: 40px;
  height: 24px;
  background: rgba(255, 255, 255, 0.1);
  border-radius: 12px;
  border: 1px solid rgba(255, 255, 255, 0.2);
  cursor: pointer;
  transition: all 0.3s ease;
  margin-left: 8px;
}

.nch-dropdown__checkbox-inner {
  position: absolute;
  top: 2px;
  left: 2px;
  width: 18px;
  height: 18px;
  background: rgba(255, 255, 255, 0.6);
  border-radius: 50%;
  transition: all 0.3s ease;
  transform: translateX(0);
}

/* Active/selected state */
.nch-checkbox.checked .nch-dropdown__checkbox {
  background: #6FB622;
  border-color: #6FB622;
}

.nch-checkbox.checked .nch-dropdown__checkbox-inner {
  background: #fff;
  transform: translateX(16px);
}