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

<section class="link-grid">
  <button type="button" class="link-grid-action" (click)="createTeam()">
    <mat-card
      ><mat-icon>add_circle</mat-icon>
      <div>
        <strong>Team erstellen</strong><span>Ein weiteres Team gründen</span>
      </div>
      <mat-icon>chevron_right</mat-icon></mat-card
    >
  </button>
  @if (canOpenGuide()) {
    <a routerLink="guide"
      ><mat-card
        ><mat-icon>menu_book</mat-icon>
        <div>
          <strong>Anleitung für Verantwortliche</strong
          ><span>Amtsübergabe, Kasse und Teamverwaltung verstehen</span>
        </div>
        <mat-icon>chevron_right</mat-icon></mat-card
      ></a
    >
  }
  <a routerLink="/users"
    ><mat-card
      ><mat-icon>group</mat-icon>
      <div><strong>Benutzer</strong><span>Benutzerverzeichnis öffnen</span></div>
      <mat-icon>chevron_right</mat-icon></mat-card
    ></a
  >
  <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="recurring-transactions"
    ><mat-card
      ><mat-icon>event_repeat</mat-icon>
      <div>
        <strong>Wiederkehrende Buchungen</strong
        ><span>Fälligkeiten automatisch buchen lassen</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
  >
  @if (canManagePermissions()) {
    <a routerLink="permissions"
      ><mat-card
        ><mat-icon>admin_panel_settings</mat-icon>
        <div>
          <strong>Berechtigungen</strong><span>Festlegen, wer was im Team darf</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>
