/* TMG Professional Product Grid v1.0.0
   Scoped to product-loop cards only. Does not change single-product layouts. */

body.tmgpg-active{
  --tmgpg-yellow:#ffed00;
  --tmgpg-yellow-hover:#f1df00;
  --tmgpg-black:#111;
  --tmgpg-text:#181a1d;
  --tmgpg-muted:#747a80;
  --tmgpg-line:#e7e8e8;
  --tmgpg-soft:#f4f5f3;
  --tmgpg-green:#168443;
}

/* WooCommerce / Woodmart product cards */
body.tmgpg-active :is(
  .products .product,
  .wd-products .product-grid-item,
  .wd-products .wd-product,
  .related.products .product,
  .upsells.products .product,
  .cross-sells .product,
  .woocommerce[class*="columns-"] .product
).tmgpg-card{
  position:relative!important;
  overflow:hidden!important;
  display:flex!important;
  flex-direction:column!important;
  min-height:100%!important;
  padding:0!important;
  border:1px solid var(--tmgpg-line)!important;
  border-radius:20px!important;
  background:#fff!important;
  box-shadow:none!important;
  transition:transform .22s ease,box-shadow .22s ease,border-color .22s ease!important;
}

body.tmgpg-active :is(
  .products .product,
  .wd-products .product-grid-item,
  .wd-products .wd-product,
  .related.products .product,
  .upsells.products .product,
  .cross-sells .product,
  .woocommerce[class*="columns-"] .product
).tmgpg-card:hover{
  transform:translateY(-4px)!important;
  border-color:#d9dbdb!important;
  box-shadow:0 16px 38px rgba(0,0,0,.09)!important;
}

/* Neutralize Woodmart inner card layers */
body.tmgpg-active .tmgpg-card :is(
  .product-wrapper,
  .product-element-bottom,
  .wd-product-wrapper
){
  display:flex!important;
  flex-direction:column!important;
  flex:1 1 auto!important;
  min-height:0!important;
  margin:0!important;
  padding:0!important;
  background:transparent!important;
  box-shadow:none!important;
  border:0!important;
}

/* Image area */
body.tmgpg-active .tmgpg-card :is(
  .product-element-top,
  .product-image-link,
  .wd-product-img,
  .product-image-wrap
){
  position:relative!important;
  overflow:hidden!important;
  width:100%!important;
  margin:0!important;
  border-radius:0!important;
  background:var(--tmgpg-soft)!important;
}

body.tmgpg-active .tmgpg-card .product-element-top{
  aspect-ratio:1 / 1!important;
  border-bottom:4px solid #191b1e!important;
}

body.tmgpg-active .tmgpg-card .product-element-top :is(img,.attachment-woocommerce_thumbnail){
  width:100%!important;
  height:100%!important;
  min-height:100%!important;
  object-fit:cover!important;
  object-position:center!important;
  display:block!important;
  transition:transform .35s ease!important;
}

body.tmgpg-active .tmgpg-card:hover .product-element-top :is(img,.attachment-woocommerce_thumbnail){
  transform:scale(1.025)!important;
}

/* Hide clutter that competes with the clean reference */
body.tmgpg-active .tmgpg-card :is(
  .wd-product-cats,
  .wd-product-brands,
  .wd-product-brands-links,
  .wd-product-nav-btn,
  .wd-entities-title + .wd-product-cats,
  .star-rating,
  .wd-product-stock:not(.tmgpg-stock),
  .product-rating-price .star-rating
){
  display:none!important;
}

/* Content spacing */
body.tmgpg-active .tmgpg-card .product-element-bottom{
  padding:17px 18px 0!important;
}

/* Product title */
body.tmgpg-active .tmgpg-card :is(
  .wd-entities-title,
  .woocommerce-loop-product__title,
  .product-title
){
  order:1!important;
  margin:0 0 17px!important;
  color:var(--tmgpg-text)!important;
  font-size:clamp(17px,1.25vw,21px)!important;
  line-height:1.22!important;
  font-weight:750!important;
  letter-spacing:-.025em!important;
  min-height:2.44em!important;
}

body.tmgpg-active .tmgpg-card :is(
  .wd-entities-title,
  .woocommerce-loop-product__title,
  .product-title
) a{
  color:inherit!important;
  text-decoration:none!important;
}

/* Price + stock row */
body.tmgpg-active .tmgpg-card .tmgpg-meta-row{
  order:2!important;
  width:100%!important;
  min-height:34px!important;
  margin:0 0 16px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:12px!important;
}

body.tmgpg-active .tmgpg-card .tmgpg-meta-row .price{
  margin:0!important;
  padding:0!important;
  color:#17191b!important;
  font-size:14px!important;
  line-height:1.2!important;
  font-weight:850!important;
}

body.tmgpg-active .tmgpg-card .tmgpg-meta-row .price :is(ins,del){
  color:inherit!important;
}

body.tmgpg-active .tmgpg-card .tmgpg-stock{
  flex:0 0 auto!important;
  display:inline-flex!important;
  align-items:center!important;
  min-height:25px!important;
  padding:0 9px!important;
  border-radius:100px!important;
  background:#eaf5ee!important;
  color:var(--tmgpg-green)!important;
  font-size:9px!important;
  line-height:1!important;
  font-weight:900!important;
  text-transform:uppercase!important;
  letter-spacing:.05em!important;
}

body.tmgpg-active .tmgpg-card .tmgpg-stock.is-out{
  background:#f7e9e9!important;
  color:#a72929!important;
}

/* Existing price containers become neutral */
body.tmgpg-active .tmgpg-card :is(
  .wrap-price,
  .product-rating-price
){
  margin:0!important;
  padding:0!important;
}

/* Full-width TMG action area */
body.tmgpg-active .tmgpg-card .tmgpg-action-slot{
  order:99!important;
  width:calc(100% + 36px)!important;
  margin:auto -18px 0!important;
  padding:0!important;
}

body.tmgpg-active .tmgpg-card .tmgpg-action-slot :is(
  .wd-add-btn,
  .wd-add-btn-replace,
  .wd-add-btn-replace-mb,
  .add-to-cart-loop
){
  width:100%!important;
  margin:0!important;
  padding:0!important;
  display:block!important;
}

/* The button itself */
body.tmgpg-active .tmgpg-card .tmgpg-action-slot :is(
  a.button,
  a.add_to_cart_button,
  a.product_type_variable,
  a.product_type_simple,
  a.product_type_grouped,
  a.tmgpg-loop-button,
  button
){
  position:relative!important;
  width:100%!important;
  min-height:57px!important;
  margin:0!important;
  padding:0 18px!important;
  border:0!important;
  border-radius:0 0 19px 19px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  background:var(--tmgpg-yellow)!important;
  color:#17191b!important;
  box-shadow:none!important;
  font-size:clamp(16px,1.3vw,20px)!important;
  line-height:1.15!important;
  font-weight:850!important;
  text-align:center!important;
  opacity:1!important;
  visibility:visible!important;
  text-transform:none!important;
  letter-spacing:-.02em!important;
  transition:background .2s ease,color .2s ease!important;
}

body.tmgpg-active .tmgpg-card .tmgpg-action-slot :is(
  a.button,
  a.add_to_cart_button,
  a.product_type_variable,
  a.product_type_simple,
  a.product_type_grouped,
  a.tmgpg-loop-button,
  button
):hover{
  background:#111!important;
  color:#fff!important;
}

/* Make Woodmart inner labels inherit button color, fixing invisible hover text */
body.tmgpg-active .tmgpg-card .tmgpg-action-slot :is(a,button) :is(span,strong){
  color:inherit!important;
  opacity:1!important;
  visibility:visible!important;
}

/* Remove Woodmart floating/transform behavior around action buttons */
body.tmgpg-active .tmgpg-card :is(
  .wd-add-btn,
  .wd-add-btn-replace,
  .wd-add-btn-replace-mb,
  .add-to-cart-loop
){
  position:static!important;
  inset:auto!important;
  transform:none!important;
  opacity:1!important;
  visibility:visible!important;
}

/* Hide duplicated secondary quick-action button only when JS has selected main slot */
body.tmgpg-active .tmgpg-card .tmgpg-secondary-action{
  display:none!important;
}

/* Sale / new badges remain visible but cleaner */
body.tmgpg-active .tmgpg-card :is(.product-labels,.labels-rounded){
  top:12px!important;
  left:12px!important;
  right:auto!important;
  z-index:3!important;
}

body.tmgpg-active .tmgpg-card .product-label{
  border-radius:100px!important;
  padding:6px 9px!important;
  font-size:9px!important;
  font-weight:850!important;
}

/* Grid spacing */
body.tmgpg-active :is(.wd-products,.products){
  gap:20px!important;
}

/* Related products: same design without inherited single-product plugin overrides */
body.tmgpg-active .related.products .tmgpg-card{
  border-radius:20px!important;
}

/* Prevent single product from being affected */
body.tmgpg-active.single-product .single-product-page > .product-image-summary-wrap,
body.tmgpg-active.single-product .product-image-summary{
  /* intentionally untouched */
}

/* Tablet */
@media(max-width:1024px){
  body.tmgpg-active .tmgpg-card .product-element-bottom{
    padding:15px 15px 0!important;
  }
  body.tmgpg-active .tmgpg-card .tmgpg-action-slot{
    width:calc(100% + 30px)!important;
    margin-left:-15px!important;
    margin-right:-15px!important;
  }
  body.tmgpg-active .tmgpg-card .tmgpg-action-slot :is(a.button,a.add_to_cart_button,a.product_type_variable,a.product_type_simple,a.tmgpg-loop-button,button){
    min-height:52px!important;
    font-size:16px!important;
  }
}

/* Mobile */
@media(max-width:767px){
  body.tmgpg-active :is(.wd-products,.products){
    gap:13px!important;
  }

  body.tmgpg-active .tmgpg-card{
    border-radius:15px!important;
  }

  body.tmgpg-active .tmgpg-card .product-element-top{
    border-bottom-width:3px!important;
  }

  body.tmgpg-active .tmgpg-card .product-element-bottom{
    padding:12px 12px 0!important;
  }

  body.tmgpg-active .tmgpg-card :is(.wd-entities-title,.woocommerce-loop-product__title,.product-title){
    margin-bottom:12px!important;
    min-height:2.4em!important;
    font-size:15px!important;
  }

  body.tmgpg-active .tmgpg-card .tmgpg-meta-row{
    align-items:flex-end!important;
    gap:6px!important;
    margin-bottom:12px!important;
  }

  body.tmgpg-active .tmgpg-card .tmgpg-meta-row .price{
    font-size:12px!important;
  }

  body.tmgpg-active .tmgpg-card .tmgpg-stock{
    min-height:20px!important;
    padding:0 6px!important;
    font-size:7px!important;
  }

  body.tmgpg-active .tmgpg-card .tmgpg-action-slot{
    width:calc(100% + 24px)!important;
    margin-left:-12px!important;
    margin-right:-12px!important;
  }

  body.tmgpg-active .tmgpg-card .tmgpg-action-slot :is(
    a.button,
    a.add_to_cart_button,
    a.product_type_variable,
    a.product_type_simple,
    a.tmgpg-loop-button,
    button
  ){
    min-height:47px!important;
    border-radius:0 0 14px 14px!important;
    padding:0 8px!important;
    font-size:13px!important;
  }
}

@media(prefers-reduced-motion:reduce){
  body.tmgpg-active .tmgpg-card,
  body.tmgpg-active .tmgpg-card *,
  body.tmgpg-active .tmgpg-card img{
    transition:none!important;
  }
}
