.tree {
  overflow-y: auto;
  appearance: none;
  padding: var(--pico-form-element-spacing-vertical) var(--pico-form-element-spacing-horizontal);
  --pico-background-color: var(--pico-form-element-background-color);
  --pico-border-color: var(--pico-form-element-border-color);
  --pico-color: var(--pico-form-element-color);
  --pico-box-shadow: none;
  border: var(--pico-border-width) solid var(--pico-border-color);
  border-radius: var(--pico-border-radius);
  outline: 0;
  background-color: var(--pico-background-color);
  box-shadow: var(--pico-box-shadow);
  color: var(--pico-color);
  font-weight: var(--pico-font-weight);
  transition: background-color var(--pico-transition), border-color var(--pico-transition), color var(--pico-transition), box-shadow var(--pico-transition);
}

.tree-item {
  color: var(--pico-primary);
}

.tree-item > input[type=radio] {
  display: none;
}

.tree-item > input[type=radio] + label {
  padding: 0px 10px 3px 10px;
  border: var(--pico-border-width) none var(--pico-primary-border);
}

.tree-item > input[type=radio]:checked + label {
  background-color: var(--pico-primary);
  color: var(--pico-primary-inverse);
  border-radius: var(--pico-border-radius);
  border: var(--pico-border-width) solid var(--pico-primary-border);
  padding: calc(0px - var(--pico-border-width)) calc(10px - var(--pico-border-width)) calc(-3px - var(--pico-border-width)) calc(10px - var(--pico-border-width));
}
