/*INPUTS*/

input[type="text"],
input[type="date"],
select {
  background-color: var(--color-black) !important;
  border-radius: 2px !important;;
  border-color: var(--color-black-300) !important;;
  color: white !important;;
}

.form-pda .form-item__label,
.form-pda .form-item__description,
.form-pda .fieldset__description,
.form-pda .fieldset__label,
.form-pda .description {
  display: none;
}

.form-pda .form-item {
  padding: unset;
  margin: unset;
}

/*DATE*/
.form-pda .form-pda-date .js-form-item {
  width: 100%;
}

.form-pda .form-pda-date .js-form-item input {
  width: 100%;
}

/*TEXTAREA*/
.form-pda .form-pda-textarea textarea {
  background-color: var(--color-black) !important;
  border-radius: 2px !important;;
  border-color: var(--color-black-300) !important;;
  color: white;
}

/* CHECKBOXES */
.form-pda .form-pda-checkboxes {
  display: flex;
  flex-wrap: wrap;
}

.form-pda .form-pda-checkboxes .form-type-checkbox {
  position: relative;
  display: inline-block;
  margin: unset !important;
}

.form-pda .form-pda-checkboxes .form-type-checkbox input[type="checkbox"] {
  position: absolute;
  opacity: 0;
  cursor: pointer;
  height: 0;
  width: 0;
}

.form-pda .form-pda-checkboxes .form-type-checkbox label.option {
  display: inline-block;
  padding: 5px 10px;
  background-color: #1a1a1a;
  color: #898A7E;
  border: 1px solid;
  border-color: var(--color-black-300) !important;
  border-radius: 2px;
  cursor: pointer;
  transition: all 0.2s ease;
  user-select: none;
  white-space: nowrap;
}

.form-pda .form-pda-checkboxes .form-type-checkbox label.option:hover {
  border-color: #666;
  background-color: #222;
}

.form-pda .form-pda-checkboxes .form-type-checkbox:has(input:checked) label.option,
.form-pda .form-pda-checkboxes .form-type-checkbox input:checked ~ .pb-3 label.option,
.form-pda .form-pda-checkboxes .form-type-checkbox input:checked + label.option {
  border-color: var(--color-black-300) !important;
  background-color: var(--color-black-300);
  color: white !important;
}

.form-pda .form-pda-checkboxes .form-item__label {
  margin: 4px;
}