/* ==========================================================================
   FAZONETKA – košík (styl v1)
   Obsahuje dvě části:
     A) sjednocené okno „Přidáno do košíku“ (platí na celém e-shopu)
     B) nová stránka prázdného košíku (platí jen na /kosik/ při prázdném košíku)
   Vrácení zpět: odebrat z Záhlaví řádek <link> na tento soubor.
   ========================================================================== */

/* ===== A) OKNO „PŘIDÁNO DO KOŠÍKU“ ===== */
/* ==========================================================================
   FAZONETKA – sjednocené okno „Přidáno do košíku“  (styl v1)
   Cíl: jedno kompaktní okno pro PDF i tištěné střihy, bez doporučených
   produktů, objemových slev a dárků. Mění jen vzhled okna Shoptetu
   (.advanced-order), nic z obchodní logiky.
   Vrácení zpět: odebrat z Záhlaví řádek <link> na tento soubor.
   ========================================================================== */

/* 1) Okno: kompaktní, vycentrované (přebíjí pevné rozměry, které nastavuje Colorbox) */
#colorbox:has(.advanced-order) {
  position: fixed !important;
  top: 50% !important;
  left: 50% !important;
  width: min(520px, calc(100vw - 24px)) !important;
  height: auto !important;
  max-height: calc(100vh - 24px);
  transform: translate(-50%, -50%);
}
#colorbox:has(.advanced-order) #cboxWrapper {
  position: relative !important;
}
#colorbox:has(.advanced-order) #cboxWrapper,
#colorbox:has(.advanced-order) #cboxContent,
#colorbox:has(.advanced-order) #cboxLoadedContent {
  width: 100% !important;
  height: auto !important;
  float: none;
}
#colorbox:has(.advanced-order) #cboxLoadedContent {
  max-height: calc(100vh - 24px);
  overflow-y: auto !important;
}
#colorbox:has(.advanced-order) #cboxContent {
  margin-top: 0 !important;
  border-radius: 6px;
  overflow: hidden;
}
#colorbox:has(.advanced-order) #cboxMiddleLeft,
#colorbox:has(.advanced-order) #cboxMiddleRight {
  display: none !important;
}

/* 2) Obsah okna */
#colorbox .advanced-order {
  display: flex;
  flex-direction: column;
  align-items: center;
  margin: 0;
  padding: 34px 28px 14px;
  text-align: center;
  font-family: 'Roboto', sans-serif;
  color: #000;
}

/* Potvrzovací ikona (zelená fajfka) nad nadpisem */
#colorbox .advanced-order .h1 {
  order: 1;
  margin: 0;
  font-family: 'Raleway', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  font-variant-numeric: lining-nums;
  font-size: 26px;
  font-weight: 700;
  line-height: 1.25;
  color: #000;
}
#colorbox .advanced-order .h1::before {
  content: "";
  display: block;
  width: 54px;
  height: 54px;
  margin: 0 auto 14px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 54 54'%3E%3Ccircle cx='27' cy='27' r='27' fill='%23E3F2D4'/%3E%3Cpath d='M16 28l8 8 15-17' fill='none' stroke='%234E9B2F' stroke-width='4.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / contain no-repeat;
}

/* Název přidaného produktu (bere se z Shoptetu, ne napevno) */
#colorbox .advanced-order .h2[data-testid="textPopupProductName"],
#colorbox .advanced-order > .h2 {
  order: 2;
  margin: 8px 0 0;
  font-family: 'Raleway', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  font-size: 17px;
  font-weight: 600;
  line-height: 1.4;
  color: #000;
}

/* Co z okna mizí: slevová motivace, dárky, doporučené produkty */
#colorbox .advanced-order .extras-wrap,
#colorbox .advanced-order .advanced-order-suggestion,
#colorbox .advanced-order .products-wrapper {
  display: none !important;
}

/* 3) Osobní sdělení (ikona + nadpis + text), bez JavaScriptu.
   Ikona heart-handshake (Lucide, obrysová, modrá #2274A5) je podkladový obrázek
   rámečku: na počítači vlevo vedle nadpisu, na mobilu nad nadpisem. */
#colorbox .advanced-order::before {
  content: "Šití zvládnete. A já jsem tu pro vás!";
  order: 3;
  align-self: stretch;
  display: flex;
  align-items: center;
  box-sizing: content-box;
  min-height: 26px;
  margin: 22px 0 -1px;
  padding: 16px 20px 8px 66px;
  border-radius: 6px 6px 0 0;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='26' height='26' viewBox='0 0 24 24' fill='none' stroke='%232274A5' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M19 14c1.49-1.46 3-3.21 3-5.5A5.5 5.5 0 0 0 16.5 3c-1.76 0-3 .5-4.5 2-1.5-1.5-2.74-2-4.5-2A5.5 5.5 0 0 0 2 8.5c0 2.3 1.5 4.05 3 5.5l7 7Z'/%3E%3Cpath d='M12 5 9.04 7.96a2.17 2.17 0 0 0 0 3.08c.82.82 2.13.85 3 .07l2.07-1.9a2.82 2.82 0 0 1 3.79 0l2.96 2.66'/%3E%3Cpath d='m18 15-2-2'/%3E%3Cpath d='m15 18-2-2'/%3E%3C/svg%3E") 22px 16px / 26px 26px no-repeat #EAF5F8;
  font-family: 'Raleway', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  font-size: 17px;
  font-weight: 700;
  line-height: 1.3;
  text-align: left;
  color: #000;
}
#colorbox .advanced-order::after {
  content: "Ke každému střihu připravuji podrobné návody, které vás provedou šitím krok za krokem. A kdybyste potřebovali poradit, stačí mi napsat.";
  order: 4;
  align-self: stretch;
  padding: 0 20px 16px 22px;
  border-radius: 0 0 6px 6px;
  background: #EAF5F8;
  font-size: 15px;
  line-height: 1.55;
  text-align: left;
  color: #1f1f1f;
}

/* 4) Tlačítka: hlavní oranžové nahoře, vedlejší nenápadné pod ním */
#colorbox .advancedOrder__buttons {
  order: 5;
  display: flex;
  flex-direction: column-reverse;
  align-items: center;
  gap: 4px;
  width: 100%;
  margin: 22px 0 0;
  padding: 0;
}
#colorbox .advancedOrder__buttons .btn-conversion {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  max-width: 360px;
  min-height: 52px;
  margin: 0;
  padding: 0 28px;
  border: 0;
  border-radius: 6px;
  background: #F68E5F;
  box-shadow: none;
  font-family: 'Raleway', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  font-size: 17px;
  font-weight: 700;
  line-height: 1.2;
  color: #000;
  text-decoration: none;
}
#colorbox .advancedOrder__buttons .btn-conversion:hover {
  background: #F27C46;
  color: #000;
}
#colorbox .advancedOrder__buttons .next-step-back {
  min-height: 44px;
  margin: 0;
  padding: 0 14px;
  border: 0;
  background: none;
  box-shadow: none;
  font-family: 'Roboto', sans-serif;
  font-size: 15px;
  font-weight: 400;
  color: #1f1f1f;
  text-decoration: underline;
  text-underline-offset: 3px;
  cursor: pointer;
}
#colorbox .advancedOrder__buttons .next-step-back:hover {
  background: none;
  color: #000;
  text-decoration-thickness: 2px;
}
#colorbox .advancedOrder__buttons .btn:focus-visible {
  outline: 3px solid #2274A5;
  outline-offset: 2px;
}

/* 5) Mobil */
@media (max-width: 480px) {
  #colorbox .advanced-order { padding: 28px 18px 20px; }
  #colorbox .advanced-order .h1 { font-size: 24px; }
  #colorbox .advanced-order .h2[data-testid="textPopupProductName"],
  #colorbox .advanced-order > .h2 { font-size: 16px; }
  #colorbox .advanced-order::before { content: "Šití zvládnete.\A A já jsem tu pro vás!"; white-space: pre-line; justify-content: center; min-height: 0; padding: 56px 16px 6px; background-position: center 14px; font-size: 16px; text-align: center; }
  #colorbox .advanced-order::after { padding: 0 16px 14px; font-size: 14.5px; text-align: center; }
  #colorbox .advancedOrder__buttons .btn-conversion { max-width: none; }
}


/* ===== B) PRÁZDNÝ NÁKUPNÍ KOŠÍK ===== */
/* ==========================================================================
   FAZONETKA – prázdný nákupní košík (styl v1)
   Platí jen na stránce prázdného košíku (.cart-empty) a až poté, co skript
   vloží nový blok (.fzk-hotovo). Bez skriptu zůstává původní stránka Shoptetu.
   Vrácení zpět: odebrat z Záhlaví řádky <link> a <script> na tyto soubory.
   ========================================================================== */

/* Původní obsah (seznam odkazů, Hledat, kontaktní box) schováme */
.cart-inner.cart-empty.fzk-hotovo .cart-row { display: none; }

/* Nadpis stránky */
.cart-inner.cart-empty.fzk-hotovo .cart-heading {
  margin: 0 0 18px;
  text-align: center;
  font-family: 'Raleway', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  font-size: 28px;
  font-weight: 700;
  line-height: 1.25;
  color: #000;
}

.fzk {
  box-sizing: border-box;
  width: 100%; /* na užších telefonech jinak přeteče a posune se doprava */
  max-width: 880px;
  margin: 0 auto 24px;
  font-family: 'Roboto', sans-serif;
  color: #000;
}
.fzk *, .fzk *::before, .fzk *::after { box-sizing: border-box; }
.fzk svg { display: block; flex: 0 0 auto; }

/* Hodnocení obchodu – jedna decentní řada pod vyhledáváním, celá je odkaz */
.fzk-hodnoceni {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 4px 8px;
  margin: 14px 0 0;
  color: #1f1f1f;
  text-decoration: none;
}
.fzk-hodnoceni--ceka { visibility: hidden; min-height: 20px; } /* drží místo, aby stránka neposkakovala */
.fzk-hodnoceni:hover, .fzk-hodnoceni:focus { color: #000; text-decoration: none; }
.fzk-hvezdy { display: inline-flex; gap: 2px; }
.fzk-hv { position: relative; display: block; width: 16px; height: 16px; color: #E4DDCF; }
.fzk-hv svg { display: block; width: 16px; height: 16px; }
.fzk-hv-plna { position: absolute; top: 0; left: 0; height: 16px; overflow: hidden; color: #D8AA56; }
.fzk-hv-plna svg { width: 16px; height: 16px; max-width: none; }
.fzk-hodnoceni-cislo { font-family: 'Roboto', sans-serif; font-size: 15px; font-weight: 700; line-height: 1; color: #000; }
.fzk-hodnoceni-text { font-family: 'Roboto', sans-serif; font-size: 14px; line-height: 1.3; color: #3a3a3a; text-decoration: underline; text-decoration-color: transparent; text-underline-offset: 3px; }
.fzk-hodnoceni:hover .fzk-hodnoceni-text { text-decoration-color: currentColor; }

/* 1) Dvě hlavní nákupní tlačítka – oranžová, černý text */
.fzk-tlacitka {
  display: flex;
  justify-content: center;
  gap: 14px;
  max-width: 534px;
  margin: 0 auto;
}
.fzk-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  flex: 1 1 0;
  min-height: 52px;
  padding: 0 24px;
  border-radius: 6px;
  background: #F68E5F;
  font-family: 'Raleway', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  font-size: 17px;
  font-weight: 700;
  line-height: 1.2;
  color: #000;
  text-decoration: none;
}
.fzk-btn:hover, .fzk-btn:focus { background: #F27C46; color: #000; text-decoration: none; }

/* 2) Vyhledávání – stejný vzhled jako v hlavičce / na homepage,
      šířka i okraje stejné jako u dvou oranžových tlačítek nad ním */
.fzk-hledani { max-width: 534px; margin: 16px auto 0; }
.fzk-hledani-pole {
  position: relative;
  display: flex;
  align-items: stretch;
  height: 44px;
  border: 1px solid #F68E5F;
  border-radius: 6px;
  background: #fff;
  overflow: hidden;
}
.fzk-hledani-pole:focus-within { box-shadow: 0 0 0 3px rgba(246, 142, 95, .3); }
.fzk-hledani-pole svg {
  position: absolute;
  top: 50%;
  left: 13px;
  width: 22px;
  height: 22px;
  margin-top: -11px;
  color: #F68E5F;
  pointer-events: none;
}
.fzk-hledani-pole input {
  flex: 1 1 auto;
  min-width: 0;
  height: 100%;
  margin: 0;
  padding: 0 12px 0 46px;
  border: 0;
  border-radius: 0;
  background: none;
  box-shadow: none;
  outline: 0;
  font-family: 'Roboto', sans-serif;
  font-size: 16px;
  color: #1f1f1f;
}
.fzk-hledani-pole button {
  flex: 0 0 auto;
  margin: 0;
  padding: 0 26px;
  border: 0;
  border-radius: 0;
  background: #F68E5F;
  font-family: 'Roboto', sans-serif;
  font-size: 16px;
  font-weight: 600;
  color: #1f1f1f;
  cursor: pointer;
}
.fzk-hledani-pole button:hover { background: #F27C46; }

/* 3) Prvek důvěry – světle modrý rámeček, ikona vedle nadpisu */
.fzk-duvera {
  display: flex;
  align-items: flex-start;
  gap: 14px;
  margin-top: 16px;
  padding: 16px 20px;
  border-radius: 6px;
  background: #EAF5F8;
  text-align: left;
}
.fzk-duvera-ikona { color: #2274A5; padding-top: 1px; }
.fzk-duvera-ikona svg { width: 26px; height: 26px; }
.fzk .fzk-duvera h2 {
  margin: 0 0 4px;
  padding: 0;
  text-align: left;
  font-family: 'Raleway', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  font-size: 17px;
  font-weight: 700;
  line-height: 1.3;
  color: #000;
}
.fzk .fzk-duvera p { margin: 0 !important; padding: 0; font-size: 15px; line-height: 1.55; color: #1f1f1f; }

/* 4) Tři proklikové kartičky (celá kartička je odkaz) */
.fzk-karty {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
  margin-top: 14px;
}
.fzk-karta {
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 64px;
  padding: 10px 12px;
  border: 1px solid #D6E3E9;
  border-radius: 6px;
  background: #fff;
  color: #000;
  text-decoration: none;
}
.fzk-karta:hover, .fzk-karta:focus { border-color: #2274A5; color: #000; text-decoration: none; }
.fzk-karta-ikona { flex: 0 0 48px; }
.fzk-karta-ikona img { display: block; width: 48px; height: 40px; object-fit: contain; }
.fzk-karta-text {
  flex: 1 1 auto;
  font-family: 'Raleway', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
  font-size: 15px;
  font-weight: 700;
  line-height: 1.25;
}
.fzk-karta-sipka { color: #2274A5; }
.fzk-karta-sipka svg { width: 18px; height: 18px; }
.fzk a:focus-visible, .fzk button:focus-visible { outline: 3px solid #2274A5; outline-offset: 2px; }

/* Mobil */
@media (max-width: 640px) {
  .cart-inner.cart-empty.fzk-hotovo .cart-heading { margin-bottom: 14px; font-size: 24px; }
  .fzk-tlacitka { flex-direction: column; align-items: center; gap: 10px; }
  .fzk-btn { flex: none; width: 100%; }
  .fzk-hledani { margin-top: 14px; }
  .fzk-duvera { gap: 12px; padding: 14px 16px; }
  .fzk-duvera-ikona svg { width: 24px; height: 24px; }
  .fzk-karty { grid-template-columns: 1fr; gap: 8px; }
  .fzk-karta { min-height: 54px; }
}

/* C) Mobilní mini košík (okno, které se otevře klepnutím na ikonu košíku nahoře):
   hlavička je na mobilu vyšší (ikony + vyhledávání), takže první položka se schovávala
   pod vyhledávací lištou. Obsah okna posunujeme pod hlavičku. */
@media (max-width: 991px) {
  #cart-widget.popup-widget { box-sizing: border-box; padding-top: 58px; }
}

/* D) PDF střihy (třída .fzk-pdf doplňuje skript podle nulové váhy): bez výběru počtu kusů
   v košíku i v malém okně košíku. Sloupec zůstává, aby se ostatní údaje nepohnuly. */
.cart-table tr.removeable.fzk-pdf td.p-quantity > div { display: none !important; }
.cart-table.fzk-jen-pdf .cart-table-header td.p-quantity { visibility: hidden; }
.cart-widget-product.fzk-pdf .cart-widget-product-amount,
.cart-widget-product.fzk-pdf .cart-widget-product-unit { display: none !important; }

/* E) Malé okno košíku na mobilu po odebrání poslední položky: stejný nový prázdný košík
   jako na stránce košíku (blok vkládá skript; na počítači se nezobrazuje). */
@media (max-width: 991px) {
  #cart-widget .fzk-okno-prazdne .cart-widget-product {
    display: block;
    min-height: 0 !important;
    height: auto !important;
    padding: 14px 20px 0;
    margin: 0 0 14px;
    text-align: center;
    font-family: 'Raleway', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
    font-size: 24px;
    font-weight: 700;
    line-height: 1.25;
    color: #000;
  }
  #cart-widget .fzk-okno { padding: 0 20px 24px; }
  #cart-widget .cart-widget-products:has(.fzk-okno-prazdne) { height: auto !important; max-height: calc(100vh - 170px); }
}
@media (min-width: 992px) {
  #cart-widget .fzk-okno { display: none; }
}
