<div *ngFor="let dailySummary of summary" class="card-wrapper">
    <mat-card>
        <mat-card-header>
            <mat-card-title>{{ dailySummary.date != null ? getDayName(dailySummary.date) : '' }}</mat-card-title>
            <mat-card-subtitle>{{ dailySummary.date | date:"d.M.Y" }}</mat-card-subtitle>
        </mat-card-header>
        <mat-card-content>

            <table mat-table *ngIf="dailySummary.classes.length > 0" [dataSource]="dailySummary.classes" class="full-width-table border-around">
                <ng-container matColumnDef="text">
                    <th mat-header-cell *matHeaderCellDef> Třída </th>
                    <td mat-cell *matCellDef="let element"> {{ element.text }} </td>
                </ng-container>
                <ng-container matColumnDef="instructors">
                  <th mat-header-cell *matHeaderCellDef> Instruktoři </th>
                    <td mat-cell *matCellDef="let element"> 
                      <!-- {{ element.maleInstructorCount }} {{ getWordShape(element.maleInstructorCount, 'muz') }} a {{ element.femaleInstructorCount }} {{ getWordShape(element.femaleInstructorCount, 'zena') }} -->
                        {{ element.filledQuestionnaire == false ? '?' : element.maleInstructorCount+' '+getWordShape(element.maleInstructorCount, 'muz')+' a '+element.femaleInstructorCount+' '+getWordShape(element.femaleInstructorCount, 'zena')}}
                    </td>
                </ng-container>
                <ng-container matColumnDef="teachers">
                    <th mat-header-cell *matHeaderCellDef> Učitelé </th>
                    <td mat-cell *matCellDef="let element"> 
                        <!-- {{ element.maleTeacherCount }} {{ getWordShape(element.maleTeacherCount, 'muz') }} a {{ element.femaleTeacherCount }} {{ getWordShape(element.femaleTeacherCount, 'zena') }} -->
                        {{ element.filledQuestionnaire == false ? '?' : element.maleTeacherCount+' '+getWordShape(element.maleTeacherCount, 'muz')+' a '+element.femaleTeacherCount+' '+getWordShape(element.femaleTeacherCount, 'zena')}}
                    </td>
                </ng-container>
                <ng-container matColumnDef="students">
                    <th mat-header-cell *matHeaderCellDef> Žáci </th>
                    <td mat-cell *matCellDef="let element"> 
                        <!-- {{ element.maleStudentCount }} {{ getWordShape(element.maleStudentCount, 'kluk') }} a {{ element.femaleStudentCount }} {{ getWordShape(element.femaleTeacherCount, 'holka') }} -->
                        {{ element.filledQuestionnaire == false ? '?' : element.maleStudentCount+' '+getWordShape(element.maleStudentCount, 'muz')+' a '+element.femaleStudentCount+' '+getWordShape(element.femaleStudentCount, 'zena')}}
                    </td>
                </ng-container>
                <ng-container matColumnDef="arrival">
                    <th mat-header-cell *matHeaderCellDef> Příjezd / Odjezd </th>
                    <td mat-cell *matCellDef="let element"> {{ getArrivalDeparture(element) }} </td>
                </ng-container>

                <!-- Footer -->
                <ng-container matColumnDef="footer-text">
                    <td mat-footer-cell *matFooterCellDef colspan="1" class="table-item-counter">
                        Celkový součet:
                    </td>
                </ng-container>
                <ng-container matColumnDef="footer-instructors">
                    <td mat-footer-cell *matFooterCellDef colspan="1" class="table-item-counter">
                        {{ instructorSum(dailySummary) }} {{ getWordShape(instructorSum(dailySummary), 'instruktor') }}
                    </td>
                </ng-container>
                <ng-container matColumnDef="footer-teachers">
                    <td mat-footer-cell *matFooterCellDef colspan="1" class="table-item-counter">
                        {{ teacherSum(dailySummary) }} {{ getWordShape(teacherSum(dailySummary), 'ucitel') }}
                    </td>
                </ng-container>
                <ng-container matColumnDef="footer-students">
                    <td mat-footer-cell *matFooterCellDef colspan="1" class="table-item-counter">
                        {{ studentSum(dailySummary) }} {{ getWordShape(studentSum(dailySummary), 'zak') }}
                    </td>
                </ng-container>
              
                <tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>
                <tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr>
                <tr mat-footer-row *matFooterRowDef="displayedFooterColumns" class="footer-row"></tr>
            </table>

        </mat-card-content>
    </mat-card>
</div>
