/* Ambra Dentally — booking details under a basket / checkout line.

   WooCommerce 11 Blocks renders item data as a <div class="wc-block-components-product-details">
   holding one <span class="wc-block-components-product-details__{key}"> per fact,
   separated by literal <span aria-hidden="true"> / </span> elements. A booking has
   four or five facts, so stack them one per row and hide the separators.
   Older Blocks used <ul>/<li>; the same rules cover that. Classic cart uses dl.variation. */

.wc-block-components-product-details {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 0.2em;
	margin: 0.5em 0 0;
	padding: 0;
	list-style: none;
}

/* One fact per row: direct children whose class starts with the item prefix
   (the inner __name / __value spans are grandchildren, so unaffected). */
.wc-block-components-product-details > [class^="wc-block-components-product-details__"],
.wc-block-components-product-details > li {
	display: block;
	margin: 0;
	padding: 0;
}

/* The " / " separator spans between facts. */
.wc-block-components-product-details > span[aria-hidden="true"] {
	display: none !important;
}

.wc-block-components-product-details__name {
	font-weight: 600;
}

/* Classic (shortcode) cart */
.woocommerce-cart dl.variation {
	display: block;
	margin: 0.5em 0 0;
}

.woocommerce-cart dl.variation dt,
.woocommerce-cart dl.variation dd {
	display: inline;
	float: none;
	margin: 0;
	padding: 0;
}

.woocommerce-cart dl.variation dt {
	font-weight: 600;
}

.woocommerce-cart dl.variation dd::after {
	content: "";
	display: block;
	margin-bottom: 0.2em;
}

/* Deposit terms above the basket */
.ambra-cart-alert {
	margin: 0 0 1.5rem;
	color: #1f1514;
	position: relative;
	padding: 0.85rem 1rem 0.85rem 3rem;
	border: 1px solid #a67e7a;
	border-left-width: 4px;
	border-radius: 4px;
	font-size: 0.9375rem;
	line-height: 1.5;
	background: rgba(166, 126, 122, 0.12);
}

.ambra-cart-alert::before {
	content: "i";
	position: absolute;
	top: 0.85rem;
	left: 0.9rem;
	width: 1.4rem;
	height: 1.4rem;
	border-radius: 50%;
	font-size: 0.8125rem;
	font-weight: 700;
	line-height: 1.4rem;
	text-align: center;
	color: #fff;
	background: #a67e7a;
}