/* ===== Desktop: telefon v pravém rohu MIMO .navigation-buttons ===== */

/* Rezervuj vpravo místo pro telefon (aby nepřekrýval ikony) */
#header .container.navigation-wrapper{
  --hp-w: 220px;                 /* default šířka pro telefon */
  position: relative;
  padding-right: var(--hp-w);
}

/* Samotný telefon – absolutně vpravo, svisle vycentrovaný */
#header .container.navigation-wrapper .header-phone{
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  display: inline-flex;
  align-items: center;
  gap: 10px;

  text-decoration: none;
  color: #fff;                   /* bílé písmo */
  line-height: 1.15;

  white-space: normal;           /* zalomení řídíme uvnitř .hp-text */
  max-width: var(--hp-w);
  overflow: hidden;              /* nic nepřeteče */
  border: 0 !important;          /* žádné bordery/separátory */
  background: transparent !important;
  box-shadow: none !important;
  z-index: 5;
}

#header .container.navigation-wrapper .header-phone:hover,
#header .container.navigation-wrapper .header-phone:focus{
  color: #2ecc71;                /* zelený hover/focus */
}

#header .container.navigation-wrapper .header-phone::before{
  content:'\e92c';               /* Shoptet ikonfont – telefon */
  font-family: shoptet;
  font-size: 20px;
  line-height: 1;
  color:#fff;
}
#header .container.navigation-wrapper .header-phone:hover::before,
#header .container.navigation-wrapper .header-phone:focus::before{
  color:#2ecc71;
}

/* Vnitřní text: číslo nahoře (bez zalomení), poznámka pod ním */
#header .container.navigation-wrapper .header-phone .hp-text{
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  min-width: 0;                  /* umožní ellipsu uvnitř */
}
#header .container.navigation-wrapper .header-phone .hp-number{
  display: block;
  font-size: 18px;
  font-weight: 700;
  white-space: nowrap;           /* číslo se nikdy neláme */
  color: inherit;
}
#header .container.navigation-wrapper .header-phone .hp-note{
  display: block;
  margin-top: 2px;
  font-size: 13px;
  font-weight: 500;
  color: inherit;
  opacity: .95;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* ---- Tuning velikostí a šířky kvůli místu pro menu ---- */
@media (max-width: 1599.98px){
  #header .container.navigation-wrapper{ --hp-w: 210px; }
  #header .container.navigation-wrapper .header-phone .hp-number{ font-size: 17px; }
}
@media (max-width: 1439.98px){
  #header .container.navigation-wrapper{ --hp-w: 200px; }
  #header .container.navigation-wrapper .header-phone .hp-number{ font-size: 16px; }
}
@media (max-width: 1299.98px){
  #header .container.navigation-wrapper{ --hp-w: 190px; }
  #header .container.navigation-wrapper .header-phone .hp-number{ font-size: 15px; }
  #header .container.navigation-wrapper .header-phone::before{ font-size: 19px; }
}
@media (max-width: 1199.98px){
  #header .container.navigation-wrapper{ --hp-w: 180px; }
  #header .container.navigation-wrapper .header-phone .hp-number{ font-size: 14px; }
  #header .container.navigation-wrapper .header-phone .hp-note{ display: none; } /* šetři místo */
}

/* Pod 990px se desktopová verze skryje – používáme mobilní menu verzi */
@media (max-width: 989.98px){
  #header .container.navigation-wrapper{ --hp-w: 0; padding-right: 0; }
  #header .container.navigation-wrapper .header-phone{ display: none !important; }
}

/* ===== Mobil: telefon uvnitř mobilního menu (.navigationActions) ===== */
@media (max-width: 989.98px){
  /* reset list-item borderů a vzhledu */
  #navigation .navigationActions li.kontakt-mobile{
    list-style: none;
    border: 0 !important;
    margin: 0;
    padding: 0;
  }

  #navigation .navigationActions li.kontakt-mobile a{
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 14px 16px;
    text-decoration: none;
    color: #000;
    background: transparent;
    border: 0;
  }

  #navigation .navigationActions li.kontakt-mobile a::before{
    content:'\e92c';
    font-family: shoptet;
    font-size: 22px;
    line-height: 1;
    color:#000;
  }
  #navigation .navigationActions li.kontakt-mobile a:hover,
  #navigation .navigationActions li.kontakt-mobile a:focus{
    color:#2ecc71;
  }
  #navigation .navigationActions li.kontakt-mobile a:hover::before,
  #navigation .navigationActions li.kontakt-mobile a:focus::before{
    color:#2ecc71;
  }

  #navigation .navigationActions li.kontakt-mobile .hp-text{
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    min-width: 0;
  }
  #navigation .navigationActions li.kontakt-mobile .hp-number{
    font-size: 18px;
    font-weight: 700;
    white-space: nowrap;
    color: inherit;
  }
  #navigation .navigationActions li.kontakt-mobile .hp-note{
    margin-top: 2px;
    font-size: 13px;
    font-weight: 500;
    color: inherit;
    opacity: .95;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }
}