.directory {
  .period-chooser .period-chooser-header h2.selected-name {
    font-size: $font-up-1;
  }

  &.users-directory {
    .filter-name {
      width: 100%;
      margin-bottom: 1em;
    }

    .directory-last-updated {
      margin-bottom: 1em;
    }
  }

  .directory-controls {
    display: block;
  }

  .total-rows {
    color: var(--primary-medium);
    padding: 5px;
  }

  .user {
    border-top: 1px solid var(--primary-low);
    padding: 1em;
    display: flex;
    flex-wrap: wrap;

    .user-info {
      width: 100%;
      margin-bottom: 1em;
    }

    .user-stat {
      flex: 1 1 50%;
      .value {
        font-weight: bold;
      }
      .label {
        margin-left: 0.2em;
        color: var(--primary-medium);
      }
      .d-icon-heart {
        color: var(--love);
      }
    }
  }
}