/* ==========================================================================
   CSS od SEOPRAKTICKY.CZ
   GARDENTEX - kompletni styly
   1) PORADCE PRI VYBERU STINICI TKANINY (kotvici tlacitko + rozbalovaci blok)
   2) FAQ (caste dotazy) bez ramecku, otazky jako podnadpisy
   Prefix trid: gt-
   Barvy: #009901 (sablona), #007701 (tmavsi odstin pro hover),
          #ff6600 / #ff3c00 (duraz), #eeffee (svetly podklad), #1D1D1D (text)
   Hrany: ostre (border-radius 0) napric vsemi prvky
   ========================================================================== */




/* ==========================================================================
   CAST 1: PORADCE PRI VYBERU STINICI TKANINY
   ========================================================================== */


/* --------------------------------------------------------------------------
   1.0 Zaklad, dedeni fontu, box-sizing
   -------------------------------------------------------------------------- */


.gt-guide-wrap,
.gt-guide-wrap *,
.gt-poradce,
.gt-poradce * {
  box-sizing: border-box;
  font-family: inherit;
}


.gt-poradce {
  font-size: inherit;
  color: #1D1D1D;
}


/* Tucny text zustava soucasti vety, nedela vlastni blok */
.gt-poradce strong,
.type-category .gt-poradce strong,
.type-post .gt-poradce strong,
.type-page .gt-poradce strong {
  display: inline !important;
  font-size: inherit !important;
  line-height: inherit !important;
  font-weight: 700;
  margin: 0 !important;
}


/* --------------------------------------------------------------------------
   1.1 Kotvici tlacitko v hornim popisku (.gt-guide-link)
   Klidovy stav: bile s zelenym obrysem. Hover a aktivni stav: plna zelen.
   -------------------------------------------------------------------------- */


.gt-guide-wrap {
  margin: 0 0 20px !important;
  padding: 0 !important;
}


.gt-guide-link,
.type-category .gt-guide-link,
.type-post .gt-guide-link,
.type-page .gt-guide-link {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  min-height: 44px;
  padding: 11px 20px;
  border: 2px solid #009901;
  border-radius: 0;
  background: #fff;
  color: #1D1D1D !important;
  font-size: inherit;
  font-weight: 700;
  line-height: 1.3;
  text-decoration: none !important;
  transition: background-color .2s ease, border-color .2s ease, color .2s ease;
}


/* Ikona "i": zeleny kotouc s bilym symbolem (klidovy stav) */
.gt-guide-link::before {
  content: "";
  display: block;
  width: 20px;
  height: 20px;
  flex-shrink: 0;
  background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'><circle cx='10' cy='10' r='10' fill='%23009901'/><circle cx='10' cy='5.6' r='1.4' fill='%23ffffff'/><rect x='8.8' y='8.4' width='2.4' height='7' fill='%23ffffff'/></svg>") no-repeat center;
  background-size: 20px 20px;
}


.gt-guide-link:hover,
.gt-guide-link:focus,
.type-category .gt-guide-link:hover,
.type-post .gt-guide-link:hover,
.type-page .gt-guide-link:hover {
  background: #009901;
  border-color: #009901;
  color: #fff !important;
  text-decoration: none !important;
}


/* Na zelenem pozadi se ikona invertuje */
.gt-guide-link:hover::before,
.gt-guide-link:focus::before {
  background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'><circle cx='10' cy='10' r='10' fill='%23ffffff'/><circle cx='10' cy='5.6' r='1.4' fill='%23009901'/><rect x='8.8' y='8.4' width='2.4' height='7' fill='%23009901'/></svg>") no-repeat center;
  background-size: 20px 20px;
}


/* Stav pri kliknuti: tmavsi zelen */
.gt-guide-link:active {
  background: #007701;
  border-color: #007701;
  color: #fff !important;
}


.gt-guide-link:active::before {
  background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'><circle cx='10' cy='10' r='10' fill='%23ffffff'/><circle cx='10' cy='5.6' r='1.4' fill='%23007701'/><rect x='8.8' y='8.4' width='2.4' height='7' fill='%23007701'/></svg>") no-repeat center;
  background-size: 20px 20px;
}


/* --------------------------------------------------------------------------
   1.2 Ramecek rozbalovaciho bloku (.gt-poradce)
   -------------------------------------------------------------------------- */


.gt-poradce {
  border: 1px solid #009901;
  border-radius: 0;
  background: #fff;
  margin: 24px 0;
  scroll-margin-top: 90px; /* odsazeni pri skoku z kotvy kvuli fixni hlavicce */
}


/* Cil kotvy uvnitr bloku, diky nemu prohlizec Poradce po kliknuti rozbali */
#gt-poradce-start {
  scroll-margin-top: 100px;
}


/* --------------------------------------------------------------------------
   1.3 Klikaci hlavicka bloku (.gt-poradce__head)
   Svetle zeleny podklad, tmavy text, zelene akcenty
   -------------------------------------------------------------------------- */


.gt-poradce__head,
.type-category .gt-poradce__head,
.type-post .gt-poradce__head,
.type-page .gt-poradce__head {
  list-style: none !important;
  cursor: pointer;
  position: relative;
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 48px;
  padding: 13px 52px 13px 18px;
  background: #eeffee;
  border-radius: 0;
  font-size: 1.1em;
  font-weight: 700;
  line-height: 1.35;
  color: #1D1D1D;
  user-select: none;
  transition: background-color .2s ease;
}


/* Ikona "i" i v hlavicce bloku */
.gt-poradce__head::before {
  content: "";
  display: block;
  width: 20px;
  height: 20px;
  flex-shrink: 0;
  background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'><circle cx='10' cy='10' r='10' fill='%23009901'/><circle cx='10' cy='5.6' r='1.4' fill='%23ffffff'/><rect x='8.8' y='8.4' width='2.4' height='7' fill='%23ffffff'/></svg>") no-repeat center;
  background-size: 20px 20px;
}


/* Skryti nativni sipky prohlizece */
.gt-poradce__head::-webkit-details-marker {
  display: none;
}


.gt-poradce__head::marker {
  content: none;
}


/* Vlastni zelena sipka vpravo */
.gt-poradce__head::after {
  content: "";
  position: absolute;
  right: 18px;
  top: 50%;
  width: 14px;
  height: 9px;
  margin-top: -4px;
  background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 9'><path d='M1.5 1.5 7 7 12.5 1.5' fill='none' stroke='%23009901' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/></svg>") no-repeat center;
  background-size: 14px 9px;
  transition: transform .2s ease;
}


/* Otoceni sipky v rozbalenem stavu */
.gt-poradce[open] .gt-poradce__head::after {
  transform: rotate(180deg);
}


.gt-poradce__head:hover,
.gt-poradce__head:focus {
  background: #e2f5e2;
}


/* Oddeleni hlavicky od obsahu v rozbalenem stavu */
.gt-poradce[open] .gt-poradce__head {
  border-bottom: 1px solid #cfe9cf;
}


/* --------------------------------------------------------------------------
   1.4 Obsah bloku a typografie (.gt-poradce__body)
   -------------------------------------------------------------------------- */


.gt-poradce__body {
  padding: 20px;
}


.gt-poradce__body h2,
.type-category .gt-poradce__body h2,
.type-post .gt-poradce__body h2,
.type-page .gt-poradce__body h2 {
  font-size: 1.3em !important;
  line-height: 1.3;
  color: #1D1D1D;
  margin: 0 0 14px !important;
  padding: 0 !important;
}


.gt-poradce__body h3,
.type-category .gt-poradce__body h3,
.type-post .gt-poradce__body h3,
.type-page .gt-poradce__body h3 {
  font-size: 1.12em !important;
  line-height: 1.35;
  margin: 24px 0 10px !important;
  padding: 0 !important;
}


.gt-poradce__body p,
.type-category .gt-poradce__body p,
.type-post .gt-poradce__body p,
.type-page .gt-poradce__body p {
  font-size: inherit;
  line-height: 1.6;
  margin: 0 0 14px !important;
}


.gt-poradce__body p:last-child,
.gt-poradce__body ul:last-child {
  margin-bottom: 0 !important;
}


/* Odkazy v textu: zelene, po najeti tmavsi */
.gt-poradce__body a,
.type-category .gt-poradce__body a,
.type-post .gt-poradce__body a,
.type-page .gt-poradce__body a {
  color: #009901 !important;
  font-size: inherit;
  text-decoration: underline !important;
  transition: color .2s ease;
}


.gt-poradce__body a:hover,
.gt-poradce__body a:focus,
.type-category .gt-poradce__body a:hover,
.type-post .gt-poradce__body a:hover,
.type-page .gt-poradce__body a:hover {
  color: #007701 !important;
  text-decoration: underline !important;
}


/* Zvyrazneni dulezitych pasazi */
.gt-hl,
.gt-poradce__body .gt-hl {
  color: #ff3c00;
}


/* --------------------------------------------------------------------------
   1.5 Reset Shoptet defaults na ul/li + vlastni odrazky
   -------------------------------------------------------------------------- */


.gt-poradce__body ul,
.type-category .gt-poradce__body ul,
.type-post .gt-poradce__body ul,
.type-page .gt-poradce__body ul {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 0 16px !important;
  background: none !important;
}


.gt-poradce__body li,
.type-category .gt-poradce__body li,
.type-post .gt-poradce__body li,
.type-page .gt-poradce__body li {
  list-style: none !important;
  position: relative;
  padding: 0 0 0 22px !important;
  margin: 0 0 8px !important;
  background: none !important;
  font-size: inherit;
  line-height: 1.6;
}


.gt-poradce__body li::marker {
  content: none;
}


/* Ctvercova odrazka zarovnana na prvni radek i pri zalomeni na vice radku */
.gt-poradce__body li::before,
.type-category .gt-poradce__body li::before,
.type-post .gt-poradce__body li::before,
.type-page .gt-poradce__body li::before {
  content: "" !important;
  position: absolute;
  left: 0;
  top: 0;
  width: 8px;
  height: 1.6em; /* = line-height prvniho radku */
  background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'><rect x='0' y='0' width='8' height='8' fill='%23009901'/></svg>") no-repeat left center;
  background-size: 8px 8px;
}


.gt-poradce__body li:last-child {
  margin-bottom: 0 !important;
}


/* --------------------------------------------------------------------------
   1.6 Zvyrazneny box s benefity (dratek + doprava zdarma)
   -------------------------------------------------------------------------- */


.gt-poradce__note,
.type-category .gt-poradce__note,
.type-post .gt-poradce__note,
.type-page .gt-poradce__note {
  border: 0;
  border-left: 4px solid #ff6600;
  border-radius: 0;
  background: #eeffee;
  padding: 14px 16px;
  margin: 0 0 18px !important;
  line-height: 1.6;
}


/* --------------------------------------------------------------------------
   1.7 Dvousloupcova cast: odrazky vlevo, fotka vejire vpravo
   -------------------------------------------------------------------------- */


.gt-poradce__top {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 24px;
  margin-bottom: 18px;
}


.gt-poradce__text {
  flex: 1 1 420px;
  min-width: 0;
}


.gt-poradce__text ul {
  margin-bottom: 0 !important;
}


.gt-poradce__img {
  flex: 0 1 380px;
  min-width: 0;
}


.gt-poradce__img img,
.type-category .gt-poradce__img img,
.type-post .gt-poradce__img img,
.type-page .gt-poradce__img img {
  display: block;
  width: 100%;
  height: auto;
  max-width: 420px;
  margin: 0 auto;
  border-radius: 0;
}


/* --------------------------------------------------------------------------
   1.8 Responzivita Poradce
   -------------------------------------------------------------------------- */


/* Tablet a nize: fotka se zalomi pod text */
@media (max-width: 767px) {
  .gt-poradce__top {
    gap: 16px;
  }


  .gt-poradce__img {
    flex: 1 1 100%;
  }


  .gt-poradce__body {
    padding: 16px;
  }
}


/* Uzky mobil: tlacitko na plnou sirku, vzdusnejsi a mensi blok */
@media (max-width: 480px) {
  .gt-guide-link {
    width: 100%;
    justify-content: flex-start;
  }


  .gt-poradce__head {
    font-size: 1.02em;
    padding: 12px 42px 12px 14px;
    gap: 8px;
  }


  .gt-poradce__head::after {
    right: 14px;
  }


  .gt-poradce__body {
    padding: 14px;
  }


  .gt-poradce__note {
    padding: 12px 14px;
  }


  .gt-poradce__body h3 {
    margin-top: 20px !important;
  }
}




/* ==========================================================================
   CAST 2: FAQ (caste dotazy)
   Bez ramecku a podbarveni, otazky jako podnadpisy se zobackem
   ========================================================================== */


/* --------------------------------------------------------------------------
   2.0 Zaklad, dedeni fontu, box-sizing
   -------------------------------------------------------------------------- */


.gt-faq,
.gt-faq * {
  box-sizing: border-box;
  font-family: inherit;
}


.gt-faq {
  font-size: inherit;
  color: #1D1D1D;
  border: 0;
  background: none;
  margin: 32px 0;
  padding: 0;
  scroll-margin-top: 90px; /* odsazeni pri skoku z kotvy kvuli fixni hlavicce */
}


/* Tucny text zustava soucasti vety, nedela vlastni blok */
.gt-faq strong,
.type-category .gt-faq strong,
.type-post .gt-faq strong,
.type-page .gt-faq strong {
  display: inline !important;
  font-size: inherit !important;
  line-height: inherit !important;
  font-weight: 700;
  margin: 0 !important;
}


/* --------------------------------------------------------------------------
   2.1 Nadpis sekce (.gt-faq__title)
   -------------------------------------------------------------------------- */


.gt-faq__title,
.type-category .gt-faq__title,
.type-post .gt-faq__title,
.type-page .gt-faq__title {
  display: block;
  background: none !important;
  border: 0 !important;
  font-size: 1.3em !important;
  font-weight: 700;
  line-height: 1.3;
  color: #1D1D1D;
  margin: 0 0 10px !important;
  padding: 0 !important;
}


/* --------------------------------------------------------------------------
   2.2 Jednotliva otazka (.gt-faq__item)
   -------------------------------------------------------------------------- */


.gt-faq__item {
  border: 0;
  background: none;
  margin: 0;
  padding: 0;
}


/* --------------------------------------------------------------------------
   2.3 Klikaci otazka (.gt-faq__q) - chova se jako podnadpis
   -------------------------------------------------------------------------- */


.gt-faq__q,
.type-category .gt-faq__q,
.type-post .gt-faq__q,
.type-page .gt-faq__q {
  list-style: none !important;
  cursor: pointer;
  display: flex;
  align-items: flex-start;
  gap: 10px;
  min-height: 44px;
  padding: 11px 0 !important;
  background: none !important;
  border: 0 !important;
  border-radius: 0;
  font-size: 1.05em;
  font-weight: 700;
  line-height: 1.45;
  color: #1D1D1D;
  user-select: none;
  transition: color .2s ease;
}


/* Skryti nativni sipky prohlizece */
.gt-faq__q::-webkit-details-marker {
  display: none;
}


.gt-faq__q::marker {
  content: none;
}


/* Zobacek pred otazkou, zarovnany na prvni radek textu */
.gt-faq__q::before {
  content: "";
  display: block;
  width: 14px;
  height: 1.45em; /* = line-height otazky, drzi zobacek na prvnim radku */
  flex-shrink: 0;
  background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 9'><path d='M1.5 1.5 7 7 12.5 1.5' fill='none' stroke='%23009901' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/></svg>") no-repeat center;
  background-size: 13px 8px;
  transition: transform .2s ease;
}


/* Otoceni zobacku v rozbalenem stavu */
.gt-faq__item[open] > .gt-faq__q::before {
  transform: rotate(180deg);
}


.gt-faq__q:hover,
.gt-faq__q:focus {
  color: #007701;
  background: none !important;
}


/* Ztmaveni zobacku pri najeti */
.gt-faq__q:hover::before,
.gt-faq__q:focus::before {
  background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 9'><path d='M1.5 1.5 7 7 12.5 1.5' fill='none' stroke='%23007701' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/></svg>") no-repeat center;
  background-size: 13px 8px;
}


/* --------------------------------------------------------------------------
   2.4 Odpoved (.gt-faq__a)
   Leva mezera 24px = sirka zobacku (14) + mezera (10), text lici s otazkou
   -------------------------------------------------------------------------- */


.gt-faq__a {
  padding: 0 0 16px 24px;
  background: none;
  border: 0;
}


.gt-faq__a p,
.type-category .gt-faq__a p,
.type-post .gt-faq__a p,
.type-page .gt-faq__a p {
  font-size: inherit;
  line-height: 1.6;
  margin: 0 0 12px !important;
}


.gt-faq__a p:last-child,
.gt-faq__a ul:last-child {
  margin-bottom: 0 !important;
}


/* Odkazy v odpovedi, zelene, po najeti tmavsi */
.gt-faq__a a,
.type-category .gt-faq__a a,
.type-post .gt-faq__a a,
.type-page .gt-faq__a a {
  color: #009901 !important;
  font-size: inherit;
  text-decoration: underline !important;
  transition: color .2s ease;
}


.gt-faq__a a:hover,
.gt-faq__a a:focus,
.type-category .gt-faq__a a:hover,
.type-post .gt-faq__a a:hover,
.type-page .gt-faq__a a:hover {
  color: #007701 !important;
  text-decoration: underline !important;
}


/* Zvyrazneni dulezitych pasazi */
.gt-faq .gt-hl {
  color: #ff3c00;
}


/* --------------------------------------------------------------------------
   2.5 Reset Shoptet defaults na ul/li + vlastni odrazky uvnitr odpovedi
   -------------------------------------------------------------------------- */


.gt-faq__a ul,
.type-category .gt-faq__a ul,
.type-post .gt-faq__a ul,
.type-page .gt-faq__a ul {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 0 12px !important;
  background: none !important;
}


.gt-faq__a li,
.type-category .gt-faq__a li,
.type-post .gt-faq__a li,
.type-page .gt-faq__a li {
  list-style: none !important;
  position: relative;
  padding: 0 0 0 22px !important;
  margin: 0 0 8px !important;
  background: none !important;
  font-size: inherit;
  line-height: 1.6;
}


.gt-faq__a li::marker {
  content: none;
}


/* Ctvercova odrazka zarovnana na prvni radek i pri zalomeni na vice radku */
.gt-faq__a li::before,
.type-category .gt-faq__a li::before,
.type-post .gt-faq__a li::before,
.type-page .gt-faq__a li::before {
  content: "" !important;
  position: absolute;
  left: 0;
  top: 0;
  width: 8px;
  height: 1.6em; /* = line-height prvniho radku */
  background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'><rect x='0' y='0' width='8' height='8' fill='%23009901'/></svg>") no-repeat left center;
  background-size: 8px 8px;
}


.gt-faq__a li:last-child {
  margin-bottom: 0 !important;
}


/* --------------------------------------------------------------------------
   2.6 Responzivita FAQ
   -------------------------------------------------------------------------- */


/* Tablet a nize */
@media (max-width: 767px) {
  .gt-faq {
    margin: 28px 0;
  }


  .gt-faq__q {
    gap: 9px;
  }


  .gt-faq__a {
    padding-left: 23px;
  }
}


/* Uzky mobil */
@media (max-width: 480px) {
  .gt-faq {
    margin: 24px 0;
  }


  .gt-faq__title {
    font-size: 1.2em !important;
  }


  .gt-faq__q {
    font-size: 1em;
    gap: 8px;
    padding: 10px 0 !important;
  }


  .gt-faq__a {
    padding: 0 0 14px 22px;
  }
}




/* ==========================================================================
   CAST 3: OCHRANA PROTI MEZERAM Z WYSIWYG EDITORU SHOPTETU
   Editor kolem <details> pridava prazdne odstavce a obaluje blok do <p>.
   Tato pravidla nasledky srovnaji, ale nejlepsi je junk smazat ve zdrojaku.
   ========================================================================== */


/* Prazdne odstavce tesne pred nasimi bloky a za nimi */
.gt-poradce + p:empty,
.gt-faq + p:empty,
p:empty:has(+ .gt-poradce),
p:empty:has(+ .gt-faq) {
  display: none !important;
  margin: 0 !important;
  padding: 0 !important;
  height: 0 !important;
}


/* Zbytkove odstavce u bloku alespon bez horni a dolni mezery */
.gt-poradce + p,
.gt-faq + p,
p:has(+ .gt-poradce),
p:has(+ .gt-faq) {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}


/* --------------------------------------------------------------------------
   3.1 Volitelny obal .gt-desc (nejucinnejsi reseni)
   Pokud cely spodni popisek obalite do <div class="gt-desc">, budou vsechny
   prime odstavce v nem povazovany za junk z editoru a skryji se.
   Pozor: skutecny text pak nepatri primo do obalu, ale dovnitr komponent.
   -------------------------------------------------------------------------- */


.gt-desc > p,
.gt-desc > br {
  display: none !important;
}


.gt-desc > *:first-child {
  margin-top: 0 !important;
}


.gt-desc > *:last-child {
  margin-bottom: 0 !important;
}