@scope (.list-page) {
  :scope {
    display: flex;
    flex-direction: column;
    height: 100%;
    min-height: 0;
  }

  .toolbar {
    display: flex;
    align-items: center;
    gap: var(--space-lg);
    padding-bottom: var(--space-xl);
    flex-shrink: 0;

    @media (width < 48rem) {
      flex-direction: column;
      align-items: stretch;
      gap: var(--space-md);

      .button {
        width: 100%;
        justify-content: center;
      }

      .search-filter {
        width: 100%;
      }
    }
  }

  .filters {
    display: flex;
    align-items: center;
    gap: var(--space-sm);
  }

  .search-filter {
    flex: 1;
    min-width: 0;
  }

  .list-page__content {
    flex: 1;
    overflow: auto;
    -webkit-overflow-scrolling: touch;
    min-height: 0;
  }

  .list-page__empty {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: var(--space-4xl) var(--space-lg);
    color: var(--color-text-muted);
    font-size: var(--text-body-sm);
  }

  .list-page__footer {
    display: flex;
    align-items: center;
    gap: var(--space-sm);
  }
}