<div class="container-fluid">
  <div class="row text-center p-5 alert--error__big">
    <div class="col-lg-12">
      <p class="basic-text">Nepodařilo se načíst pobočky</p>
    </div>
  </div>
</div>
{{#header}}{{>hypolab-hypo-menu}}{{/header}}
<div class="container">
  {{#breadcrumb}} {{>hypolab-hypo-drobeckova}} {{/breadcrumb}}
</div>
<main class="container" role="main">
  {{#head}} {{>hypolab-hypolab-header}} {{/head}}
  <div class="card card-body card--transparent pb-0">
    <div class="row">
      <div class="col-lg-12">
        <h1 class="h4 pb-3"> <i class="icon icon--applicant icon--lg"></i> Žadatelé</h1>
      </div>
    </div>
  </div>
  <div class="card card-body">
    <div class="row">
      <div class="col-lg-9">
        <!-- tabs navigace hlavní -->
        <ul class="nav nav-tabs" id="calc" role="tablist">
          <li class="nav-item">
            <a class="nav-link active" id="zadatel-jedna" data-toggle="tab" href="#zadatel1" role="tab" aria-controls="zadatel1" aria-selected="true">
              <span> Žadatel 1 </span><i class="icon icon--delete icon--sm ml-2"></i>
              <span class="text-secondary d-block pb-0"> Petr Moravec </span>
            </a>
          </li>
          <li class="nav-item">
            <a class="nav-link" id="zadatel-dva" data-toggle="tab" href="#zadatel2" role="tab" aria-controls="zadatel2" aria-selected="false">
              Žadatel 2 <i class="icon icon--delete icon--sm ml-2"></i>
              <span class="text-secondary d-block pb-0"> Petr Moravec </span>
            </a>
          </li>
        </ul>
        <!-- endif tabs navigace hlavní -->
      </div>
      <div class="col-lg-3">
        <button type="button" class="btn btn-secondary btn-sm btn-block" name="button"> + Přidat žadatele</button>
      </div>
    </div>
    <div class="row">
      <div class="col-lg-12">
        <div class="tab-content" id="calcContent">
          <!-- tab žadatel jedna -->
          <div class="tab-pane fade show active" id="zadatel1" role="tabpanel" aria-labelledby="zadatel1">
            <div class="card card-body card--bg__gray mb-3">
              <div class="row">
                <div class="col-lg-4">
                  <div class="row">
                    <div class="col-lg-6">
                      <div class="form-group">
                       <label for="moleculeId" id="labelId" aria-label="" aria-labelledby="" class="form-control-label form-control-label__sm">Jméno <span class="required"> </span> </label>
                       <input type="text" aria-labelledby="" aria-required="true" id="" name="input" tabindex="" placeholder="Patternlab Input" class="form-control form-control-sm" value="">
                       <p class="form-text"></p>
                      </div>
                    </div>
                    <div class="col-lg-6">
                      <div class="form-group">
                       <label for="moleculeId" id="labelId" aria-label="" aria-labelledby="" class="form-control-label form-control-label__sm">Přijmení <span class="required"> </span> </label>
                       <input type="text" aria-labelledby="" aria-required="true" id="" name="input" tabindex="" placeholder="Patternlab Input" class="form-control form-control-sm" value="">
                       <p class="form-text"></p>
                      </div>
                    </div>

                    <div class="col-lg-6">
                      <div class="dropdown">
                        <div aria-haspopup="true" aria-expanded="false" class="">
                          <label for="moleculeId" id="labelId" aria-label="" aria-labelledby="" class="form-control-label form-control-label__sm"> Kontaktní země <span class="required"> </span>
                            <button href="#" class="moneta-popover" data-container="body" data-toggle="popover" data-placement="top" data-content="">
                              <i class="icon icon--info"></i>
                            </button>
                          </label>
                          <div class="input-group">
                            <input type="text" aria-labelledby="" aria-required="true" id="" name="input" placeholder="Select item ..." class="form-control  form-control-sm" value="">
                            <div class="input-group-btn">
                              <button type="button" name="button" class="btn btn-primary btn-sm pl-2 pr-2 btn-no-shadow"> <i class="icon icon--arr-down icon--sm"></i> </button>
                            </div>
                          </div>
                        </div>
                        <div aria-hidden="true" class="dropdown-menu" role="menu" tabindex="-1" style="width: 100%; overflow-y: scroll; height: 110px;">
                          <button class="dropdown-item" tabindex="0" type="button">Dan</button>
                          <button class="dropdown-item" tabindex="0" type="button">Vlada</button>
                        </div>
                      </div>
                    </div>
                    <div class="col-lg-6">
                      <div class="dropdown">
                        <div aria-haspopup="true" aria-expanded="false" class="">
                          <label for="moleculeId" id="labelId" aria-label="" aria-labelledby="" class="form-control-label form-control-label__sm"> Státní příslušnost <span class="required"> </span>
                            <button href="#" class="moneta-popover" data-container="body" data-toggle="popover" data-placement="top" data-content="">
                              <i class="icon icon--info"></i>
                            </button>
                          </label>
                          <div class="input-group">
                            <input type="text" aria-labelledby="" aria-required="true" id="" name="input" placeholder="Select item ..." class="form-control form-control-sm" value="">
                            <div class="input-group-btn">
                              <button type="button" name="button" class="btn btn-primary btn-sm pr-2 pl-2 btn-no-shadow"> <i class="icon icon--arr-down icon--sm"></i> </button>
                            </div>
                          </div>
                        </div>
                        <div aria-hidden="true" class="dropdown-menu" role="menu" tabindex="-1" style="width: 100%; overflow-y: scroll; height: 110px;">
                          <button class="dropdown-item" tabindex="0" type="button">Dan</button>
                          <button class="dropdown-item" tabindex="0" type="button">Vlada</button>
                        </div>
                      </div>
                    </div>
                  </div>
                </div>
                <div class="col-lg-4">
                  <div class="row">
                    <div class="col-lg-12">
                      <div class="form-group form-group__error">
                        <label for="" class="form-control-label form-control-label__sm ">Datum narození</label>
                        <div class="input-group form-group">
                          <input type="text" aria-labelledby="" aria-required="true" id="" name="input" tabindex="" placeholder="den" class="form-control form-control-sm" value="">
                          <input type="text" aria-labelledby="" aria-required="true" id="" name="input" tabindex="" placeholder="měsíc" class="form-control form-control-sm ml-2 mr-2" value="">
                          <input type="text" aria-labelledby="" aria-required="true" id="" name="input" tabindex="" placeholder="rok" class="form-control form-control-sm" value="">
                        </div>
                      </div>
                    </div>
                    <div class="col-lg-6">
                      <div class="dropdown form-group form-group__error">
                        <div aria-haspopup="true" aria-expanded="false" class="">
                          <label for="moleculeId" id="labelId" aria-label="" aria-labelledby="" class="form-control-label form-control-label__sm"> Rodinný stav <span class="required"> </span>
                            <button href="#" class="moneta-popover" data-container="body" data-toggle="popover" data-placement="top" data-content="">
                              <i class="icon icon--info"></i>
                            </button>
                          </label>
                          <div class="input-group">
                            <input type="text" aria-labelledby="" aria-required="true" id="" name="input" placeholder="Select item ..." class="form-control form-control-sm" value="">
                            <div class="input-group-btn">
                              <button type="button" name="button" class="btn btn-primary btn-sm pr-2 pl-2 btn-no-shadow"> <i class="icon icon--arr-down icon--sm"></i> </button>
                            </div>
                          </div>
                        </div>
                        <div aria-hidden="true" class="dropdown-menu" role="menu" tabindex="-1" style="width: 100%; overflow-y: scroll; height: 110px;">
                          <button class="dropdown-item" tabindex="0" type="button">Dan</button>
                          <button class="dropdown-item" tabindex="0" type="button">Vlada</button>
                        </div>
                      </div>
                    </div>
                    <div class="col-lg-6">
                      <label for="" id="" aria-label="" aria-labelledby="" class="form-control-label form-control-label__sm">Druh / Družka <span class="required">  </span>
                        <button href="#" class="moneta-popover" data-container="body" data-toggle="popover" data-placement="top" data-content="">
                          <i class="icon icon--info"></i>
                        </button>
                      </label>
                      <label class="custom-control custom-checkbox">
                        <input type="checkbox" class="custom-control-input" name="" value="">
                        <span class="custom-control-indicator"></span>
                      </label>
                    </div>
                  </div>
                </div>
                <div class="col-lg-4">
                  <p class="text-primary"><strong>Domácnost 1</strong>
                    <button href="#" class="moneta-popover" data-container="body" data-toggle="popover" data-placement="top" data-content="">
                      <i class="icon icon--info"></i>
                    </button>
                  </p>
                  <div class="row">
                    <div class="col-lg-6">
                      <div class="row">
                        <label for="" id="" aria-label="" aria-labelledby="" class="form-control-label form-control-label__sm col-12">Osoby s příjmem <span class="required">  </span> </label>

                        <input type="" aria-labelledby="" disabled aria-required="true" id="" name="input" tabindex="" placeholder="" class="form-control col-4 text-center form-control__counter form-control-sm ml-3" value="1">

                      </div>
                    </div>
                    <div class="col-lg-6">
                      <div class="row">
                        <label for="" id="" aria-label="" aria-labelledby="" class="form-control-label form-control-label__sm col-12">Osoby bez příjmu <span class="required">  </span>
                          <button href="#" class="moneta-popover" data-container="body" data-toggle="popover" data-placement="top" data-content="">
                            <i class="icon icon--info"></i>
                          </button>
                        </label>
                        <a href="#" class="align-self-center"><i class=" ml-3 icon icon--minus icon--sm"></i></a>
                        <input type="" aria-labelledby="" aria-required="true" id="" name="input" tabindex="" placeholder="" class="form-control ml-2 mr-2 col-4 text-center form-control__counter form-control-sm" value="">
                        <a href="#" class="align-self-center"><i class="icon icon--plus icon--sm"></i></a>
                      </div>
                    </div>

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

            <!-- příjmy -->
            {{#prijmy}} {{>kalkulaceKomponenty-prijmy}} {{/prijmy}}
            <!-- endif příjmy -->

            <!-- Výdaje -->
            {{#vydaje}} {{>kalkulaceKomponenty-vydaje}} {{/vydaje}}
            <!-- endif výdaje -->

          </div>
          <!-- endif žadatel jedna -->

          <!-- tabs žadatel dva -->

          <div class="tab-pane fade" id="zadatel2" role="tabpanel" aria-labelledby="zadatel2">
            <div class="row">
              <div class="col-lg-12">
                <div class="tab-pane fade show active" id="zadatel1" role="tabpanel" aria-labelledby="zadatel1">
                  <div class="card card-body card--bg__gray mb-5">
                    <div class="row">
                      <div class="col-lg-4">
                        <div class="row">
                          <div class="col-lg-6">
                            <div class="form-group">
                             <label for="moleculeId" id="labelId" aria-label="" aria-labelledby="" class="form-control-label form-control-label__sm">Jméno <span class="required"> </span> </label>
                             <input type="text" aria-labelledby="" aria-required="true" id="" name="input" tabindex="" placeholder="Patternlab Input" class="form-control form-control-sm" value="">
                             <p class="form-text"></p>
                            </div>
                          </div>
                          <div class="col-lg-6">
                            <div class="form-group">
                             <label for="moleculeId" id="labelId" aria-label="" aria-labelledby="" class="form-control-label form-control-label__sm">Přijmení <span class="required"> </span> </label>
                             <input type="text" aria-labelledby="" aria-required="true" id="" name="input" tabindex="" placeholder="Patternlab Input" class="form-control form-control-sm" value="">
                             <p class="form-text"></p>
                            </div>
                          </div>

                          <div class="col-lg-6">
                            <div class="dropdown mb-3">
                              <div aria-haspopup="true" aria-expanded="false" class="">
                                <label for="moleculeId" id="labelId" aria-label="" aria-labelledby="" class="form-control-label form-control-label__sm"> Kontaktní země <span class="required"> </span>
                                  <button href="#" class="moneta-popover" data-container="body" data-toggle="popover" data-placement="top" data-content="">
                                    <i class="icon icon--info"></i>
                                  </button>
                                </label>
                                <div class="input-group">
                                  <input type="text" aria-labelledby="" aria-required="true" id="" name="input" placeholder="Select item ..." class="form-control  form-control-sm" value="">
                                  <div class="input-group-btn">
                                    <button type="button" name="button" class="btn btn-primary btn-sm pl-2 pr-2 btn-no-shadow"> <i class="icon icon--arr-down icon--sm"></i> </button>
                                  </div>
                                </div>
                              </div>
                              <div aria-hidden="true" class="dropdown-menu" role="menu" tabindex="-1" style="width: 100%; overflow-y: scroll; height: 110px;">
                                <button class="dropdown-item" tabindex="0" type="button">Dan</button>
                                <button class="dropdown-item" tabindex="0" type="button">Vlada</button>
                              </div>
                            </div>
                          </div>
                          <div class="col-lg-6">
                            <div class="dropdown mb-3">
                              <div aria-haspopup="true" aria-expanded="false" class="">
                                <label for="moleculeId" id="labelId" aria-label="" aria-labelledby="" class="form-control-label form-control-label__sm"> Státní příslušnost <span class="required"> </span>
                                  <button href="#" class="moneta-popover" data-container="body" data-toggle="popover" data-placement="top" data-content="">
                                    <i class="icon icon--info"></i>
                                  </button>
                                </label>
                                <div class="input-group">
                                  <input type="text" aria-labelledby="" aria-required="true" id="" name="input" placeholder="Select item ..." class="form-control form-control-sm" value="">
                                  <div class="input-group-btn">
                                    <button type="button" name="button" class="btn btn-primary btn-sm pr-2 pl-2 btn-no-shadow"> <i class="icon icon--arr-down icon--sm"></i> </button>
                                  </div>
                                </div>
                              </div>
                              <div aria-hidden="true" class="dropdown-menu" role="menu" tabindex="-1" style="width: 100%; overflow-y: scroll; height: 110px;">
                                <button class="dropdown-item" tabindex="0" type="button">Dan</button>
                                <button class="dropdown-item" tabindex="0" type="button">Vlada</button>
                              </div>
                            </div>
                          </div>
                        </div>
                      </div>
                      <div class="col-lg-4">
                        <div class="row">
                          <div class="col-lg-12">
                            <label for="" class="form-control-label form-control-label__sm">Datum narození</label>
                            <div class="input-group form-group">
                              <input type="text" aria-labelledby="" aria-required="true" id="" name="input" tabindex="" placeholder="den" class="form-control form-control-sm" value="">
                              <input type="text" aria-labelledby="" aria-required="true" id="" name="input" tabindex="" placeholder="měsíc" class="form-control form-control-sm ml-2 mr-2" value="">
                              <input type="text" aria-labelledby="" aria-required="true" id="" name="input" tabindex="" placeholder="rok" class="form-control form-control-sm" value="">
                            </div>
                          </div>
                          <div class="col-lg-6">
                            <div class="dropdown mb-3">
                              <div aria-haspopup="true" aria-expanded="false" class="">
                                <label for="moleculeId" id="labelId" aria-label="" aria-labelledby="" class="form-control-label form-control-label__sm"> Rodinný stav <span class="required"> </span>
                                  <button href="#" class="moneta-popover" data-container="body" data-toggle="popover" data-placement="top" data-content="">
                                    <i class="icon icon--info"></i>
                                  </button>
                                </label>
                                <div class="input-group">
                                  <input type="text" aria-labelledby="" aria-required="true" id="" name="input" placeholder="Select item ..." class="form-control form-control-sm" value="">
                                  <div class="input-group-btn">
                                    <button type="button" name="button" class="btn btn-primary btn-sm pr-2 pl-2 btn-no-shadow"> <i class="icon icon--arr-down icon--sm"></i> </button>
                                  </div>
                                </div>
                              </div>
                              <div aria-hidden="true" class="dropdown-menu" role="menu" tabindex="-1" style="width: 100%; overflow-y: scroll; height: 110px;">
                                <button class="dropdown-item" tabindex="0" type="button">Dan</button>
                                <button class="dropdown-item" tabindex="0" type="button">Vlada</button>
                              </div>
                            </div>
                          </div>
                          <div class="col-lg-6">
                            <label for="" id="" aria-label="" aria-labelledby="" class="form-control-label form-control-label__sm">Druh / Družka <span class="required">  </span>
                              <button href="#" class="moneta-popover" data-container="body" data-toggle="popover" data-placement="top" data-content="">
                                <i class="icon icon--info"></i>
                              </button>
                            </label>
                            <label class="custom-control custom-checkbox">
                              <input type="checkbox" class="custom-control-input" name="" value="">
                              <span class="custom-control-indicator"></span>
                            </label>
                          </div>
                        </div>
                      </div>
                      <div class="col-lg-4">
                        <p class="text-primary pb-1"><strong>Domácnost 1</strong>
                          <button href="#" class="moneta-popover" data-container="body" data-toggle="popover" data-placement="top" data-content="">
                            <i class="icon icon--info"></i>
                          </button>
                        </p>
                        <div class="row">
                          <div class="col-lg-12">
                            <div class="form-group">
                              <label class="custom-control custom-checkbox">
                                <input type="checkbox" class="custom-control-input"  name="" value="">
                                <span class="custom-control-indicator"></span>
                                <span class="custom-control-description">Ve stejné domácnosti jako žadatel 1</span>
                              </label>
                            </div>
                          </div>
                          <div class="col-lg-6">
                            <div class="row">
                              <label for="" id="" aria-label="" aria-labelledby="" class="form-control-label form-control-label__sm col-12">Osoby bez příjmu <span class="required">  </span> </label>
                              <a href="#" class="align-self-center"><i class=" ml-3 icon icon--minus icon--sm"></i></a>
                              <input type="" aria-labelledby="" aria-required="true" id="" name="input" tabindex="" placeholder="" class="form-control ml-2 mr-2 col-4 text-center form-control__counter form-control-sm" value="">
                              <a href="#" class="align-self-center"><i class="icon icon--plus icon--sm"></i></a>
                            </div>
                          </div>
                          <div class="col-lg-6">
                            <div class="row">
                              <label for="" id="" aria-label="" aria-labelledby="" class="form-control-label form-control-label__sm col-12">Osoby s příjmem <span class="required">  </span>
                                <button href="#" class="moneta-popover" data-container="body" data-toggle="popover" data-placement="top" data-content="">
                                  <i class="icon icon--info"></i>
                                </button>
                              </label>
                              <a href="#" class="align-self-center"><i class=" ml-3 icon icon--minus icon--sm"></i></a>
                              <input type="" aria-labelledby="" aria-required="true" id="" name="input" tabindex="" placeholder="" class="form-control ml-2 mr-2 col-4 text-center form-control__counter form-control-sm" value="">
                              <a href="#" class="align-self-center"><i class="icon icon--plus icon--sm"></i></a>
                            </div>
                          </div>

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

                  <!-- tabs příjmy -->
                  {{#prijmy}} {{>kalkulaceKomponenty-prijmy}} {{/prijmy}}
                  <!-- endif tabs příjmy -->

                  <!-- Výdaje -->
                  {{#vydaje}} {{>kalkulaceKomponenty-vydaje}} {{/vydaje}}
                  <!-- endif výdaje -->

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

          </div>
          <!-- tabs žadatel dva -->


        </div>
      </div>
    </div>
  </div>
  <!-- úvěr -->
  {{#uver}} {{>kalkulaceKomponenty-uver}} {{/uver}}
  <!-- endif úvěr  -->
  <div class="card card-body card--transparent pb-0">
    <div class="text-center mt-3 mb-3">
      <button type="button" class="btn btn-primary" name="button">Spočítat</button>
    </div>
  </div>



    <div class="card card-body card--transparent pt-0 pb-0">
      <h4 class="h4"><i class="icon icon--online-doc icon--lg mr-2"></i> Vypočítané údaje</h4>
    </div>
    <div class="card card-body">
      <div class="row">
        <div class="col-lg-12">

          <div class="alert alert--error mb-3" role="alert">
            <div class="row">
              <div class="col-lg-1 col-md-1 col-sm-1 col-2 text-center">
                <i class="icon icon--alert__error"></i>
              </div>
              <div class="col-lg-7 col-md-7 col-sm-6 col-10">
                <p class="mb-2"> <strong> You are wrong Mr. </strong></p>
                <p class="mb-0">You are out of chimichangas</p>
              </div>
              <div class="col-lg-4 col-md-4 col-sm-5 col-12 text-right">
                <button type="" class="btn btn btn-link" aria-label="">Zkusit znovu</button>
                <button type="" class="btn btn btn-link" aria-label="">Zrušit</button>
              </div>
            </div>
          </div>

          <div class="alert alert--success mb-3" role="alert">
            <div class="row">
              <div class="col-lg-1 col-md-1 col-sm-1 col-2 text-center">
                <i class="icon icon--alert__success"></i>
              </div>
              <div class="col-lg-7 col-md-7 col-sm-6 col-10">
                <p class="mb-2"> <strong> You are wrong Mr. </strong></p>
                <p class="mb-0">You are out of chimichangas</p>
              </div>
              <div class="col-lg-4 col-md-4 col-sm-5 col-12 text-right">
                <button type="" class="btn btn btn-link" aria-label="">Zkusit znovu</button>
                <button type="" class="btn btn btn-link" aria-label="">Zrušit</button>
              </div>
            </div>
          </div>

        </div>
        <div class="col-lg-12">
          <h4 class="text-info mt-2  h4"> ID Obchodu 999999</h4>
        </div>
        <div class="col-lg-6">
          <h5 class="h5">Požadované parametry úvěru</h5>
          <div class="text">
            <p class="line">
              <span class="float-left small-text">Produkt</span>
              <span class="float-right small-text"> Pružná hypotéka </span>
            </p>
            <p class="line">
              <span class="float-left small-text">Výše úvěru</span>
              <span class="float-right small-text"> <strong> 2 500 000 Kc </strong></span>
            </p>
            <p class="line">
              <span class="float-left small-text">Splatnost úvěru</span>
              <span class="float-right small-text">  25 let </span>
            </p>
            <p class="line">
              <span class="float-left small-text">LTV úvěru</span>
              <span class="float-right small-text"> 80 % </span>
            </p>
            <p class="line">
              <span class="float-left small-text">Úroková sazba</span>
              <span class="float-right small-text"> <strong> 2,7 % </strong></span>
            </p>
            <p class="line">
              <span class="float-left small-text">Fixace úrokové sazby</span>
              <span class="float-right small-text"> 5 let </span>
            </p>
            <p class="line">
              <span class="float-left small-text">Anuitní splátka</span>
              <span class="float-right small-text"> 10 000 Kč </span>
            </p>
            <p class="line">
              <span class="float-left small-text">Pojištění schopnosti splácet</span>
              <span class="float-right small-text"> 500 Kč </span>
            </p>
            <p class="line">
              <span class="float-left small-text">Celková měsíční splátka</span>
              <span class="float-right small-text"> <strong> 10 500 Kč </strong></span>
            </p>
          </div>
        </div>
        <div class="col-lg-6">
          <h5 class="h5">Maximální možné parametry úvěru</h5>
          <p class="line">
            <span class="float-left small-text">Maximální výše úvěru dle žadatele</span>
            <span class="float-right small-text"> <strong> 5 800 000 Kč </strong></span>
          </p>
          <p class="line">
            <span class="float-left small-text">Maximální možná výše úvěru</span>
            <span class="float-right small-text"> <strong> 2 500 000 Kč </strong></span>
          </p>
          <p class="line">
            <span class="float-left small-text">Maximální možná splatnost úvěru</span>
            <span class="float-right small-text">  30 let </strong></span>
          </p>
          <p class="line">
            <span class="float-left small-text">Maximální možné LTV úvěru</span>
            <span class="float-right small-text"> 90 % </span>
          </p>

          <p class="line">
            <span class="float-left small-text">&nbsp;</span>
            <span class="float-right small-text"> &nbsp;</span>
          </p>
          <p class="line">
            <span class="float-left"><strong>Poplatky</strong></span>
          </p>
          <p class="line">
            <span class="float-left small-text">Poplatek za zpracování</span>
            <span class="float-right small-text"> 0 Kč</span>
          </p>
          <p class="line">
            <span class="float-left small-text">Poplatek za vedení úvěrového účtu</span>
            <span class="float-right small-text"> 0 Kč</span>
          </p>

        </div>
        <div class="col-lg-12">
          <div class="float-right">
            <button type="button" class="btn btn-secondary" name="button">Uložit kalkulaci</button>
            <button type="button" class="btn btn-secondary" name="button">Tisk nabídky</button>
            <button type="button" disabled class="btn btn-primary" name="button">Přejít k žádosti</button>
          </div>
        </div>
      </div>
    </div>

</main>
