<header>
  <p class="eyebrow">Organisation</p>
  <h1>Mehr</h1>
  <p>Team verwalten und persönliche Einstellungen bearbeiten.</p>
</header>

<section class="link-grid">
  <a routerLink="penalties"
    ><mat-card
      ><mat-icon>gavel</mat-icon>
      <div><strong>Strafenkatalog</strong><span>Regeln und Beträge nachschlagen</span></div>
      <mat-icon>chevron_right</mat-icon></mat-card
    ></a
  >
  <a routerLink="invite"
    ><mat-card
      ><mat-icon>person_add</mat-icon>
      <div><strong>Einladen</strong><span>Account mit einem Mitglied verknüpfen</span></div>
      <mat-icon>chevron_right</mat-icon></mat-card
    ></a
  >
  <a routerLink="profile"
    ><mat-card
      ><mat-icon>manage_accounts</mat-icon>
      <div><strong>Profil</strong><span>Name und Passwort ändern</span></div>
      <mat-icon>chevron_right</mat-icon></mat-card
    ></a
  >
  <a routerLink="public-access"
    ><mat-card
      ><mat-icon>public</mat-icon>
      <div>
        <strong>Öffentliche Freigabe</strong><span>Teamstand teilen und Link verwalten</span>
      </div>
      <mat-icon>chevron_right</mat-icon></mat-card
    ></a
  >
</section>

<mat-card class="account-card">
  <div>
    <strong>{{ user()?.firstName }} {{ user()?.lastName }}</strong
    ><span>{{ user()?.email }}</span>
  </div>
  <button mat-stroked-button type="button" (click)="logout()">
    <mat-icon>logout</mat-icon>Abmelden
  </button>
</mat-card>
