/**
 * Acidolattico Pre-order — front-end styles.
 *
 * Neutral, low-specificity styling that sits inside the Peakzy theme without
 * fighting it. No fake urgency: the pre-order state is informative, not a
 * countdown or a scarcity device.
 */

.acido-availability {
	margin: 0 0 12px;
	font-size: 14px;
	font-weight: 600;
	line-height: 1.4;
}

.acido-availability--in_stock {
	color: #2f6b34;
}

.acido-availability--low_stock {
	color: #8a5a00;
}

.acido-availability--preorder {
	color: #515c4c;
}

.acido-availability--sold_out {
	color: #8a1f1f;
}

/* ---------------------------------------------------------------------------
   Product page pre-order notice
   Rendered by assets/js/preorder.js inside the variation form, because the
   theme does not surface WooCommerce's availability_html prominently.
   --------------------------------------------------------------------------- */

.acido-product-preorder-notice {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px;
	margin: 0 0 14px;
	padding: 10px 12px;
	border: 1px solid #d9dcd4;
	border-left: 4px solid #515c4c;
	border-radius: 4px;
	background: #f7f8f5;
	line-height: 1.4;
}

.acido-product-preorder-notice__badge {
	display: inline-block;
	padding: 2px 9px;
	border-radius: 3px;
	background: #515c4c;
	color: #fff;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.06em;
	/* Never let the badge break letter-by-letter. */
	white-space: nowrap;
}

.acido-product-preorder-notice__eta {
	font-size: 14px;
	font-weight: 600;
	color: #3d4438;
}

.acido-product-preorder-notice__eta:empty {
	display: none;
}

/* Pre-order badge on the cart / order line. */
.acido-cart-preorder {
	display: inline-block;
	padding: 1px 8px;
	border-radius: 3px;
	background: #515c4c;
	color: #fff;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	/* The badge must never wrap vertically, one letter per line. */
	white-space: nowrap;
}

/* ---------------------------------------------------------------------------
   Cart / checkout / mini-cart item metadata layout
   ---------------------------------------------------------------------------
   The Peakzy parent theme sets:

       dl.variation { display: flex; }              (woocommerce.css:813)

   With `display:flex` on the <dl>, every <dt> and <dd> becomes a flex item on
   ONE row and is squeezed by flex-shrink, which is what made "PRE-ORDER" wrap
   vertically a letter at a time.

   WooCommerce's cart-item-data.php also runs the value through wpautop(), so
   each <dd> contains a <p> that brings its own bottom margin.

   These rules re-lay the list as a two-column grid, and are scoped to the
   cart, the checkout order review and the mini-cart. Product pages, archives
   and every other dl.variation on the site are deliberately left alone.
   --------------------------------------------------------------------------- */

.woocommerce-cart-form dl.variation,
table.woocommerce-checkout-review-order-table dl.variation,
.widget_shopping_cart_content dl.variation,
ul.woocommerce-mini-cart dl.variation {
	display: grid;
	grid-template-columns: minmax(0, auto) minmax(0, 1fr);
	column-gap: 10px;
	row-gap: 2px;
	align-items: baseline;
	margin: 6px 0 0;
	font-size: 0.875em;
}

.woocommerce-cart-form dl.variation dt,
table.woocommerce-checkout-review-order-table dl.variation dt,
.widget_shopping_cart_content dl.variation dt,
ul.woocommerce-mini-cart dl.variation dt {
	float: none;
	clear: none;
	width: auto;
	max-width: none;
	margin: 0;
	padding: 0;
	font-weight: 600;
	white-space: nowrap;
	opacity: 0.75;
}

.woocommerce-cart-form dl.variation dd,
table.woocommerce-checkout-review-order-table dl.variation dd,
.widget_shopping_cart_content dl.variation dd,
ul.woocommerce-mini-cart dl.variation dd {
	float: none;
	clear: none;
	width: auto;
	max-width: none;
	/* min-width:0 stops a long value overflowing its grid column. */
	min-width: 0;
	margin: 0;
	padding: 0;
	overflow-wrap: break-word;
}

/* wpautop() wraps every value in a <p>; drop its margins inside the grid. */
.woocommerce-cart-form dl.variation dd p,
table.woocommerce-checkout-review-order-table dl.variation dd p,
.widget_shopping_cart_content dl.variation dd p,
ul.woocommerce-mini-cart dl.variation dd p {
	margin: 0;
	padding: 0;
}

/* Narrow viewports and the mini-cart column: stack label above value rather
   than squeezing two columns into ~200px. */
@media (max-width: 480px) {
	.woocommerce-cart-form dl.variation,
	table.woocommerce-checkout-review-order-table dl.variation,
	.widget_shopping_cart_content dl.variation,
	ul.woocommerce-mini-cart dl.variation {
		grid-template-columns: minmax(0, 1fr);
		row-gap: 0;
	}

	.woocommerce-cart-form dl.variation dt,
	table.woocommerce-checkout-review-order-table dl.variation dt,
	.widget_shopping_cart_content dl.variation dt,
	ul.woocommerce-mini-cart dl.variation dt {
		margin-top: 4px;
	}
}

/* Cart / checkout banner. */
.acido-preorder-banner {
	border-left: 4px solid #515c4c;
}

.acido-preorder-banner__eta {
	margin: 6px 0 0;
}

/* Checkout acknowledgement block. */
.acido-preorder-ack {
	margin: 0 0 18px;
	padding: 14px 16px;
	border: 1px solid #d9dcd4;
	border-left: 4px solid #515c4c;
	border-radius: 4px;
	background: #f7f8f5;
}

.acido-preorder-ack__intro {
	margin: 0 0 8px;
	font-size: 14px;
	line-height: 1.5;
}

.acido-preorder-ack__eta {
	margin: 0 0 10px;
	font-size: 14px;
}

.acido-preorder-ack__field {
	margin: 0;
	padding: 0;
}

.acido-preorder-ack__field label {
	font-weight: 600;
	line-height: 1.4;
}

/* Frozen ETA under an order line. */
.acido-order-preorder {
	margin: 4px 0 0;
	font-size: 13px;
	line-height: 1.45;
}

/* Product form state hooks, for the theme to build on if wanted. */
.variations_form.acido-state-preorder .single_add_to_cart_button {
	background-color: #515c4c;
}

@media (prefers-color-scheme: dark) {
	.acido-preorder-ack {
		background: #23261f;
		border-color: #3a3f33;
	}
}