<div class="container-responsive">
  <div class="container" style="min-height: calc(100vh - 155px);">

    <div class="row">
      <div class="col-1 col-sm-1 col-md-1 col-lg-1 col-xl-1"></div>
      <div class="col-10 col-sm-10 col-md-10 col-lg-10 col-xl-10">

        <div class="text-center mt-4">
          <h2 class="font-weight-bold " style="color: #000000;"> Upload Document </h2>

        </div><br>


        <table id="customers">
          <tr>
            <th style="width:30%;text-align: center;">Description</th>
            <th style="text-align: center;">Document</th>
            <!-- <th>Country</th> -->
          </tr>

          <tr>
            <!-- <td><span style="font-size: medium;">{{doc?.Description}}</span>
             <br><span style="font-size: smaller;">({{cover?.fileFormatD?.fileFormat}} format)</span>
           </td> -->
            <td style="text-align: center;"> Boq Documents</td>
            <td style="height: 93px;">
              <div class="form-group">
                <!-- <label for="file1">File 1:</label> -->
                <div class="input-group">

                  <mat-form-field class="columns" appearance="outline"
                    style="height: 15px;margin-top: -10px;width:90%;">
                    <mat-label *ngIf="boqFile?.fileName && boqFile?.fileName != ''; else assetImageLabel">
                      {{boqFile?.fileName}}</mat-label>
                    <ng-template #assetImageLabel>
                      <mat-label> {{ 'assetImagePath' | translate }}
                      </mat-label>
                    </ng-template>
                    <input matInput readonly [(ngModel)]="boqFile.fileName" [ngModelOptions]="{standalone: true}">
                    <button mat-icon-button matSuffix
                      *ngIf="!boqFile || boqFile?.fileName=='' || boqFile.fileName==null"
                      (click)="assetFileInput.click()">
                      <mat-icon>attach_file</mat-icon>
                    </button>
                    <button mat-icon-button matSuffix *ngIf="boqFile && boqFile.fileName!='' && boqFile.fileName!=null"
                      (click)="removeBoqfile()">
                      <mat-icon>delete_outline</mat-icon>
                    </button>
                    <input hidden (change)="uploadBoqFiles($event)" #assetFileInput type="file" id="file">
                  </mat-form-field>




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



          </tr>

        </table>
        <br><br>
        <div class="row">
          <div class="col-xl-1 col-lg-1 col-md-1 col-sm-1 col-1"></div>

          <div class="col-xl-5 col-lg-5 col-md-5 col-sm-5 col-5" style="text-align: left;">
            <button mat-raised-button style="width: 60%; color: #cc2d18;cursor: pointer;"
              (click)="close()">Close</button>
          </div>
          <div class="col-xl-5 col-lg-5 col-md-5 col-sm-5 col-5" style="text-align: right;">
            <button mat-raised-button style="width: 60%; color: #1839cc;cursor: pointer;"
              (click)="saveBoqFile()">Save</button>
          </div>
          <div class="col-xl-1 col-lg-1 col-md-1 col-sm-1 col-1"></div>


        </div>
      </div>
    </div>
  </div>
</div>
<div class="footer">
  <footer id="footer" style="padding: 70px 0; color: #000000; font-size: 16px; bottom: 0;margin-top: 10px;"
    class="py-3">
    <div class="container">
      <div class="row">
        <div class="col-md-12 text-center" style="font-size: smaller;">
         
        
            <p class="mb-0" style="font-family: 'nucleo';">
              &copy; <span style="font-weight: bolder;margin-right: 10px;">Art . n Architects</span><span style=" margin-right: 10px;"> All Rights Reserved </span>
              <a href="https://tender.artnouveau.in/#/policy/privacy-policy" style="color: #000000; margin-right: 10px;">Privacy Policy</a> | 
              <a href="https://tender.artnouveau.in/#/policy/refund-policy" style="color: #000000; margin-right: 10px;">Refund Policy</a> | 
              <a href="https://tender.artnouveau.in/#/policy/terms-and-conditions" style="color: #000000; margin-right: 10px;">Terms and conditions</a> |  
              Designed by <a href="https://www.simssoftware.in/" target="_blank" style="color: #000000;">SiMS</a>
          </p>
          </div>
      </div>
    </div>
  </footer>
</div>