/* ===== Mia Dresses blog (HU) — štýly článkov, verzia 2026-08 =====
   Vložiť raz do HU Shoptet témy (rovnaké miesto ako mia-product-* CSS).
   HTML článkov používa triedy mia-blog-*; bez tohto CSS sa článok
   zobrazí ako obyčajný text s fotkami pod sebou (nič sa nerozbije). */

/* Celý detail blog článku (nadpis + dátum + obsah) na 840 px v strede,
   rovnako ako na SK téme */
.news-item-detail {
  max-width: 840px;
  margin-left: auto;
  margin-right: auto;
}

.mia-blog {
  max-width: 840px;
  margin: 0 auto;
}

.mia-blog img {
  width: 100%;
  height: auto;
  display: block;
}

/* Galéria — 3 (alebo 4) produkty vedľa seba */
.mia-blog-gallery {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin: 20px 0;
}

.mia-blog-gallery__item {
  flex: 1 1 30%;
  min-width: 220px;
  text-align: center;
}

.mia-blog-gallery--four .mia-blog-gallery__item {
  flex: 1 1 22%;
  min-width: 170px;
}

/* Text vedľa fotky (poradie v HTML určuje, čo je vľavo/vpravo) */
.mia-blog-half {
  display: flex;
  flex-wrap: wrap;
  gap: 24px;
  align-items: flex-start;
  margin: 20px 0;
}

.mia-blog-half__text {
  flex: 1 1 55%;
  min-width: 260px;
}

.mia-blog-half__image {
  flex: 1 1 38%;
  min-width: 220px;
  text-align: center;
}

/* Názov produktu pod fotkou */
.mia-blog-img-title {
  display: block;
  margin-top: 6px;
}

/* Mobil */
@media (max-width: 600px) {
  .mia-blog-half__text,
  .mia-blog-half__image {
    flex-basis: 100%;
  }
  .mia-blog-gallery__item {
    flex-basis: 100%;
  }
  .mia-blog-gallery--four .mia-blog-gallery__item {
    flex-basis: 45%;
  }
}
