<div class="hospitalContent-w">
  <div class="container">
    <div class="row">

        <ng-template [ngIf]="authSer.arabicTemplate" [ngIfElse]="englishTemplate">
            <div class="col-6 col-md-3">
                <div class="recordsContent-w">
                    <ul class="list-unstyled">
                      <li *ngFor="let hospital of hospitalCenters; let i = index" (click)="open(hospital,i)" style="cursor: pointer;">  
                          <!-- <img src="../../../assets/image/Path 148.png" *ngIf="topArrow"/>
                          <img src="../../../assets/image/Path 147.png" *ngIf="bottomArrow"/>   -->
                          {{hospital.name}}
                          <div *ngIf="i == expandedIndex">  
                              <div class="containetttt" *ngFor="let field of hospital['fields']">
                                <ul class="list-unstyled nestedMenu">
                                  <li (click)="showDescriptionDetails(field)" [ngClass]="">
                                    {{field.title}} 
                                  </li>
                                </ul>
                              </div>  
                          </div>                                  
                      </li>
                    </ul>
                </div>
            </div>
            <div class="col-6 col-md-9">
              <div class="information">
                <h2>{{detailsField.title}}</h2>
                <p>{{detailsField.description}}</p>
              </div>
            </div> 
        </ng-template>

        <ng-template #englishTemplate>
            <div class="col-6 col-md-3">
                <div class="recordsContent-w">
                    <ul class="list-unstyled">
                      <li *ngFor="let hospital of hospitalCenters; let i = index" (click)="open(hospital,i)" style="cursor: pointer;">  
                          <i class="fas fa-sort-up"></i>{{hospital.name_en}}  
                          <div *ngIf="i == expandedIndex">  
                              <div class="containetttt" *ngFor="let field of hospital['fields']">
                                <ul class="list-unstyled nestedMenu">
                                  <li (click)="showDescriptionDetails(field)">
                                    {{field.title_en}} 
                                  </li>
                                </ul>
                              </div>  
                          </div>                                  
                      </li>
                    </ul>
                </div>
            </div>
            <div class="col-6 col-md-9">
              <div class="information" [className]=" arabicTemplate ? '' : 'achievementsLang-w' ">
                <h2>{{detailsField.title_en}}</h2>
                <p>{{detailsField.description_en}}</p>
              </div>
            </div> 
        </ng-template>

    </div>
  </div>
</div>
