<ng-container *ngIf="event && eventForm">
  <div class="" >

    <div class="row ">
      <div class="col-lg-6 col-sm-12"><h1>Jelentkezés</h1>
      </div>
    </div>
    <div class="row ">
      <div class="col-lg-3 col-12 app-font-weight-bold"><span class="title">Edzés típusa</span></div>
      <div class="col-lg-6 col-12"><span>{{event.eventType.name}}</span></div>
    </div>
    <div class="row" *ngIf="event.trainer">
      <div class="col-lg-3 col-12 app-font-weight-bold"><span class="title">Edző</span></div>
      <div class="col-lg-6 col-12"><span>{{event?.trainer?.name}}</span></div>
    </div>
    <div class="row">
      <div class="col-lg-3 col-12 app-font-weight-bold"><span class="title">Edzés kezdési időpontja</span></div>
      <div class="col-lg-6 col-12"><span>{{event.start | eventDate:'datetime'}}</span></div>
    </div>
    <div class="row">
      <div class="col-lg-3 col-12 app-font-weight-bold"><span class="title">Edzés vége</span></div>
      <div class="col-lg-6 col-12"><span>{{event.end | eventDate: 'datetime'}}</span></div>
    </div>
    <div class="row">
      <div class="col-lg-3 col-12 app-font-weight-bold"><span class="title">Férőhelyek száma</span></div>
      <div class="col-lg-6 col-12"><span>{{event.seat_count }}</span></div>
    </div>
    <div class="row">
      <div class="col-lg-3 col-12 app-font-weight-bold"><span class="title">Terem</span></div>
      <div class="col-lg-6 col-12"><span>{{event?.room?.name }}</span></div>
    </div>
    <div class="row" *ngIf="event?.deleted_at">
      <div class="col-lg-3 col-12 app-font-weight-bold"><span class="title">Törölve</span></div>
      <div class="col-lg-6 col-12"><span>{{ event.deleted_at | eventDate:'datetime' }}</span></div>
    </div>
  </div>
  <div class="row">
    <div class=" col-lg-6  col-sm-12 pt-2">
      <a *ngIf="mayRegister(event)" class="btn btn-primary me-3 d-none d-lg-inline-block" (click)="register(event)">Jelentkezek az edzésre</a>
      <a *ngIf="mayRegister(event)" class="btn btn-primary me-3 d-lg-none w-100" (click)="register(event)">Jelentkezek az edzésre</a>
      <a *ngIf="mayCancel(event)" class="btn btn-primary me-3 d-none d-lg-inline-block" (click)="cancel(event)">Lemondás</a>
      <a *ngIf="mayCancel(event)" class="btn btn-primary me-3 d-lg-none w-100" (click)="cancel(event)">Lemondás</a>
      <span class="warning me-3"
            *ngIf="!event.hasFreeSeats && event.registrations.length == 0">Már nincs szabad hely</span>
      <a class="btn btn-dark me-3 d-none d-lg-inline-block" (click)="goBack()">Vissza</a>
      <a class="btn btn-dark me-3 d-lg-none w-100 mt-3" (click)="goBack()">Vissza</a>
    </div>
  </div>
</ng-container>
