/* Žirafa – štítky (příznaky) produktů. Šablona Shoptak Carbon.
   1) Barvy a tvar podle brand manuálu: malé zaoblené štítky na jeden řádek.
   2) Ve výpisech (kategorie, úvodní stránka, související produkty) jsou štítky v řádku pod fotkou,
      takže nezakrývají produkt ani logo Žirafy na fotkách setů. Doprava zdarma je v tom řádku vpravo.
   3) Na detailu produktu je Doprava zdarma pod hlavní fotkou místo černého čtverce přes fotku.
   Štítky „S registrací sleva 10%“ a sleva v % (flag-discount) zůstávají skryté jako dosud. */

:root {
  --zf-green: #074D43;
  --zf-ink: #182826;
  --zf-coral: #ff6367;
  --zf-yellow: #fae355;
  --zf-olive: #4e4208;
  --zf-blue: #cdeaf0;
  --zf-lime: #d7f1aa;
  --zf-mint: #F4F9F7;
  --zf-line: #DCEAE5;
}

/* ---------- Tvar všech štítků ---------- */
/* :where() drží nízkou váhu selektoru, aby barvy níže tento základ přebily */
html body .flags .flag:where(:not(.flag-discount):not(.flag-s-registraci-sleva-10)) {
  display: inline-block !important;
  width: auto !important;
  max-width: 100%;
  height: 24px !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 10px !important;
  box-sizing: border-box;
  border: 0 !important;
  border-radius: 12px !important;
  /* výchozí barva pro štítky, které tu nejsou vyjmenované (i pro budoucí nové) */
  background: var(--zf-mint) !important;
  box-shadow: inset 0 0 0 1px var(--zf-line);
  color: var(--zf-green) !important;
  font-family: Raleway, Arial, sans-serif !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  line-height: 24px !important;
  letter-spacing: 0 !important;
  text-align: left !important;
  text-transform: none !important;
  white-space: nowrap !important;
  overflow: hidden;
  text-overflow: ellipsis; /* na úzké kartě se dlouhý štítek zkrátí třemi tečkami */
  opacity: 1 !important;
  transform: none !important;
}
html body .flags .flag::before,
html body .flags .flag::after { border: 0 !important; }

/* ---------- Barvy podle významu ---------- */
/* Novinka: hlavní zelená */
html body .flags .flag.flag-new { background: var(--zf-green) !important; box-shadow: none; color: #fff !important; }
/* Cena: Akce, Výprodej, Více za méně – Warm Pulse s tmavým textem (kontrast 5,3 : 1) */
html body .flags .flag.flag-action,
html body .flags .flag.flag-custom1,
html body .flags .flag.flag-quantity-discount { background: var(--zf-coral) !important; box-shadow: none; color: var(--zf-ink) !important; }
/* Dárek zdarma: Sluneční obláček */
html body .flags .flag.flag-gift { background: var(--zf-yellow) !important; box-shadow: none; color: var(--zf-olive) !important; }
/* Tip */
html body .flags .flag.flag-tip { background: var(--zf-lime) !important; box-shadow: none; color: var(--zf-green) !important; }
/* Informace o produktu: Vyrobeno v ČR, S autosedačkou */
html body .flags .flag.flag-custom3,
html body .flags .flag.flag-s-autosedackou { background: var(--zf-blue) !important; box-shadow: none; color: var(--zf-green) !important; }
/* Vystaveno na prodejně: zelený obrys, odkaz na showroom */
html body .flags .flag.flag-vystaveno-na-podejne { background: #fff !important; box-shadow: inset 0 0 0 1.5px var(--zf-green); color: var(--zf-green) !important; }

/* Doprava zdarma: místo černého čtverce „ZDARMA“ zelený text s ikonou auta.
   Skript zirafa-stitky.js ho přesune k dostupnosti; tohle je vzhled, kdyby skript neproběhl.
   Šablona má na tomto štítku silnější pravidla, proto je třída v selektoru dvakrát. */
html body .flags .flag.flag-freeshipping.flag-freeshipping {
  display: inline-flex !important;
  align-items: center;
  gap: 5px;
  background: transparent !important;
  box-shadow: none;
  padding: 0 !important;
  color: var(--zf-green) !important;
}
html body .flags .flag.flag-freeshipping.zf-moved { display: none !important; }
html body .flags .flag.flag-freeshipping .flag-text,
html body .flags .flag.flag-freeshipping .sr-only { display: none !important; }
html body .flags .flag.flag-freeshipping .icon-van {
  display: inline-flex !important;
  position: static !important;
  width: auto !important; height: auto !important;
  margin: 0 !important;
  color: var(--zf-green) !important;
  font-size: 16px !important;
  line-height: 1 !important;
}
html body .flags .flag.flag-freeshipping .icon-van::before { color: var(--zf-green) !important; font-size: 16px !important; margin: 0 !important; }
html body .flags .flag.flag-freeshipping::after { content: "Doprava zdarma"; display: inline !important; }

/* Doprava zdarma vložená skriptem */
.zf-free {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  color: var(--zf-green) !important;
  font-family: Raleway, Arial, sans-serif;
  font-weight: 600;
  line-height: 1.2;
  white-space: nowrap;
}
.zf-free svg { flex: 0 0 auto; }
html body .products-block .product .availability:has(.zf-free) { flex-wrap: wrap; align-items: center; column-gap: 12px; row-gap: 2px; }
.zf-free--list { font-size: 12.6px; }
.zf-free--detail { display: flex; margin: 8px 0 0; font-size: 15px; }
.zf-free--detail svg { width: 20px; height: 20px; }

/* ---------- Výpisy produktů: štítky pod fotkou ---------- */
html body .products-block .product a.image {
  display: flex !important;
  flex-wrap: wrap;
  align-items: center;
  align-content: flex-start;
  justify-content: flex-start;
  gap: 6px;
  height: auto !important;
  margin-bottom: -10px !important; /* řádek se štítky zabere část mezery nad názvem */
}
html body .products-block .product a.image > img {
  flex: 0 0 100%;
  width: 100% !important;
  height: auto !important;
  margin: 0 0 4px !important;
}
html body .products-block .product a.image .flags,
html body .products-block .product a.image .extra-flags { display: contents !important; }
html body .products-block .product a.image .flag.flag-freeshipping { margin-left: auto !important; }
/* Řádek se štítky má vždy výšku 24 px, i když produkt žádný štítek nemá – názvy v řadě zůstanou zarovnané */
html body .products-block .product a.image::after {
  content: "";
  flex: 0 0 0;
  height: 24px;
}

/* Malé náhledy (pruh „nejprodávanější“ nad výpisem): na 90px fotce se štítky nevejdou */
html body .products-inline .product .flags,
html body .products-inline .product .extra-flags { display: none !important; }

/* ---------- Detail produktu ---------- */
/* Doprava zdarma pod hlavní fotkou místo přes fotku */
html body .p-image-wrapper .p-image { display: flex !important; flex-direction: column; }
html body .p-image-wrapper .p-image > .flags-extra {
  order: 2;
  position: static !important;
  display: flex !important;
  justify-content: flex-start;
  gap: 8px;
  width: auto !important; height: auto !important;
  margin: 10px 0 0 !important;
  padding: 0 !important;
  inset: auto !important;
}
html body .p-image-wrapper .p-image > .flags-extra .flag.flag-freeshipping { font-size: 14px !important; height: 28px !important; }
/* Ostatní štítky na detailu (ve sloupci s cenou) vedle sebe s mezerou */
html body .p-detail-info .flags-inline { gap: 6px; }