/* === Checkbox Group Wrapper === */
.boows-checkbox-group {
  display: flex;
  flex-direction: column;
  gap: var(--boows-space-1);
  font-family: var(--boows-font);
}

/* === Einzelne Checkbox === */
.boows-checkbox-container,
.boows-cb-container {
  position: relative;
  display: flex;
  align-items: center;
  cursor: pointer;
  font-size: var(--boows-font-size-base);
  line-height: 1.4;
  color: var(--boows-col-text);
  user-select: none;
  padding-left: 1.75rem; /* Platz für Custom Box */
  transition: color var(--boows-transition);
}

/* === Verstecktes Input === */
.boows-checkbox-container input[type="checkbox"],
.boows-cb-container input[type="checkbox"] {
  position: absolute;
  opacity: 0;
  cursor: pointer;
  height: 0;
  width: 0;
}

/* === Custom Box === */
.boows-checkbox-checkmark,
.boows-cb-checkmark {
  position: absolute;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
  height: 1rem;
  width: 1rem;
  border-radius: var(--boows-radius-sm, 4px);
  border: 2px solid var(--boows-input-border, #ccc);
  background: #fff;
  transition: border var(--boows-transition), background var(--boows-transition), box-shadow var(--boows-transition);
}

/* Hover */
.boows-checkbox-container:hover .boows-checkbox-checkmark,
.boows-cb-container:hover .boows-cb-checkmark {
  border-color: var(--boows-col-primary);
}

/* Aktiv (checked) */
.boows-checkbox-container input:checked ~ .boows-checkbox-checkmark,
.boows-cb-container input:checked ~ .boows-cb-checkmark {
  background: var(--boows-col-primary);
  border-color: var(--boows-col-primary);
}

/* Checkmark Symbol */
.boows-checkbox-container .boows-checkbox-checkmark::after,
.boows-cb-container .boows-cb-checkmark::after {
  content: "";
  position: absolute;
  display: none;
}

.boows-checkbox-container input:checked ~ .boows-checkbox-checkmark::after,
.boows-cb-container input:checked ~ .boows-cb-checkmark::after {
  display: block;
  left: 0.25rem;
  top: 0.05rem;
  width: 0.25rem;
  height: 0.5rem;
  border: solid #fff;
  border-width: 0 0.15rem 0.15rem 0;
  transform: rotate(45deg);
}

/* Fokus */
.boows-checkbox-container input:focus ~ .boows-checkbox-checkmark,
.boows-cb-container input:focus ~ .boows-cb-checkmark {
  box-shadow: 0 0 0 0.2rem rgba(var(--boows-col-primary-rgb), 0.25);
}

/* Disabled */
.boows-checkbox-container input:disabled ~ .boows-checkbox-checkmark,
.boows-cb-container input:disabled ~ .boows-cb-checkmark {
  background: var(--boows-col-bg);
  border-color: var(--boows-col-text-40);
  cursor: not-allowed;
}
.boows-checkbox-container input:disabled ~ .checkbox-title,
.boows-cb-container input:disabled ~ .cb-title {
  color: var(--boows-col-text-60);
  cursor: not-allowed;
}

/* Titeltext */
.checkbox-title,
.cb-title {
  font-size: var(--boows-font-size-base);
  margin-left: var(--boows-space-1);
  line-height: 1.2;
}

/* Helper Text */
.boows-forms-helper-text {
  font-size: 0.875rem;
  color: var(--boows-col-text-60, #666);
  margin-top: 0.5rem;
  line-height: 1.4;
  padding-left: 1.75rem;
}