/* =====================================================================
   Bambusář – články převzaté z WordPressu (Divi) → Shoptet
   Vše je scopované pod .bmb-wp, šablonu eshopu to neovlivní.
   Hodnoty odpovídají vykreslení na www.bambusar.cz (desktop, 09/2026).
   Použití: obsah článku vložit jako HTML (začíná <div class="bmb-wp">),
   tento blok přidat na konec custom.css a zvednout ?v=.
   ===================================================================== */

.bmb-wp {
  --bmb-green: #25c691;
  --bmb-text: #666;
  --bmb-heading: #333;
  --bmb-alt-bg: #eee;
  --bmb-quote: #2ea3f2;      /* barva citace z Divi; pro sjednocení s eshopem stačí dát var(--bmb-green) */
  --bmb-row-max: 1080px;
  --bmb-gap: 30px;

  color: var(--bmb-text);
  font-family: "Open Sans", sans-serif;
  font-size: 18px;
  font-weight: 500;          /* WP má 500, ale eshop řez Open Sans 500 nenačítá */
  line-height: 1.5;
}

/* ---------- Rozvržení ---------- */
.bmb-wp .bmb-sec { padding: 54px 20px; }
.bmb-wp .bmb-sec--alt {
  background: var(--bmb-alt-bg);
  box-shadow: 0 0 0 100vmax var(--bmb-alt-bg);
  clip-path: inset(0 -100vmax);
}

.bmb-wp .bmb-row {
  max-width: var(--bmb-row-max);
  margin: 0 auto;
  padding: 27px 0;
}

.bmb-wp .bmb-cols { display: flex; gap: 5.5%; }
.bmb-wp .bmb-col { flex: 1 1 0; min-width: 0; }

/* mezera mezi bloky; popisek hned pod obrázkem bez mezery */
.bmb-wp .bmb-row:not(.bmb-cols) > * + *,
.bmb-wp .bmb-col > * + * { margin-top: var(--bmb-gap); }
.bmb-wp .bmb-img + .bmb-text { margin-top: 0; }

/* ---------- Nadpis stránky (H1 vypisuje Shoptet mimo .bmb-wp) ---------- */
.pageArticleDetail:has(.bmb-wp) > header h1 { text-align: center; }
.pageArticleDetail:has(.bmb-wp) > header h1::after {
  content: "";
  display: block;
  width: 40%;
  max-width: 432px;
  height: 1px;
  margin: 19px auto 8px;
  background: #25c691;
}

/* ---------- Typografie (reset proti stylům Shoptetu) ---------- */
.bmb-wp h2,
.bmb-wp h3,
.bmb-wp h4 {
  margin: 0;
  padding: 0 0 10px;
  color: var(--bmb-heading);
  font-family: Roboto, sans-serif;
  font-weight: 500;
  line-height: 1;
}
.bmb-wp h2 { font-size: 26px; }
.bmb-wp h3 { font-size: 22px; }
.bmb-wp h4 { font-size: 18px; }

.bmb-wp p { margin: 0; padding-bottom: 1em; }
.bmb-wp p:last-child { padding-bottom: 0; }
.bmb-wp .bmb-small { font-size: 90%; line-height: 1.5; }

.bmb-wp ul,
.bmb-wp ol {
  margin: 0;
  padding: 0 0 18px 18px;
  line-height: 26px;
}
.bmb-wp ul { list-style: disc outside; }
.bmb-wp ol { list-style: decimal inside; padding-left: 0; }
.bmb-wp ul:last-child,
.bmb-wp ol:last-child { padding-bottom: 0; }
.bmb-wp li { margin: 0; padding: 0; }

.bmb-wp strong { font-weight: 700; }
.bmb-wp a { color: var(--bmb-green); text-decoration: none; }
.bmb-wp a:hover { text-decoration: underline; }

.bmb-wp blockquote {
  margin: 0 0 30px;
  padding: 0 0 0 20px;
  border-left: 5px solid var(--bmb-quote);
}
.bmb-wp blockquote:last-child { margin-bottom: 0; }

.bmb-wp .bmb-center { text-align: center; }
.bmb-wp .bmb-right { text-align: right; }

/* ---------- Obrázky a galerie ---------- */
.bmb-wp .bmb-img { margin: 5px 0 0; line-height: 0; }
.bmb-wp .bmb-img img { display: block; width: 100%; height: auto; }

/* Shoptet galerie (.plus-gallery-*) jen uvnitř převzatého článku:
   řádek 94 % šířky okna, 4 sloupce, mezera 3 %, bez šedého rámečku.
   !important jen u width/height – Shoptet je nastavuje skriptem do style="" */
.bmb-wp .plus-gallery-wrap {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 0 3%;
  align-items: start;
  width: min(94vw, 2080px);  /* strop: položka max. ~473 px = šířka _small náhledu, bez zvětšování */
  margin: 40px 0 0 calc(50% - min(47vw, 1040px));
}
.bmb-wp .plus-gallery-item {
  width: auto !important;
  height: auto !important;
  max-width: none;
  margin: 0;
  border: 0;
  line-height: 0;
}
.bmb-wp .plus-gallery-item a { display: block; }
.bmb-wp .plus-gallery-item img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 400 / 284;   /* poměr náhledů z webu; fotky na výšku se oříznou */
  object-fit: cover;
  position: static;          /* Shoptet centruje img přes top:50% + translateY(-50%) – */
  transform: none;           /* bez pevné výšky položky by galerie vyjela nahoru přes text */
}

/* ---------- Tlačítko ---------- */
.bmb-wp .bmb-btn-wrap { text-align: center; padding: 0; }
.bmb-wp .bmb-btn {
  display: inline-block;
  padding: 6px 20px;
  border: 2px solid var(--bmb-green);
  border-radius: 3px;
  background: var(--bmb-green);
  color: #fff;
  font-size: 20px;
  font-weight: 500;
  line-height: 1.7;
}
.bmb-wp .bmb-btn:hover { text-decoration: none; filter: brightness(1.08); }

/* ---------- Tablet a mobil (Divi láme sloupce pod 981 px) ---------- */
@media (max-width: 980px) {
  .bmb-wp .bmb-sec { padding: 50px 0; }
  .bmb-wp .bmb-sec--alt { padding-left: 15px; padding-right: 15px; }
  .bmb-wp .bmb-row { padding: 30px 0; }
  .bmb-wp .bmb-cols { flex-direction: column; gap: var(--bmb-gap); }
  .bmb-wp .plus-gallery-wrap { width: auto; margin-left: 0; grid-template-columns: repeat(2, 1fr); gap: 16px; }
}

