/* 1. Trust strip under the add-to-cart button */

.hartwell-trust-strip {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.5em 2em;
	/*
	 * clear: both is load-bearing, not decorative spacing: the add-to-cart
	 * button and quantity input are float:left (Kadence's WooCommerce CSS),
	 * and this list is appended right after the button in the same
	 * unfloated flow. Without clear, its flex container (a block formatting
	 * context) shrinks to avoid the float instead of dropping below it,
	 * which is why it was rendering squeezed in beside the button.
	 */
	clear: both;
	margin: 2rem 0 0;
	padding: 0;
	list-style: none;
	color: var(--hartwell-black);
	font-family: var(--font-body);
	font-size: 0.85em;
	line-height: 1.4;
}

.hartwell-trust-strip__item {
	display: flex;
	align-items: center;
	gap: 0.5em;
}

.hartwell-trust-strip .hartwell-icon-checkmark {
	flex-shrink: 0;
	color: var(--hartwell-black);
}

/* 2. Ring-size help box, right under the size dropdown */

.hartwell-ring-size-help {
	margin: 1.5rem 0 2rem;
	padding: 0.75em 1em;
	background-color: var(--hartwell-section-bg-light);
	border: 1px solid var(--hartwell-product-backdrop);
	color: var(--hartwell-black);
	font-family: var(--font-body);
	font-size: 0.9em;
	line-height: 1.4;
}

.hartwell-ring-size-help__link {
	color: var(--hartwell-black);
	text-decoration: underline;
}

/* 3. Guarantees section, below the product summary block */

.hartwell-guarantees {
	margin: 3em 0;
	padding: 2.5em 1.5em;
}

.hartwell-guarantees__columns {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 2em;
	max-width: 1000px;
	margin: 0 auto;
}

@media (max-width: 700px) {
	.hartwell-guarantees__columns {
		grid-template-columns: 1fr;
	}
}

.hartwell-guarantees__column {
	text-align: center;
	color: var(--hartwell-black);
}

.hartwell-guarantees__column .hartwell-icon-checkmark {
	width: 22px;
	height: 22px;
	color: var(--hartwell-black);
}

.hartwell-guarantees__title {
	margin: 0.6em 0 0.4em;
	font-size: 1em;
}

.hartwell-guarantees__text {
	margin: 0;
	font-family: var(--font-body);
	font-size: 0.9em;
	line-height: 1.4;
	color: var(--hartwell-black);
}

/*
 * 4. Bullet-list support for the description tab, ready for whenever product
 * descriptions use <ul>/<ol>. `body` prefix keeps specificity (0,1,2) ahead
 * of any bare `.entry-content ul` (0,1,1) Kadence rule, same pattern as
 * hartwell-type.css.
 */

body .woocommerce-Tabs-panel--description ul {
	margin: 1em 0;
	padding: 0;
	list-style: none;
}

body .woocommerce-Tabs-panel--description ul li {
	position: relative;
	padding-left: 1.4em;
	margin-bottom: 0.5em;
	color: var(--hartwell-black);
}

body .woocommerce-Tabs-panel--description ul li::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0.55em;
	width: 6px;
	height: 6px;
	border-radius: 50%;
	background-color: var(--hartwell-black);
}

body .woocommerce-Tabs-panel--description ol {
	margin: 1em 0;
	padding-left: 1.4em;
}

body .woocommerce-Tabs-panel--description ol li {
	margin-bottom: 0.5em;
	color: var(--hartwell-black);
}