.filters {
  grid-column: var(--grid-column-filters);
  grid-row: var(--grid-row-filters);
  padding: var(--width-gutter);
  text-align: var(--text-align-filters);
  position: sticky;
  top: 0;
  align-self: start;

  .template-project & {
    grid-column: var(--grid-column-filters-project);
    grid-row: var(--grid-row-filters-project);
    text-align: var(--text-align-filters-project);
  }
}

.filters__button {
  display: inline-block;
  &:hover,
  .filters__dropdown-container[open] & {
    font-style: italic;
  }
}

.filters__filters-list {
  list-style: none;
  margin: var(--width-gutter) 0;
}

.filters__filters-label {
  color: var(--color-text-main);
  &:visited {
    color: var(--color-text-main);
  }
  &.is-active {
    text-decoration: none;
    color: var(--color-text-active);
  }
  &:hover,
  &:focus {
    &:not(.is-active) {
      font-style: italic;
    }
  }
}