.pp-widgets-accordion {
  --accordion__gap: 0.5rem;
  --accordion__padding: 0.9rem 0;
  --accordion__border-color: var(--v-color__border);
  --accordion__icon-size: 1.4rem;
  --accordion__icon-color: var(--v-color__2--alt1);
  --accordion__transition: 0.3s ease;
}

.pp-widgets-accordion__item {
  border-bottom: 1px solid var(--accordion__border-color);
}

.pp-widgets-accordion__item:first-child {
  border-top: 1px solid var(--accordion__border-color);
}

.pp-widgets-accordion__header {
  display: flex;
  align-items: center;
  gap: var(--accordion__gap);
  width: 100%;

  padding: var(--accordion__padding);
  border: 0;
  background: none;
  cursor: pointer;

  color: inherit;
  font: inherit;
  font-weight: var(--v-font-weight__default--bold);
  text-align: left;
}

.pp-widgets-accordion__icon {
  flex: 0 0 auto;
  width: var(--accordion__icon-size);

  color: var(--accordion__icon-color);
  font-size: var(--accordion__icon-size);
  line-height: 1;
  text-align: center;
}

.pp-widgets-accordion__icon::before {
  content: "+";
}

.pp-widgets-accordion__item.is-open .pp-widgets-accordion__icon::before {
  content: "\2212";
}

.pp-widgets-accordion__body {
  display: grid;
  grid-template-rows: 0fr;
  transition: grid-template-rows var(--accordion__transition);
}

.pp-widgets-accordion__item.is-open .pp-widgets-accordion__body {
  grid-template-rows: 1fr;
}

.pp-widgets-accordion__body-inner {
  overflow: hidden;
}

.pp-widgets-accordion__content {
  padding-bottom: var(--v-spacing__xs);
}