/* =========================================================================
   Ace & Whim — storefront styling (v2.4.0). Loaded site-wide on the front end
   while Settings > General > "Brand styling for shop-page..." is on.
   Colors come from the same brand variables as the rest of the plugin.
   ========================================================================= */

/* --- Grid "Add to cart" buttons: brand olive fill, cream text, no underline.
   !important because Showit's global link/button rules otherwise win. --- */
.woocommerce ul.products li.product .button,
.woocommerce-page ul.products li.product .button,
.wc-block-grid__product .wp-block-button__link,
.wc-block-grid__product-add-to-cart .wp-block-button__link,
.wp-block-woocommerce-product-button .wp-block-button__link,
.wc-block-components-product-button .wc-block-components-product-button__button,
.woocommerce ul.products li.product .button:visited,
.woocommerce-page ul.products li.product .button:visited,
.wc-block-grid__product .wp-block-button__link:visited,
.wc-block-grid__product-add-to-cart .wp-block-button__link:visited,
.wp-block-woocommerce-product-button .wp-block-button__link:visited,
.wc-block-components-product-button .wc-block-components-product-button__button:visited,
.woocommerce ul.products li.product .button:focus,
.woocommerce-page ul.products li.product .button:focus,
.wc-block-grid__product .wp-block-button__link:focus,
.wc-block-grid__product-add-to-cart .wp-block-button__link:focus,
.wp-block-woocommerce-product-button .wp-block-button__link:focus,
.wc-block-components-product-button .wc-block-components-product-button__button:focus,
.woocommerce ul.products li.product .button:hover,
.woocommerce-page ul.products li.product .button:hover,
.wc-block-grid__product .wp-block-button__link:hover,
.wc-block-grid__product-add-to-cart .wp-block-button__link:hover,
.wp-block-woocommerce-product-button .wp-block-button__link:hover,
.wc-block-components-product-button .wc-block-components-product-button__button:hover {
	background: var(--aws-olive, #42432E) !important;
	color: var(--aws-cream, #F6F6F2) !important;
	border: none !important;
	border-radius: 40px;
	box-shadow: none;
	text-decoration: none !important;
	text-transform: uppercase;
	letter-spacing: .05em;
	font-family: 'Josefin Sans', sans-serif;
	font-weight: 400;
	font-size: 14px;
	padding: 14px 28px;
	transition: opacity .15s ease;
}
.woocommerce ul.products li.product .button:hover,
.wc-block-grid__product .wp-block-button__link:hover,
.wc-block-components-product-button__button:hover { opacity: .88; }

/* The drawer already confirms the add, so Woo's extra "View cart" link under
   the button is redundant (same call as on the product page). */
.woocommerce ul.products li.product a.added_to_cart { display: none; }

/* --- Empty Cart page: swap WooCommerce's sad-face icon for a plain cart
   outline in the brand sage. Best-effort: targets the Cart block's empty-state
   heading; if WooCommerce changes that markup this is a harmless no-op. --- */
.wc-block-cart__empty-cart__title.with-empty-cart-icon::before,
.wp-block-woocommerce-empty-cart-block .with-empty-cart-icon::before {
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 6h2l1.6 10.2a2 2 0 0 0 2 1.8h7.6a2 2 0 0 0 2-1.6L20.4 9H7'/%3E%3Ccircle cx='9.5' cy='20' r='1.4' fill='black'/%3E%3Ccircle cx='17' cy='20' r='1.4' fill='black'/%3E%3C/svg%3E") !important;
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 6h2l1.6 10.2a2 2 0 0 0 2 1.8h7.6a2 2 0 0 0 2-1.6L20.4 9H7'/%3E%3Ccircle cx='9.5' cy='20' r='1.4' fill='black'/%3E%3Ccircle cx='17' cy='20' r='1.4' fill='black'/%3E%3C/svg%3E") !important;
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
	-webkit-mask-position: center;
	mask-position: center;
	-webkit-mask-size: contain;
	mask-size: contain;
	background-color: var(--aws-sage, #999A8A) !important;
}