.spr-legenda {
  margin: 0;
  padding: 0.375rem;
  border-radius: 0.5rem;
  background-color: rgba(0, 0, 0, 0.03);
  font-size: 1rem;

  summary {
    display: flex;
    align-items: center;
    list-style: none;
    cursor: pointer;
    outline-offset: 0.125rem;
    font-weight: var(--font-weight-bold);

    &::before {
      display: block;
      width: 2.5rem;
      height: 2.5rem;
      margin-inline-end: 0.5rem;
      content: "";
      transform: rotate(-90deg);
      border-radius: 0.25rem;
      background-color: var(--color-white);
      background-image: var(--legenda-title-icon-arrow);
      background-repeat: no-repeat;
      background-position: center;
      background-size: 1.5rem;
    }
  }

  &[open] summary::before {
    transform: rotate(0deg);
  }
}

.spr-legenda .spr-legenda__list {
  margin: 0;
  padding: 0;
  padding-inline-end: 1rem;
  list-style: none;
  padding-block: 1rem;
}

.spr-legenda .spr-legenda__list .spr-legenda-item {
  padding-inline-start: 0;
  background-image: none;
}

.spr-legenda__content {
  margin-inline-start: 3rem;
  padding-block-end: 1rem;
  color: var(--color-gray-80);
  font-size: 0.875rem;
  line-height: 1.5;
}
