/* ===== CarpCZ: lišta "doprava zdarma" ==============================
   Vložit do: Administrace → Vzhled a obsah → Editor vzhledu
              → Vlastní CSS
   Patří k souboru carpcz-doprava-zdarma.js
   =================================================================== */

.cz-ship {
  --cz-bg:      #14301f;   /* pozadí lišty          */
  --cz-fg:      #ffffff;   /* text                  */
  --cz-track:   rgba(255,255,255,.22);  /* dráha ukazatele */
  --cz-fill:    #7bc043;   /* výplň ukazatele       */
  --cz-done:    #7bc043;   /* barva při splnění     */

  position: sticky;
  top: 0;
  z-index: 90;            /* pod dialogy Shoptetu (1000+), aby je nepřekrývala */
  box-sizing: border-box;
  width: 100%;
  padding: 8px 16px;
  background: var(--cz-bg);
  color: var(--cz-fg);
  font-size: 14px;
  line-height: 1.35;
  text-align: center;
}
.cz-ship *, .cz-ship *::before, .cz-ship *::after { box-sizing: inherit; }

.cz-ship__in {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 6px 14px;
  max-width: 1140px;
  margin: 0 auto;
}

.cz-ship__txt { margin: 0; }
.cz-ship__txt strong { font-weight: 700; white-space: nowrap; }

.cz-ship__bar {
  position: relative;
  flex: 0 1 260px;
  height: 8px;
  border-radius: 999px;
  background: var(--cz-track);
  overflow: hidden;
}
.cz-ship__fill {
  position: absolute;
  inset: 0 auto 0 0;
  width: 0;
  border-radius: inherit;
  background: var(--cz-fill);
  transition: width .35s ease;
}
.cz-ship--done .cz-ship__fill { background: var(--cz-done); }
.cz-ship--done .cz-ship__txt  { font-weight: 600; }

/* ===== MOBIL (do 991px) =============================================
   POZOR: v tomhle souboru nikdy nevnořuj komentář do komentáře.
   CSS to neumí - vnitrni ukoncovaci znacka rozbije cely blok
   a parser pak spolkne i nasledujici @media pravidlo.

   Sablona Step ma v tomhle pasmu hlavicku napevno ukotvenou:
       :where(.ums_mobile_header_v1--on) #header
           position: fixed; top: 0; z-index: 56;
   a misto pro ni rezervuje odsazenim obsahu:
       :where(.ums_mobile_header_v1--on) .overall-wrapper
           padding-top: 60px;  (do 479px jen 40px)

   Lista je ale vlozena mimo .overall-wrapper, takze se ji zadne
   odsazeni netyka - sedne si na tentyz pruh jako hlavicka a s
   z-indexem 90 ji prebije (90 > 56). Tim zakryje logo, kosik
   a hlavne tlacitko menu.

   Reseni: listu ukotvit taky napevno, hlavicku posunout presne
   o jeji vysku a o tutez hodnotu zvetsit odsazeni obsahu.
   Vysku meri JS a zapisuje ji do --cz-ship-h (lista se na uzkem
   displeji zalamuje do dvou radku, natvrdo ji zadat nejde).
   =================================================================== */
@media (max-width: 991px) {
  .cz-ship {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 57;          /* těsně nad hlavičkou (56), hluboko pod menu (1000) */
    padding: 7px 12px;
    font-size: 13px;
  }
  .cz-ship__in  { gap: 6px; }

  body.cz-ship-on #header {
    top: var(--cz-ship-h, 0px);
  }
  body.cz-ship-on .overall-wrapper {
    padding-top: calc(60px + var(--cz-ship-h, 0px));
  }

  /* Rozbalovaci menu (#navigation) je v DOM uvnitr #header. Hlavicka je
     fixed se z-indexem 56, takze tvori vlastni vrstvu - z-index 1000
     u menu plati jen uvnitr ni a navenek cele menu vystupuje jako 56.
     Cokoliv nad 56 tedy prekryje prvni polozku menu. Po dobu otevreneho
     menu proto listu poslem pod hlavicku. */
  body.cz-ship-on.navigation-window-visible .cz-ship {
    z-index: 55;
  }
}

@media (max-width: 575px) {
  .cz-ship__bar { flex: 1 0 100%; height: 6px; }
}

@media (max-width: 479px) {
  body.cz-ship-on .overall-wrapper {
    padding-top: calc(40px + var(--cz-ship-h, 0px));
  }
}

/* --- uživatel si nepřeje animace --- */
@media (prefers-reduced-motion: reduce) {
  .cz-ship__fill { transition: none; }
}

/* --- tisk: lištu netiskneme --- */
@media print { .cz-ship { display: none; } }