/* =========================================================
   AURI.sk – vlastné úpravy vzhľadu (presunuté zo Zápätia)
   Súbor: /user/documents/auri-vlastne.css
   ========================================================= */


/* ---------- HODNOTENIA na homepage ---------- */

#hodnoceniobchodu.auri-hore { padding-bottom: 30px; }

#hodnoceniobchodu h2,
#hodnoceniobchodu h2 a {
  font: 700 30px/1.2 'PT Serif', serif !important;
  color: #000 !important;
  text-align: center;
  margin: 0 0 8px;
}

#hodnoceniobchodu .auri-pod {
  max-width: 620px;
  margin: 0 auto 20px;
  text-align: center;
  font: 16px/1.5 'PT Serif', serif;
  color: #000a;
}

html body #hodnoceniobchodu.container .shop-stat-all a.btn {
  background: #AE8D40 !important;
  border-color: #AE8D40 !important;
  color: #fff !important;
}

html body #hodnoceniobchodu.container .shop-stat-all a.btn:hover {
  background: #EE719E !important;
  border-color: #EE719E !important;
}


/* ---------- BLOG: mriežka (.ab = Blog aj homepage, .ah = iba homepage) ---------- */

#content .ab {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 30px 22px;
  padding: 16px 0 40px;
}

#content .ah {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 30px 22px;
  background: #F8F3E8;
  border-radius: 16px;
  padding: 44px 32px 36px;
  margin: 40px 0;
}

#content .ab:before,
#content .ab:after { display: none !important; }


/* ---------- BLOG: nadpis sekcie na homepage ---------- */

#content .ah .homepage-group-title {
  grid-column: 1 / -1;
  margin: 0;
  padding: 0;
  text-align: center;
  font-size: 0;
  line-height: 0;
}

#content .ah .homepage-group-title:before {
  content: "Novinky zo šperkovnice AURI";
  display: block;
  font: 700 30px/1.2 'PT Serif', serif;
  color: #000;
  margin-bottom: 8px;
}

#content .ah .homepage-group-title:after {
  content: "Tipy, inšpirácie a malé tajomstvá zo sveta šperkov.";
  display: block;
  font: 16px/1.5 'PT Serif', serif;
  color: #000a;
}


/* ---------- BLOG: karta článku ---------- */

#content .ab .news-item {
  width: auto !important;
  height: auto !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  flex: none !important;
}

#content .ab .news-item a {
  display: flex !important;
  flex-direction: column;
  height: 100%;
  width: auto !important;
  text-decoration: none !important;
}

/* podsekcie blogu majú inú štruktúru karty (celý článok, bez odkazu okolo karty) */
#content .ab .news-item > div {
  display: flex;
  flex-direction: column;
  width: 100%;
  min-width: 0;
}

#content .ab .text a {
  display: block !important;
  height: auto !important;
}

#content .ab .image {
  width: 100% !important;
  height: auto !important;
  aspect-ratio: 4 / 3;
  border-radius: 10px;
  overflow: hidden;
  background: #FAF0E6;
  margin: 0 0 16px !important;
}

#content .ab img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover;
  border-radius: 0 !important;
  opacity: 1 !important;
  filter: none !important;
  transition: transform .4s;
}

#content .ab a:hover img { transform: scale(1.04); }

/* pôvodne čierna vrstva cez fotku → text pod obrázkom */
#content .ab .text {
  position: static !important;
  width: auto !important;
  height: auto !important;
  background: none !important;
  border-radius: 0 !important;
  padding: 0 !important;
  color: #000 !important;
  display: flex !important;
  flex-direction: column;
  justify-content: flex-start !important;
  flex: 1;
  opacity: 1 !important;
  transform: none !important;
}

#content .ab :is(.title, .title-link) {
  width: auto !important;
  height: auto !important;
  font-weight: 700;
  font-size: 18px !important;
  line-height: 1.3 !important;
  color: #000 !important;
  margin: 0 0 6px !important;
}

#content .ab .description {
  width: auto !important;
  height: auto !important;
  font-size: 14px !important;
  line-height: 1.5 !important;
  color: #000b !important;
  margin: 0 0 12px !important;
  display: -webkit-box !important;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* podsekcie: z celého článku ukázať iba 2 riadky textu, bez dátumu, tabuliek a nadpisov */
#content .ab time,
#content .ab .description :is(table, img, h2, h3) { display: none !important; }

#content .ab .description * {
  display: inline;
  font: inherit !important;
  color: inherit !important;
  margin: 0;
}

#content .ab .read-article {
  margin-top: auto !important;
  font-size: 14px !important;
  font-weight: 700;
  color: #AE8D40 !important;
}

#content .ab a:hover .read-article { color: #EE719E !important; }

/* podsekcie: celá karta klikateľná a pri prejdení myšou sa správa ako na homepage */
#content .ab .news-item { position: relative !important; }

#content .ab a.read-article:after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
}

#content .ab .news-item:hover img { transform: scale(1.04); }
#content .ab .news-item:hover .read-article { color: #EE719E !important; }


/* ---------- BLOG: nadpis a popis na stránke Blog ---------- */

.type-posts-listing .sectionDescription {
  text-align: center;
  max-width: 760px;
  margin-left: auto;
  margin-right: auto;
}


/* ---------- TABLET ---------- */
@media (max-width: 991px) {
  #content .ab { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}


/* ---------- MOBIL ---------- */
@media (max-width: 575px) {
  #content .ab { grid-template-columns: 1fr; gap: 32px; }

  #content .ah {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    padding: 30px 16px 24px;
    gap: 24px 14px;
  }
  #content .ah .homepage-group-title:before { font-size: 23px; }
  #content .ah .homepage-group-title:after { font-size: 14px; }
  #content .ah .title { font-size: 15px !important; }
  #content .ah .description { display: none !important; }

  #hodnoceniobchodu h2,
  #hodnoceniobchodu h2 a { font-size: 23px !important; }
  #hodnoceniobchodu .auri-pod { font-size: 14px; }
}