/**
 * Kitchenaire — JKit product carousel/grid card alignment
 *
 * Root cause of "content drifts left of the image":
 * JKit wraps image + title + price + rating inside an INLINE <a class="jkit-product-link">.
 * An inline element containing block-level children triggers inline-box splitting, so the
 * card's left padding (st_wrapper_padding) applies to the image block but the text children
 * escape it — pushing title/price/button left of (and past) the image. Forcing the anchor
 * (and its blocks) to real block boxes makes every element share one left edge.
 */

/* Whole card routes to the PDP — show a pointer over the card */
.kitchenaire-clickable-card,
.kitchenaire-clickable-card * {
	cursor: pointer;
}

/* The product link is inline by default — make it a real block so children align */
.jeg-elementor-kit.jkit-product-carousel a.jkit-product-link,
.jeg-elementor-kit.jkit-product-grid a.jkit-product-link {
	display: block !important;
	width: 100% !important;
	box-sizing: border-box !important;
	margin: 0 !important;
	padding: 0 !important;
	text-align: left !important;
}

/* Card + wrapper: full width block, left aligned */
.jeg-elementor-kit.jkit-product-carousel .jkit-products .product.jkit-product-block,
.jeg-elementor-kit.jkit-product-grid .jkit-products .product.jkit-product-block {
	box-sizing: border-box;
	text-align: left;
}

.jeg-elementor-kit.jkit-product-carousel .jkit-product-block-wrapper,
.jeg-elementor-kit.jkit-product-grid .jkit-product-block-wrapper {
	display: block;
	width: 100%;
	box-sizing: border-box;
	text-align: left;
	padding-left: 16px;
	padding-right: 16px;
}

/* Image frame: full width, same left edge as text, no centering/offset */
.jeg-elementor-kit.jkit-product-carousel .jkit-product-image-block,
.jeg-elementor-kit.jkit-product-grid .jkit-product-image-block {
	display: block !important;
	width: 100% !important;
	margin-left: 0 !important;
	margin-right: 0 !important;
	box-sizing: border-box;
}

.jeg-elementor-kit.jkit-product-carousel .jkit-product-image-block img.product-image,
.jeg-elementor-kit.jkit-product-grid .jkit-product-image-block img.product-image {
	display: block;
	width: 100%;
	height: auto;
}

/* Title / price / rating: same left edge, no stray horizontal offset */
.jeg-elementor-kit.jkit-product-carousel .product-title,
.jeg-elementor-kit.jkit-product-carousel .price,
.jeg-elementor-kit.jkit-product-carousel .jkit-product-rating,
.jeg-elementor-kit.jkit-product-grid .product-title,
.jeg-elementor-kit.jkit-product-grid .price,
.jeg-elementor-kit.jkit-product-grid .jkit-product-rating {
	display: block;
	width: 100%;
	margin-left: 0 !important;
	margin-right: 0 !important;
	text-align: left !important;
}

/* Title + price: 20px top + left padding */
.jeg-elementor-kit.jkit-product-carousel .product-title,
.jeg-elementor-kit.jkit-product-carousel .price,
.jeg-elementor-kit.jkit-product-grid .product-title,
.jeg-elementor-kit.jkit-product-grid .price {
	padding-top: 20px !important;
	padding-left: 20px !important;
}

/* Rating stars: left-align (JKit defaults them to margin:auto = centered) */
.jeg-elementor-kit.jkit-product-carousel .jkit-product-rating .star-rating,
.jeg-elementor-kit.jkit-product-grid .jkit-product-rating .star-rating {
	--rating-margin-left: 0;
	--rating-margin-right: auto;
	margin-left: 0 !important;
}

/* Add-to-cart button: aligned to the same 20px left edge as title/price */
.jeg-elementor-kit.jkit-product-carousel .jkit-product-block-wrapper > .button,
.jeg-elementor-kit.jkit-product-grid .jkit-product-block-wrapper > .button,
.jeg-elementor-kit.jkit-product-carousel .jkit-product-block .button,
.jeg-elementor-kit.jkit-product-grid .jkit-product-block .button,
.jeg-elementor-kit.jkit-product-grid .woocommerce ul.products li.product .button {
	display: inline-flex !important;
	margin-left: 20px !important;
	margin-right: auto !important;
	margin-top: 12px !important;
}

/* ── Compare (regular) price: smaller, struck-through; sale price clean ── */
.jeg-elementor-kit.jkit-product-carousel .price del,
.jeg-elementor-kit.jkit-product-grid .price del {
	font-size: 0.78em;
	opacity: 0.6;
	text-decoration: line-through;
	margin-right: 8px;
	font-weight: 400;
}

.jeg-elementor-kit.jkit-product-carousel .price ins,
.jeg-elementor-kit.jkit-product-grid .price ins {
	text-decoration: none;
	background: transparent;
}

/* ═══════════════════════════════════════════════════════════════
   STANDARD WOOCOMMERCE LOOP CARDS (shop / category / related / cart upsells)
   Match the JKit card look so product cards are identical site-wide:
   left-aligned, title+price 20px top/left padding, button on the same edge.
   ═══════════════════════════════════════════════════════════════ */
.woocommerce ul.products li.product,
.woocommerce-page ul.products li.product {
	text-align: left !important;
	position: relative;
	box-sizing: border-box;
}

.woocommerce ul.products li.product a img,
.woocommerce-page ul.products li.product a img {
	width: 100%;
	height: auto;
	margin-bottom: 0;
}

.woocommerce ul.products li.product .woocommerce-loop-product__title,
.woocommerce ul.products li.product h2,
.woocommerce ul.products li.product h3,
.woocommerce ul.products li.product .price,
.woocommerce-page ul.products li.product .woocommerce-loop-product__title,
.woocommerce-page ul.products li.product .price {
	display: block;
	width: 100%;
	text-align: left !important;
	padding-left: 20px !important;
	margin-left: 0 !important;
	margin-right: 0 !important;
}

.woocommerce ul.products li.product .woocommerce-loop-product__title,
.woocommerce ul.products li.product h2,
.woocommerce ul.products li.product h3,
.woocommerce-page ul.products li.product .woocommerce-loop-product__title {
	padding-top: 20px !important;
}

.woocommerce ul.products li.product .button,
.woocommerce ul.products li.product a.add_to_cart_button,
.woocommerce-page ul.products li.product .button,
.woocommerce-page ul.products li.product a.add_to_cart_button {
	display: inline-flex !important;
	margin-left: 20px !important;
	margin-top: 12px !important;
}

/* Compare (regular) price on shop loops */
.woocommerce ul.products li.product .price del,
.woocommerce-page ul.products li.product .price del {
	font-size: 0.78em;
	opacity: 0.6;
	text-decoration: line-through;
	margin-right: 8px;
	font-weight: 400;
}

.woocommerce ul.products li.product .price ins,
.woocommerce-page ul.products li.product .price ins {
	text-decoration: none;
	background: transparent;
}

/* ── Remove all review/rating stars from product cards + testimonials (site-wide) ── */
.jeg-elementor-kit.jkit-product-carousel .jkit-product-rating,
.jeg-elementor-kit.jkit-product-grid .jkit-product-rating,
.jeg-elementor-kit.jkit-product-carousel .star-rating,
.jeg-elementor-kit.jkit-product-grid .star-rating,
.jeg-elementor-kit.jkit-testimonials .rating-stars,
.woocommerce ul.products li.product .star-rating,
.woocommerce-page ul.products li.product .star-rating {
	display: none !important;
}

/* ── Fix demo template's ABSOLUTELY-POSITIONED product carousel ──
   The imported Kitchenia home page pins the product carousel at
   left:469px / top:162px / width:34%, which shoves the cards left and
   clips them from the top. Force it back into normal full-width flow. */
.elementor-widget-jkit_product_carousel.elementor-absolute,
.elementor-widget.elementor-widget-jkit_product_carousel.elementor-absolute {
	position: static !important;
	width: 100% !important;
	max-width: 100% !important;
	--container-widget-width: 100% !important;
	left: auto !important;
	right: auto !important;
	top: auto !important;
	bottom: auto !important;
	transform: none !important;
	margin-left: 0 !important;
	margin-right: 0 !important;
}

/* Entrance animation can leave the widget invisible/offset if JS doesn't fire */
.elementor-widget-jkit_product_carousel.elementor-invisible {
	opacity: 1 !important;
	transform: none !important;
}