/* ============================================================
   TopEpoxy – vlastní styly (externí soubor)
   Nahrazuje <style> blok, který přetékal limit 8192 v Záhlaví.
   Obsahuje: A) styly produktových/kategoriálních popisů (.te-*)
             B) SatisFlow fotorecenze (Ocean)
   Nasazení: nahraj do Shoptet Souborů a odkaz přes <link> v hlavičce.
   ============================================================ */

/* ============================================================
   A) TopEpoxy – styly produktových popisů (náhrada Pobo)
   Barvu značky změníte v --te-accent.
   ============================================================ */

.te-desc {
  --te-accent: #e8650d;      /* hlavní barva značky */
  --te-accent-soft: #fdf0e6; /* světlý podklad odvozený od akcentu */
  --te-ink: #1f2328;         /* barva textu nadpisů */
  --te-muted: #5f6b76;       /* tlumený text */
  --te-bg: #f6f7f9;          /* podklad karet */
  --te-line: #e4e8ec;        /* linky a rámečky */
  --te-radius: 14px;

  max-width: 1000px;
  margin: 0 auto;
  line-height: 1.7;
}

.te-desc h2 {
  color: var(--te-ink);
  font-size: 1.55em;
  line-height: 1.3;
  margin: 1.8em 0 0.6em;
}

.te-desc h3 {
  color: var(--te-ink);
  font-size: 1.2em;
  margin: 0 0 0.6em;
}

.te-desc p { margin: 0 0 1em; }
.te-desc img { max-width: 100%; height: auto; border-radius: var(--te-radius); }

/* --- Úvodní blok ------------------------------------------- */
.te-intro { text-align: center; margin-bottom: 2.5em; }
.te-intro h2 { margin-top: 0; font-size: 1.7em; }
.te-intro p { max-width: 760px; margin-left: auto; margin-right: auto; }

/* --- Obrázek + text vedle sebe ------------------------------ */
.te-split {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 2em;
  align-items: center;
  margin: 2.5em 0;
}
.te-split figure { margin: 0; }
@media (max-width: 760px) {
  .te-split { grid-template-columns: 1fr; }
}

/* --- Odrážky s fajfkou -------------------------------------- */
.te-checklist { list-style: none; padding: 0; margin: 0 0 1em; }
.te-checklist li {
  position: relative;
  padding-left: 1.9em;
  margin-bottom: 0.55em;
}
.te-checklist li::before {
  content: "✔";
  position: absolute;
  left: 0;
  top: 0;
  color: var(--te-accent);
  font-weight: 700;
}

/* --- Karta (obsah balení apod.) ------------------------------ */
.te-card {
  background: var(--te-bg);
  border: 1px solid var(--te-line);
  border-radius: var(--te-radius);
  padding: 1.6em 1.8em;
  margin: 2em 0;
}
.te-card h2:first-child, .te-card h3:first-child { margin-top: 0; }

/* --- Poznámka / zvýraznění ----------------------------------- */
.te-note {
  background: var(--te-accent-soft);
  border-left: 4px solid var(--te-accent);
  border-radius: 0 var(--te-radius) var(--te-radius) 0;
  padding: 0.9em 1.2em;
  margin: 1.5em 0;
}
.te-note p:last-child { margin-bottom: 0; }

/* --- Responzivní video --------------------------------------- */
.te-video {
  position: relative;
  padding-top: 56.25%;
  border-radius: var(--te-radius);
  overflow: hidden;
  margin: 2.5em 0;
}
.te-video iframe {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
}

/* --- Recenze --------------------------------------------------- */
.te-reviews__grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1.5em;
}
@media (max-width: 760px) {
  .te-reviews__grid { grid-template-columns: 1fr; }
}
.te-review {
  background: var(--te-bg);
  border: 1px solid var(--te-line);
  border-radius: var(--te-radius);
  padding: 1.4em 1.6em;
  margin: 0;
  font-style: normal;
}
.te-review__stars {
  color: var(--te-accent);
  letter-spacing: 3px;
  margin-bottom: 0.6em;
}
.te-review footer { color: var(--te-muted); font-size: 0.92em; }

/* --- FAQ -------------------------------------------------------- */
.te-faq details {
  border: 1px solid var(--te-line);
  border-radius: var(--te-radius);
  margin-bottom: 0.8em;
  padding: 0;
  background: #fff;
}
.te-faq summary {
  cursor: pointer;
  font-weight: 700;
  color: var(--te-ink);
  padding: 1em 1.3em;
  list-style: none;
  position: relative;
}
.te-faq summary::-webkit-details-marker { display: none; }
.te-faq summary::after {
  content: "+";
  position: absolute;
  right: 1.2em;
  top: 50%;
  transform: translateY(-50%);
  color: var(--te-accent);
  font-size: 1.3em;
  font-weight: 400;
}
.te-faq details[open] summary::after { content: "–"; }
.te-faq details[open] summary { border-bottom: 1px solid var(--te-line); }
.te-faq__answer { padding: 1em 1.3em; }
.te-faq__answer p:last-child { margin-bottom: 0; }

/* --- Oddělovač --------------------------------------------------- */
.te-sep {
  border: 0;
  border-top: 2px solid var(--te-line);
  margin: 3em 0;
}

/* ============================================================
   B) TopEpoxy – SatisFlow fotorecenze (Ocean)
   Scope: #sf-reviews-widget + .sf-review (nesahá na zbytek webu)
   ============================================================ */
/* Nadpis */
#sf-reviews-widget-headline{
  font-weight:800;letter-spacing:.2px;text-align:center;
  color:#0F3A5F;margin:8px 0 22px;position:relative;
}
#sf-reviews-widget-headline::after{
  content:"";display:block;width:64px;height:3px;margin:12px auto 0;
  background:linear-gradient(90deg,#0094E7,#4FC3F7);border-radius:3px;
}
/* Karta recenze */
.sf-review{
  background:#fff;border:1px solid #E3EEF5;border-radius:16px;
  padding:16px 16px 14px;margin:6px;box-shadow:0 4px 14px rgba(15,58,95,.06);
  transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease;
  display:flex;flex-direction:column;
}
.sf-review:hover{
  transform:translateY(-4px);
  box-shadow:0 12px 28px rgba(15,58,95,.14);border-color:#BFE3F7;
}
/* Foto – radius na IMG + vlastní vrstva (translateZ) proti ořezu/nedokreslení spodku fotky v carouselu */
.sf-review-img{margin:0 0 12px;border-radius:12px;overflow:visible;}
.sf-review-img img{width:100%;height:180px;object-fit:cover;display:block;border-radius:12px;
  transform:translateZ(0);backface-visibility:hidden;transition:transform .3s ease;}
.sf-review:hover .sf-review-img img{transform:scale(1.04) translateZ(0);}
/* Jméno + hvězdičky */
.sf-review-name{font-weight:700;color:#0F3A5F;margin-bottom:6px;}
/* Text */
.sf-review-text-p{color:#2B3A44;line-height:1.55;font-size:14.5px;}
/* Odpověď obchodu – SKRYTÁ by default; JS přidá .te-has-response jen když má reálný text. */
.sf-review-response-text{display:none;}
.sf-review-response-text.te-has-response{
  display:block;background:#F5FAFD;border-left:3px solid #0094E7;border-radius:8px;
  padding:8px 12px;margin-top:10px;font-size:13px;color:#385261;
}
/* Upvote */
.sf-upvote-btn-wrapper,.sf-upvote-active-btn-wrapper{margin-top:auto;padding-top:10px;}
/* Branding SatisFlow – zjemnit (nemazat, licenční) */
.sf-widget-brand-link{opacity:.55;font-size:11px;}
/* Šipky Flickity – kulaté brand tlačítko. Na hover NE transform (rozbíjel centrování), jen barva. */
#sf-reviews-widget .flickity-button{
  background:#0094E7;color:#fff;box-shadow:0 3px 10px rgba(0,148,231,.35);
  width:42px;height:42px;transition:background .15s ease;
}
#sf-reviews-widget .flickity-button:hover{background:#0F3A5F;}
#sf-reviews-widget .flickity-page-dots .dot{background:#0094E7;}
/* Sekce – vzduch kolem */
#sf-reviews-widget{padding:8px 0 4px;}
/* Rám carouselu – ořez přesahujících karet do zaobleného rámu */
.te-sf-frame{overflow:hidden;border-radius:16px;}
#sf-reviews-widget .flickity-viewport{border-radius:14px;}
@media(max-width:768px){ .sf-review-img img{height:150px;} }