/* =========================================================
   KERTEK + SINGLE GARDEN – shared layout override-ok (scoped)
   Cél: csak layout. YOO tipó/színek maradnak.
   FONTOS: csak a top-level legacy szekciókat feszítjük ki.
   ========================================================= */

/* ============ FULL-WIDTH LEGACY SZEKCIÓK ============ */
/* KERTEK oldal – csak a #tm-main > .uk-container közvetlen gyerekei */
body.page-id-8 #tm-main > .uk-container > .gray,
body.page-id-8 #tm-main > .uk-container > .gardens,
body.page-id-8 #tm-main > .uk-container > .green {
  width: 100vw;
  max-width: 100vw;
  margin-left: 50%;
  transform: translateX(-50%);
}

/* Ha a KERTEK oldalon a szekciók a site-main alá kerülnek */
body.page-id-8 #tm-main > .uk-container > .site-main > section.gray,
body.page-id-8 #tm-main > .uk-container > .site-main > section.gardens,
body.page-id-8 #tm-main > .uk-container > .site-main > section.green {
  width: 100vw;
  max-width: 100vw;
  margin-left: 50%;
  transform: translateX(-50%);
}

/* SINGLE GARDEN – a site-main alatti legacy szekciók */
body.single.single-garden #tm-main > .uk-container > .site-main > section.gray,
body.single.single-garden #tm-main > .uk-container > .site-main > section.white,
body.single.single-garden #tm-main > .uk-container > .site-main > section.green,
body.single.single-garden #tm-main > .uk-container > .site-main > section.thumb {
  width: 100vw;
  max-width: 100vw;
  margin-left: 50%;
  transform: translateX(-50%);
}

/* Vízszintes scroll ellen – csak itt */
body.page-id-8,
body.single.single-garden {
  overflow-x: hidden;
}

/* ============ KERTEK LISTA: MAP + LIST FLEX ============ */

body.page-id-8 .gardens .wrap {
  display: flex;
  gap: 24px;
  align-items: flex-start;
}

body.page-id-8 .gardens .garden-map-list {
  flex: 0 0 360px;
  max-width: 360px;
}

body.page-id-8 .gardens .garden-map.google-map {
  flex: 1 1 auto;
  width: auto !important;  /* inline 880px felülírás */
  min-width: 320px;
}

@media (max-width: 960px) {
  body.page-id-8 .gardens .wrap { display: block; }

  body.page-id-8 .gardens .garden-map-list,
  body.page-id-8 .gardens .garden-map.google-map {
    max-width: none;
    width: 100% !important;
  }

  body.page-id-8 .gardens .garden-map.google-map { margin-top: 16px; }
}

/* ============ PADDING NULLÁZÁS ============ */

body.page-id-8 #tm-main {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

body.page-id-8 #tm-main .uk-section.uk-section-default {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

body.single-garden #tm-main {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

body.single-garden #tm-main .uk-section.uk-section-default {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

/* SINGLE GARDEN – titlebar kapja meg az új hero-grey + SVG alnyomat hátteret */
body.single.single-garden section.gray.titlebar {
  background-color: #f6f6f6;
  background-image: url("/wp-content/themes/child/assets/img/hero-watermark.svg");
  background-repeat: no-repeat;
  background-position: 50% 35%;
  background-size: 1400px auto;
}

/* ============ SINGLE GARDEN – ikon + kontakt linkek ============ */

body.single.single-garden .titlebar .map-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-left: auto;
  text-decoration: none;
}

body.single.single-garden .titlebar .map-icon img {
  width: 36px;
  height: auto;
  transition: transform .2s ease;
}


body.single.single-garden .titlebar .map-icon:hover img {
  transform: scale(1.1);
}

body.single.single-garden .garden-contacts .contact-link {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  text-decoration: none;
  font-weight: normal;
  color: inherit;
}

body.single.single-garden .garden-contacts .contact-link:hover {
  text-decoration: underline;
}

/* =========================================================
   KERTEK – térkép melletti lista fix magasság + scroll (legacy viselkedés)
   Eredeti: height:600px; overflow-y:scroll; width:240px; padding-right:10px;
   ========================================================= */

body.page-id-8 .gardens .garden-map-list {
  height: 600px;
  overflow-y: auto;
  padding-right: 10px;

  /* a jelenlegi flex beállításaidhoz */
  flex: 0 0 360px;
  max-width: 360px;
}

body.page-id-8 .garden-map-list h3 {
  margin: 0 0 6px;
}

body.page-id-8 .gardens .wrap {
  align-items: flex-start; /* maradjon, a lista magasságát úgyis a height adja */
  gap: 24px;               /* nálad már így van, itt csak emlékeztető */
}

/* Mobilon ne korlátozzuk (egymás alá kerül) */
@media (max-width: 960px) {
  body.page-id-8 .gardens .garden-map-list {
    height: auto;
    max-height: none;
    overflow: visible;
    flex: none;
    max-width: none;
    padding-right: 0;
  }
}

/* =========================================================
   SINGLE GARDEN – HERO (section.thumb háttérképes nyitókép)
   Legacy logika vissza: fix magasság + cover + no padding
   ========================================================= */

body.single.single-garden #tm-main section.thumb {
  height: 400px;                 /* legacy */
  padding: 0 !important;         /* ne örököljön section paddinget */
  background-position: 50% 50% !important;
  background-size: cover !important;
  background-repeat: no-repeat;
  width: 100%;
  overflow: hidden;
}

/* Ha a thumb szekcióban van belső wrap (néha üres), ne tolja szét */
body.single.single-garden #tm-main section.thumb .wrap,
body.single.single-garden #tm-main section.thumb .uk-container,
body.single.single-garden #tm-main section.thumb .uk-container > * {
  margin: 0 !important;
  padding: 0 !important;
}

/* Mobilon kisebb */
@media (max-width: 750px) {
  body.single.single-garden #tm-main section.thumb {
    height: 260px;
  }
}

/* =========================================================
   KERTEK – FILTER SOR (legacy arány + modern tipó)
   ========================================================= */

body.page-id-8 .secondary.center .filters.kk-kertek-filters {
  display: flex;
  gap: 20px;
  margin-left: auto;
  margin-right: auto;
  max-width: 1140px;
  width: 90%;
  align-items: flex-end;
  justify-content: center;
}

/* container ne nyúljon szét */
body.page-id-8 .secondary.center .filters.kk-kertek-filters .select-container {
  flex: 0 0 auto;
  text-align: left;
}

/* label */
body.page-id-8 .secondary.center .filters.kk-kertek-filters .kk-filter-label {
  display: block;
  margin-bottom: 8px;
  font-size: 15px;
  font-weight: 600;
  line-height: 1.2;
}

/* legacy wrapper nullázása */
body.page-id-8 .secondary.center .filters.kk-kertek-filters .select-box {
  background: transparent;
  border: 0;
  padding: 0;
  margin: 0;
}

/* régi FA nyíl kikapcsolása */
body.page-id-8 .secondary.center .filters.kk-kertek-filters .select-box:after {
  display: none !important;
}

/* ===== A LÉNYEG: 330px fix szélesség, mint legacy ===== */

body.page-id-8 .secondary.center .filters.kk-kertek-filters .uk-select {
  width: 330px;        /* ← legacy arány */
  max-width: 100%;
  font-size: 16px;     /* modern tipó */
  font-weight: 500;
  height: 52px;        /* legacy magasság */
  padding-left: 20px;  /* legacy padding */
}

/* ===== Mobil ===== */

@media (max-width: 750px) {

  body.page-id-8 .secondary.center .filters.kk-kertek-filters {
    display: block;
    width: 90%;
  }

  body.page-id-8 .secondary.center .filters.kk-kertek-filters .select-container + .select-container {
    margin-top: 12px;
  }

  body.page-id-8 .secondary.center .filters.kk-kertek-filters .uk-select {
    width: 100%;
    max-width: 420px;
  }
}


/* =========================================================
   SINGLE GARDEN – garden-qualities layout (markup: .garden-qualities > .garden-quality)
   Cél: ikonok egymás mellett, wrap-pal; legacy uppercase felirat
   ========================================================= */

body.single.single-garden .garden-qualities {
  margin: 0;
  text-align: center;

  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 24px 36px; /* sor / oszlop gap */
}

/* egy ikon+felirat blokk */
body.single.single-garden .garden-qualities .garden-quality {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;

  /* ne legyen 100% széles */
  flex: 0 0 auto;
  width: 140px; /* finom: 120–160 között jó szokott lenni */
}

/* ikon méret (a bevált) */
body.single.single-garden .garden-qualities .garden-quality img,
body.single.single-garden .garden-qualities .garden-quality svg {
  width: 90px;
  height: 90px;
  display: block;
}

/* felirat – legacy jelleg */
body.single.single-garden .garden-qualities .garden-quality p {
  margin: 0;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 1px;
  text-transform: uppercase;
  line-height: 1.2;
}

/* mobil: kisebb blokkok, több férjen */
@media (max-width: 750px) {
  body.single.single-garden .garden-qualities {
    gap: 16px 20px;
  }

  body.single.single-garden .garden-qualities .garden-quality {
    width: 120px;
  }

  body.single.single-garden .garden-qualities .garden-quality img,
  body.single.single-garden .garden-qualities .garden-quality svg {
    width: 64px;
    height: 64px;
  }
}

/* =========================================================
   SINGLE GARDEN – garden-block táblázat (szám + mértékegység inline)
   ========================================================= */

body.single.single-garden table.garden-block {
  width: 100%;
  border-collapse: collapse;
}

body.single.single-garden table.garden-block tr td {
  width: 25%;
  text-align: right;
  vertical-align: top;

  font-size: 20px;      /* legacy arány */
  padding-right: 20px;
}

/* a cím (h3) ne legyen túl nagy, de maradhat erősebb */
body.single.single-garden table.garden-block tr td h3 {
  margin: 0 0 6px;
}

/* a nagy szám inline legyen, hogy a mértékegység mellé üljön */
body.single.single-garden table.garden-block tr td h2 {
  display: inline-block;
  margin: 0 6px 0 0;    /* legacy: margin-right 5px */
  font-size: 40px;
  font-weight: 700;
  line-height: 1;
  vertical-align: baseline;
}

/* a mértékegység/sup is inline-baseline */
body.single.single-garden table.garden-block tr td sup {
  font-size: 0.7em;
  vertical-align: super;
}

/* mobilon: 2 oszlop, majd 1 oszlop (ha kell) */
@media (max-width: 960px) {
  body.single.single-garden table.garden-block tr {
    display: flex;
    flex-wrap: wrap;
    gap: 16px 0;
  }

  body.single.single-garden table.garden-block tr td {
    width: 50%;
    padding-right: 0;
    text-align: left;
  }
}

@media (max-width: 520px) {
  body.single.single-garden table.garden-block tr td {
    width: 100%;
  }
}

/* =========================================================
   SINGLE GARDEN – garden-article (bal cím jobbra, jobb szöveg sorkizárt)
   Markup: article.garden-article > .garden-article-left + .garden-article-right
   ========================================================= */

/* A legacy “section center” örökséget itt levesszük, mert ez tartalom szekció */
body.single.single-garden section.gray .wrap {
  text-align: left;
}

/* Két oszlop stabilan */
body.single.single-garden article.garden-article {
  display: flex;
  gap: 24px;
  align-items: flex-start;
  margin-top: 20px;
}

/* Bal oszlop: fix szélesség, cím jobbra */
body.single.single-garden article.garden-article .garden-article-left {
  flex: 0 0 200px;
  width: 200px;
  text-align: right;
}

body.single.single-garden article.garden-article .garden-article-left h3 {
  margin: 0;
  text-align: right;
}

/* Jobb oszlop: kitölti, sorkizárt */
body.single.single-garden article.garden-article .garden-article-right {
  flex: 1 1 auto;
  margin-left: 0 !important; /* ha legacy margin-left maradt */
  text-align: justify;
}

/* A contact blokkban a jobb oldal uk-list, ott ne erőltessük a justify-t */
body.single.single-garden article.garden-article.garden-contacts .garden-article-right {
  text-align: left;
}

/* Mobil: egymás alá, cím balra */
@media (max-width: 960px) {
  body.single.single-garden article.garden-article {
    display: block;
  }

  body.single.single-garden article.garden-article .garden-article-left,
  body.single.single-garden article.garden-article .garden-article-right {
    width: auto;
  }

  body.single.single-garden article.garden-article .garden-article-left,
  body.single.single-garden article.garden-article .garden-article-left h3 {
    text-align: left;
  }

  body.single.single-garden article.garden-article .garden-article-right {
    margin-top: 8px;
  }
}

/* =========================================================
   SINGLE GARDEN – green section CTA button fix
   ========================================================= */

body.single.single-garden section.green a.button {
  background: #fff;
  color: var(--kk-green);
  font-weight: 700;
  border: 2px solid #fff;
}

/* Hover: valódi inverz, ne csak enyhe */
body.single.single-garden section.green a.button:hover {
  background: transparent;
  color: #fff;
  border-color: #fff;
  text-decoration: none;
}



/* KERTEK (page-id-8): egységes hero háttér + tabbed-layout */
body.single.single-garden section.gray.titlebar,
body.page-id-8 #tm-main > .uk-container > .gray,
body.page-id-8 .tabbed-layout {
  background-color: #f8f7f4;
  background-image: url("/wp-content/uploads/hero-watermark.svg");
  background-repeat: no-repeat;
  background-position: 50% 35%;
  background-size: 1800px;
}

body.single.single-garden .garden-categories{
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 6px 0 12px;
}

body.single.single-garden .garden-category-tag{
  display: inline-block;
  padding: 4px 10px;
  border: 1px solid rgba(0,0,0,.18);
  border-radius: 999px;
  font-size: 13px;
  line-height: 1.2;
  background: rgba(255,255,255,.55);
  color: inherit;
  white-space: nowrap;
}