<flight-details-section class="flight-meal">
    <div caption class="flight-meal__caption">
        <dining-icon></dining-icon>
        <span>{{ 'SHARED.FOOD' | translate }}</span>
    </div>
    <ng-container>
        <flight-details-icon class="" *ngIf="hasEconomyMeal" [href]="economyLink" src="assets/img/service-and-food-icons/econom.svg">
            {{ 'FOOD.ECONOMY' | translate }}
        </flight-details-icon>
        <flight-details-icon *ngIf="hasComfortMeal" [href]="comfortLink" src="assets/img/service-and-food-icons/comfort.svg">
            {{ 'FOOD.COMFORT' | translate }}
        </flight-details-icon>
        <flight-details-icon *ngIf="hasBusinessMeal" [href]="businessLink" src="assets/img/service-and-food-icons/business.svg">
            {{ 'FOOD.BUSINESS' | translate }}
        </flight-details-icon>
        <ng-container *ngIf="isLoading; else content">
            <!-- Отображение GIF-лоадера во время загрузки -->
            <flight-details-icon [href]="specialLink" src="assets/img/loader.gif">
                {{ '' }}
            </flight-details-icon>
        </ng-container>
        <ng-template #content>
            <flight-details-icon *ngIf="hasSpecialMeal" [href]="specialLink" src="assets/img/service-and-food-icons/special-food.svg">
                {{ 'FOOD.SPECIAL' | translate }}
            </flight-details-icon>
        </ng-template>
    </ng-container>
</flight-details-section>
