/* Apple & Oat — cart-page fulfilment step. */

.aao-cart-slot .aao-slot-select {
	width: 100%;
	max-width: 22em;
}

.aao-cart-slot--busy {
	opacity: 0.6;
}

.aao-cart-slot-hint,
.aao-cart-slot-none {
	display: block;
	margin-top: 0.4em;
	font-size: 0.85em;
	opacity: 0.8;
}

.aao-proceed--locked {
	opacity: 0.5;
	cursor: not-allowed;
}

/* The checkout-side confirmation of what was chosen in the cart. */
.aao-slot-confirmed .aao-slot-change {
	margin-left: 0.6em;
	font-size: 0.85em;
	text-decoration: underline;
}

/* Empty cart. Divi renders nothing at all here, so this is the whole message. */
.aao-cart-empty {
	padding: 1em 0 2.5em;
	text-align: center;
}

/*
 * Centre it on the page, not in the product column.
 *
 * The Cart layout splits its row 3/5 (products) + 2/5 (totals). With an empty cart
 * the totals module renders nothing, so the message was centred inside the left 60%
 * of the row and read as misaligned. When our empty-cart block is present, let the
 * columns take the full width — the empty totals column then collapses below it with
 * no height of its own.
 */
.et_pb_row:has(.aao-cart-empty) > .et_pb_column {
	width: 100% !important;
	max-width: 100% !important;
	margin-right: 0 !important;
}

/*
 * Site colours, not WooCommerce's.
 *
 * The message inherits .woocommerce-info (solid #2ea3f2) and the button inherits
 * Divi's accent — both the stock blue, which appears nowhere else on this site.
 * These are the values the live pages actually use: the header cream and the nav
 * green, with Divi's own heading grey for text.
 *
 * Selectors are doubled up (.aao-cart-empty.woocommerce) rather than marked
 * !important: Divi's style-static.min.css carries `.woocommerce .woocommerce-info`
 * at the same specificity as a single-class rule here and loads after us, so it wins
 * on order — and it matches through this block's own `woocommerce` wrapper class.
 * One extra class outranks it cleanly.
 */
.aao-cart-empty.woocommerce .cart-empty,
.aao-cart-empty.woocommerce .woocommerce-info {
	margin-bottom: 1.4em;
	padding: 1.1em 1.4em;
	border: 1px solid #e6ded2;
	border-top: 3px solid #d8d799;
	border-radius: 3px;
	background-color: #f8f2ed;
	font-size: 1.05em;

	/*
	 * !important is unavoidable here, and only here: Divi's style-static.min.css sets
	 * `color: #fff !important` on .woocommerce-info, which no amount of specificity
	 * beats. Without it the text stays white on the cream background — invisible.
	 */
	color: #333 !important;
}

/* WooCommerce puts a blue glyph in front of the text; it has no place here. */
.aao-cart-empty.woocommerce .cart-empty::before,
.aao-cart-empty.woocommerce .woocommerce-info::before {
	display: none;
}

.aao-cart-empty .return-to-shop {
	margin: 0;
}

.aao-cart-empty.woocommerce .return-to-shop .button {
	border: 1px solid #d8d799;
	background-color: #d8d799;
	color: #333;
	transition: background-color .2s ease, border-color .2s ease;
}

.aao-cart-empty.woocommerce .return-to-shop .button:hover {
	border-color: #c9c87f;
	background-color: #c9c87f;
	color: #222;
}