/* =========================================================
   Elektro Budai – egységes termékkártyák és termékoldal
   Főoldal (Népszerű termékek), kategóriaoldalak, keresés,
   termékoldal (kapcsolódó termékek) — ugyanaz a kártya.
   Térközök: 4 / 8 / 12 / 16 / 24 / 32 px
   ========================================================= */

:root {
  --eb-green: #30b43d;
  --eb-green-dark: #27993a;
  --eb-green-soft: #eaf6ec;
  --eb-ink: #1f2227;
  --eb-muted: #6b7078;
  --eb-line: #e3e6e1;
  --eb-line-hover: #c9d3c7;
  --eb-soft: #f6f7f5;
  --eb-red: #c8372d;
  --eb-radius: 10px;
}

/* ---------------------------------------------------------
   1. KÁRTYA — közös váz
   .brxe-pimpfd  = főoldal „Népszerű termékek” slider
   .brxe-kezius  = termékoldal kapcsolódó termékek slider
   li.repeater-item = kategória- és terméklista
   a.brxe-fmikss = keresési találat
   --------------------------------------------------------- */
.brxe-pimpfd.brxe-block,
.brxe-kezius.brxe-block,
ul.products li.product.repeater-item,
a.brxe-fmikss.brxe-div {
  display: flex;
  flex-direction: column;
  gap: 12px;
  padding: 16px;
  background: #fff;
  border: 1px solid var(--eb-line);
  border-radius: var(--eb-radius);
  color: var(--eb-ink);
  text-decoration: none;
  transition: border-color .15s ease, box-shadow .15s ease;
}
.brxe-pimpfd.brxe-block:hover,
.brxe-kezius.brxe-block:hover,
ul.products li.product.repeater-item:hover,
a.brxe-fmikss.brxe-div:hover {
  border-color: var(--eb-line-hover);
  box-shadow: 0 6px 18px rgba(31, 34, 39, .06);
}

/* a sliderekben egyforma magas kártyák */
#brxe-oxexva-list .splide__slide,
#brxe-lcsuhj-list .splide__slide { height: auto; }

/* belső oszlop: a gomb mindig alul */
.brxe-pimpfd .brxe-hfllxr,
.brxe-kezius .brxe-rlmjhy,
ul.products li.product.repeater-item > a {
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
  gap: 12px;
}
.brxe-pimpfd .brxe-uxmcfx,
.brxe-kezius .brxe-kzgcoa { gap: 6px; }

/* ---- kép: egységes, fehér alapon, nem vág ---- */
.brxe-pimpfd .brxe-otwaig,
.brxe-kezius .brxe-xqgatb,
ul.products li.product.repeater-item > a > div.dynamic:first-child img,
a.brxe-fmikss .brxe-ktmjnr {
  display: block;
  width: 100%;
  height: 200px;
  max-width: 100%;
  object-fit: contain;
  background: #fff;
  border-radius: 6px;
}
ul.products li.product.repeater-item > a > div.dynamic:first-child { width: 100%; }

/* ---- kategória-címke ---- */
.brxe-pimpfd .brxe-uisftb,
.brxe-kezius .brxe-tjwwsh { font-size: 11px; line-height: 1.4; letter-spacing: .06em; text-transform: uppercase; }
.brxe-pimpfd .brxe-uisftb a,
.brxe-kezius .brxe-tjwwsh a { color: var(--eb-muted); text-decoration: none; }

/* ---- terméknév: max. 2 sor, azonos magasság ---- */
.brxe-pimpfd .brxe-ckpmbn,
.brxe-kezius .brxe-vcyygb,
ul.products li.product.repeater-item > a > h5.dynamic,
a.brxe-fmikss .brxe-ockqrk {
  margin: 0;
  font-size: 15px;
  line-height: 1.4;
  font-weight: 600;
  color: var(--eb-ink);
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  min-height: calc(1.4em * 2);
}

/* ---- ár ---- */
.brxe-pimpfd .brxe-hkuolj,
.brxe-kezius .brxe-scxsnv,
ul.products li.product.repeater-item > a > div.dynamic:has(.woocommerce-Price-amount),
a.brxe-fmikss .ce-kereses-ar {
  margin: 0;
  font-size: 17px;
  line-height: 1.3;
  font-weight: 700;
  color: var(--eb-ink);
}
.brxe-pimpfd del, .brxe-kezius del,
ul.products li.product.repeater-item del,
a.brxe-fmikss .ce-kereses-ar del {
  font-size: 13px;
  font-weight: 500;
  color: var(--eb-muted);
  margin-right: 6px;
}
.brxe-pimpfd ins, .brxe-kezius ins,
ul.products li.product.repeater-item ins,
a.brxe-fmikss .ce-kereses-ar ins { text-decoration: none; }

/* ---- „Megtekintés” gomb: alul, teljes szélesség ---- */
.brxe-pimpfd .brxe-mgtaxy,
.brxe-kezius .brxe-lnqawj,
ul.products li.product.repeater-item > a > div.dynamic:last-child,
a.brxe-fmikss::after {
  margin-top: auto;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 10px 14px;
  font-size: 14px;
  font-weight: 600;
  line-height: 1.2;
  color: #fff;
  background: var(--eb-green);
  border-radius: 6px;
  transition: background-color .15s ease;
}
a.brxe-fmikss::after { content: "Megtekintés"; }
.brxe-pimpfd .brxe-mgtaxy:hover,
.brxe-kezius .brxe-lnqawj:hover,
ul.products li.product.repeater-item:hover > a > div.dynamic:last-child,
a.brxe-fmikss:hover::after { background: var(--eb-green-dark); }

/* ---- keresési találat: a kivonat halk, max. 2 sor ---- */
a.brxe-fmikss .brxe-bvcyjw,
a.brxe-fmikss .brxe-bvcyjw p {
  margin: 0;
  font-size: 13px;
  line-height: 1.5;
  color: var(--eb-muted);
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* ---------------------------------------------------------
   2. TERMÉKOLDAL
   --------------------------------------------------------- */
.single-product .woocommerce-product-gallery {
  background: #fff;
  border: 1px solid var(--eb-line);
  border-radius: 14px;
  padding: 24px;
  overflow: hidden;
}
.single-product .woocommerce-product-gallery__image img {
  display: block;
  width: 100%;
  height: auto;
  max-height: 520px;
  object-fit: contain;
}
.single-product .flex-control-thumbs li img {
  border: 1px solid var(--eb-line);
  border-radius: 6px;
  background: #fff;
  object-fit: contain;
}

/* a Bricks az elem azonosítójával (#brxe-…) állítja az árat — ezért itt is azonosító-erősségű szelektor kell */
.single-product .brxe-product-price .price { margin: 0; }
.single-product .brxe-product-price[id] .price > span.amount,
.single-product .brxe-product-price[id] .price ins .amount,
.single-product #brxe-kcqhkn .price > span {
  font-size: 30px;
  line-height: 1.2;
  font-weight: 700;
  color: var(--eb-ink);
}
.single-product .brxe-product-price[id] .price del,
.single-product #brxe-kcqhkn .price del { font-size: 18px; font-weight: 500; color: var(--eb-muted); }
.single-product .brxe-product-price .price ins { text-decoration: none; }

/* egydarabos készletnél a WooCommerce elrejti a mennyiségmezőt — a „db” felirat se maradjon ott egyedül */
.single-product form.cart .quantity:has(input.qty[type="hidden"]),
.single-product form.cart .quantity:has(input.qty[type="hidden"]) + .wc-product-unit { display: none; }

/* készlet: „Készleten” zöld, „Elfogyott” piros — darabszám nélkül */
.single-product .stock {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin: 0 0 12px;
  padding: 4px 10px;
  font-size: 13px;
  font-weight: 600;
  border-radius: 999px;
}
.single-product .stock::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: currentColor; }
.single-product .stock.in-stock,
.single-product .stock.available-on-backorder { color: var(--eb-green-dark); background: var(--eb-green-soft); }
.single-product .stock.out-of-stock { color: var(--eb-red); background: #fbeceb; }

.single-product .brxe-product-add-to-cart form.cart { gap: 12px; flex-wrap: wrap; }
.single-product .brxe-product-add-to-cart .single_add_to_cart_button {
  border-radius: 8px;
  padding: 14px 24px;
  background-color: var(--eb-green);
  transition: background-color .15s ease;
}
.single-product .brxe-product-add-to-cart .single_add_to_cart_button:hover { background-color: var(--eb-green-dark); }
.single-product .brxe-product-add-to-cart .single_add_to_cart_button:focus-visible { outline: 2px solid var(--eb-ink); outline-offset: 3px; }

/* ---- termékdokumentumok (Adatok fül) ---- */
.ce-doks { display: flex; flex-direction: column; gap: 16px; }
.ce-doks__lista { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 8px; margin: 0; padding: 0; list-style: none; }
.ce-dok {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px 14px;
  background: #fff;
  border: 1px solid var(--eb-line);
  border-radius: 8px;
  color: var(--eb-ink);
  text-decoration: none;
}
.ce-dok:hover { border-color: var(--eb-green); }
.ce-dok__ikon {
  flex: 0 0 auto;
  padding: 6px 8px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .04em;
  color: #fff;
  background: var(--eb-red);
  border-radius: 4px;
}
.ce-dok__kep { flex: 0 0 40px; width: 40px; height: 40px; object-fit: cover; border-radius: 4px; }
.ce-dok__nev { flex: 1 1 auto; min-width: 0; font-weight: 600; font-size: 14px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ce-dok__meta { flex: 0 0 auto; font-size: 12px; color: var(--eb-muted); }
.ce-doks__nezet { border-radius: 8px; background: var(--eb-soft); }

/* ---- pénztár: nagygép-tájékoztatás ---- */
.ce-nagygep-info {
  margin: 0 0 16px;
  padding: 12px 14px;
  font-size: 14px;
  line-height: 1.5;
  background: var(--eb-green-soft);
  border-left: 3px solid var(--eb-green);
  border-radius: 6px;
}

/* ---- jogszabályi szavatosság: sor + felugró ablak + aloldal ---- */
.ce-szav-sor { margin: 12px 0 0; }
.ce-szav-nyit {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 0;
  font: inherit;
  font-size: 14px;
  color: #034ea2;
  background: none;
  border: 0;
  text-decoration: underline;
  text-underline-offset: 3px;
  cursor: pointer;
}
.ce-szav-sor__g {
  display: inline-grid;
  place-items: center;
  width: 20px;
  height: 22px;
  font-size: 12px;
  font-weight: 700;
  color: #fff;
  background: #034ea2;
  border-radius: 3px 3px 10px 10px;
  text-decoration: none;
}
.ce-dialog {
  width: min(560px, calc(100vw - 32px));
  max-height: calc(100vh - 48px);
  padding: 40px 16px 16px;
  border: 0;
  border-radius: 12px;
  box-shadow: 0 20px 60px rgba(0, 0, 0, .25);
  overflow: auto;
}
.ce-dialog::backdrop { background: rgba(20, 22, 26, .55); }
.ce-dialog img { display: block; width: 100%; height: auto; }
.ce-dialog__zar {
  position: absolute;
  top: 8px;
  right: 10px;
  width: 32px;
  height: 32px;
  font-size: 24px;
  line-height: 1;
  color: var(--eb-ink);
  background: var(--eb-soft);
  border: 0;
  border-radius: 50%;
  cursor: pointer;
}
.ce-dialog__link { margin: 12px 0 0; font-size: 14px; text-align: center; }
.ce-szav-lap { max-width: 760px; }
.ce-szav-lap__kep { margin: 24px 0; }
.ce-szav-lap__kep img { display: block; width: 100%; max-width: 620px; height: auto; border: 1px solid var(--eb-line); border-radius: 8px; }
.ce-szav-lap h2 { margin-top: 32px; }

/* ---- GARAN jelvény a termékoldalon ---- */
.ce-garan { display: flex; flex-direction: column; gap: 6px; margin: 16px 0 0; }
.ce-garan-nyit { width: 220px; max-width: 100%; padding: 0; background: none; border: 0; cursor: zoom-in; }
.ce-garan-nyit svg { display: block; width: 100%; height: auto; }
.ce-garan__szoveg, .ce-garan__linkek, .ce-garan__regisz { margin: 0; font-size: 14px; }
.ce-garan__linkek a { color: #034ea2; }
.ce-garan__regisz { font-weight: 600; }

/* ---------------------------------------------------------
   3. MOBIL
   --------------------------------------------------------- */
@media (max-width: 767px) {
  .brxe-pimpfd.brxe-block,
  .brxe-kezius.brxe-block,
  ul.products li.product.repeater-item,
  a.brxe-fmikss.brxe-div { padding: 12px; gap: 10px; }

  .brxe-pimpfd .brxe-otwaig,
  .brxe-kezius .brxe-xqgatb,
  ul.products li.product.repeater-item > a > div.dynamic:first-child img,
  a.brxe-fmikss .brxe-ktmjnr { height: 160px; }

  .brxe-pimpfd .brxe-ckpmbn,
  .brxe-kezius .brxe-vcyygb,
  ul.products li.product.repeater-item > a > h5.dynamic,
  a.brxe-fmikss .brxe-ockqrk { font-size: 14px; }

  .single-product .woocommerce-product-gallery { padding: 16px; }
  .single-product .woocommerce-product-gallery__image img { max-height: 360px; }
  .single-product .brxe-product-price[id] .price > span.amount,
  .single-product .brxe-product-price[id] .price ins .amount,
  .single-product #brxe-kcqhkn .price > span { font-size: 24px; }
  .single-product .brxe-product-add-to-cart .single_add_to_cart_button { width: 100%; }
}

@media (prefers-reduced-motion: reduce) {
  .brxe-pimpfd.brxe-block, .brxe-kezius.brxe-block,
  ul.products li.product.repeater-item, a.brxe-fmikss.brxe-div,
  .single-product .single_add_to_cart_button { transition: none; }
}