/**
 * MobileHeaven — Egyedi terméklap
 *
 * A .mh-product-meta és .mh-addon-* osztályokat a
 * "mobileheaven-product-options" bővítmény generálja (tárhely, szín,
 * állapot, akku-egészség, garancia, felár-opciók). A többi osztály a
 * WooCommerce hivatalos, stabil markup-ja.
 */

.woocommerce div.product{
  max-width:1200px;
  margin:0 auto;
  padding:48px 24px;
}

/* ---------- galéria ---------- */
.woocommerce div.product div.images{
  border-radius:var(--mh-radius-lg);
  overflow:hidden;
  background:var(--mh-bg-soft);
}
.woocommerce div.product div.images img{
  object-fit:contain;
}
.woocommerce div.product .flex-control-thumbs li img{
  border-radius:var(--mh-radius-sm);
  opacity:.55;
}
.woocommerce div.product .flex-control-thumbs li img.flex-active{
  opacity:1;
  outline:2px solid var(--mh-text);
  outline-offset:2px;
}

/* ---------- cím + ár ---------- */
.woocommerce div.product .product_title{
  font-size:clamp(26px, 3vw, 36px);
  font-weight:800;
  letter-spacing:-.02em;
  margin-bottom:10px;
}
.woocommerce div.product p.price{
  font-size:26px;
  font-weight:800;
  color:var(--mh-text);
  margin-bottom:20px;
}

/* ---------- készletállapot ---------- */
.woocommerce div.product p.stock{
  display:inline-block;
  font-size:13px;
  font-weight:700;
  padding:6px 14px;
  border-radius:999px;
  margin-bottom:20px;
}
.woocommerce div.product p.stock.in-stock{
  background:rgba(10,138,74,.1);
  color:var(--mh-success);
}
.woocommerce div.product p.stock.out-of-stock{
  background:rgba(192,57,43,.1);
  color:var(--mh-danger);
}

/* ---------- egyedi termék-specifikáció lista (tárhely, szín, állapot stb.) ---------- */
.mh-product-meta{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:1px;
  background:var(--mh-line);
  border:1px solid var(--mh-line);
  border-radius:var(--mh-radius);
  overflow:hidden;
  margin:24px 0;
}
.mh-product-meta-item{
  background:#fff;
  padding:14px 18px;
}
.mh-product-meta-item span{
  display:block;
  font-size:11px;
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:.05em;
  color:var(--mh-muted);
  margin-bottom:4px;
}
.mh-product-meta-item strong{
  font-size:15px;
  font-weight:700;
  color:var(--mh-text);
}

/* ---------- felár-opciók (akku csere, üvegfólia) ---------- */
.mh-addon-options{
  border:1px solid var(--mh-line);
  border-radius:var(--mh-radius);
  padding:18px 20px;
  margin:20px 0;
  background:var(--mh-bg-soft);
}
.mh-addon-options-title{
  font-size:13px;
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:.04em;
  color:var(--mh-muted);
  margin-bottom:12px;
}
.mh-addon-option{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:10px 0;
  border-bottom:1px solid var(--mh-line);
}
.mh-addon-option:last-child{
  border-bottom:none;
}
.mh-addon-option label{
  display:flex;
  align-items:center;
  gap:10px;
  font-size:14.5px;
  font-weight:600;
  color:var(--mh-text);
  cursor:pointer;
}
.mh-addon-option input[type="checkbox"]{
  width:18px;
  height:18px;
  accent-color:var(--mh-text);
}
.mh-addon-option .mh-addon-price{
  font-size:14px;
  font-weight:700;
  color:var(--mh-muted);
}

/* ---------- kosárba gomb ---------- */
.woocommerce div.product form.cart .button{
  background:var(--mh-text);
  color:#fff;
  border-radius:999px;
  padding:16px 36px;
  font-weight:800;
  font-size:15px;
  width:100%;
  max-width:340px;
}
.woocommerce div.product form.cart .button:hover{
  background:#000;
  transform:translateY(-2px);
}

/* ---------- fülek (leírás, vélemények) ---------- */
.woocommerce-tabs ul.tabs li{
  border-radius:999px;
  background:var(--mh-bg-soft);
  margin-right:8px;
}
.woocommerce-tabs ul.tabs li.active{
  background:var(--mh-text);
}
.woocommerce-tabs ul.tabs li.active a{
  color:#fff !important;
}

/* ---------- kapcsolódó termékek ---------- */
.related.products{
  margin-top:64px;
  padding-top:48px;
  border-top:1px solid var(--mh-line);
}
.related.products > h2{
  font-size:24px;
  font-weight:800;
  margin-bottom:24px;
}

@media (max-width: 900px){
  .woocommerce div.product{padding:24px 16px}
  .mh-product-meta{grid-template-columns:1fr}
}
