/* -----------------------------------------------------------------------------
File:    04-minor-changes.css
Path:    /woocommerce/product-archives/04-minor-changes.css
Version: V1.0
Purpose: Single product – sale badge position/round + stock position + MSRP/Our Price
Rules:   Use palette vars only (adds var(--green) per your request)
----------------------------------------------------------------------------- */

/* -------------------------------------------------------------------------- */
/* 1) Sale badge on TOP-RIGHT of main product image + round corners            */
/* -------------------------------------------------------------------------- */
.single-product div.product .woocommerce-product-gallery{
	position: relative; /* anchor for .onsale */
}

.single-product div.product .woocommerce-product-gallery .onsale{
	position: absolute;
	top: 12px;
	right: 12px;
	left: auto;
	margin: 0;
	z-index: 10;

	border-radius: 999px; /* ✅ round corners */
	padding: 6px 10px;
	line-height: 1;
}

/* -------------------------------------------------------------------------- */
/* 2) Stock after add-to-cart is handled in PHP (priority 31)                  */
/*    Just minor spacing here                                                  */
/* -------------------------------------------------------------------------- */
.single-product div.product .stock{
	margin-top: 10px;
}

/* -------------------------------------------------------------------------- */
/* 3) MSRP / Our Price label styling (only used when product is on sale)       */
/* -------------------------------------------------------------------------- */
.single-product .rg-price-labels{
	display: inline-flex;
	flex-direction: column;
	gap: 4px;
}

.single-product .rg-price-labels__msrp{
	color: var(--accent);
	font-weight: 800;
}

.single-product .rg-price-labels__our{
	color: var(--green);
	font-weight: 900;
}

/* Make sure Woo default del/ins styles don't interfere when our markup is used */
.single-product .rg-price-labels del,
.single-product .rg-price-labels ins{
	text-decoration: none;
	background: transparent;
}

.single-product .summary .price .rg-price-labels{
	display: flex !important;
}

/*Purpose: Single product – reduce H1 title on mobile*/
/*----------------------------------------------------------------------------- */*/

@media (max-width: 720px){

	.single-product h1.product_title.entry-title{
		font-size:25px;
		/*font-size: clamp(1.45rem, 1.2rem + 1.2vw, 1.9rem);*/

		line-height: 1.18;
	}

}