/*
Theme Name:   Astra Child
Theme URI:    https://alilisecoprints.com.au/
Description:  Child theme for Astra. Holds custom code and CSS for Alilis Eco Prints
              so nothing is lost when the Astra parent theme updates.
Author:       Alilis Eco Prints
Author URI:   https://alilisecoprints.com.au/
Template:     astra
Version:      1.0.3
License:      GNU General Public License v2 or later
License URI:  https://www.gnu.org/licenses/gpl-2.0.html
Text Domain:  astra-child
Tags:         woocommerce, e-commerce
*/

/* ---------------------------------------------------------------------------
   Custom CSS goes below this line.

   Note: the Customizer's "Additional CSS" panel still works and is stored
   separately in the database. Prefer this file for anything you want kept in
   version control or carried between environments.
   --------------------------------------------------------------------------- */

/* ---------------------------------------------------------------------------
   Cart buttons — one consistent, readable style across the whole store.

   WHY THIS EXISTS
   Button colours are currently set in three different places that disagree
   with each other:

     Astra Customizer          secondary button, white text
     Elementor single-product  post-6235.css, transparent hover background
                               (#02010100 — an 8-digit hex whose alpha is 00)
     Elementor product-archive post-6171.css, white text at (0,7,2)

   The result was white text on a transparent background over a white page:
   the Add to Cart button rendered as an empty outlined pill on hover.

   WHY !important
   Elementor's generated rules reach specificity (0,7,2) and are keyed to
   template-specific element IDs (.elementor-element-47e6a7eb and friends)
   that change whenever a template is rebuilt. Matching that with a stable,
   ID-free selector isn't practical, so the colour declarations below are
   forced. Scope is deliberately narrow — only cart and checkout buttons.
   Cookie-banner, quick-view and generic Elementor buttons are left alone.

   COLOURS — all from the existing Astra palette, all WCAG AA verified:
     #1c244b on #8eed9b   10.50:1   normal, filled
     #1c244b on #ffffff   14.96:1   normal, outline
     #ffffff on #415161    8.16:1   hover / focus / active
   --------------------------------------------------------------------------- */

:root {
	--alilis-cart-fg:          #1c244b;
	--alilis-cart-border:      #8eed9b;
	--alilis-cart-hover-bg:    #415161;
	--alilis-cart-hover-fg:    #ffffff;
}




/* Proceed to checkout is the primary action in the cart — keep it solid
   at rest rather than outlined, so it reads as the obvious next step. */
body .woocommerce a.checkout-button {
	background-color: var(--alilis-cart-hover-bg) !important;
	border-color: var(--alilis-cart-hover-bg) !important;
	color: var(--alilis-cart-hover-fg) !important;
}

/* Keyboard users need to see where they are — none of these buttons had a
   visible focus indicator before. */
body .woocommerce a.button.add_to_cart_button:focus-visible,
body .woocommerce button.single_add_to_cart_button:focus-visible,
body .woocommerce a.checkout-button:focus-visible,
body .elementor-wc-products ul.products li.product a.button:focus-visible {
	outline: 2px solid var(--alilis-cart-hover-bg);
	outline-offset: 2px;
}

/* ---------------------------------------------------------------------------
   "View cart" and the mini-cart buttons.

   After an AJAX add-to-cart, WooCommerce inserts a .added_to_cart link beside
   the button. Elementor sets only its font — no colour — so it falls through
   to Astra's global link colour, #f6c3ca, which measures 1.55:1 on white and
   is effectively invisible.

   The mini-cart drawer's footer buttons are injected by JavaScript when the
   drawer opens, so they never appear in the served HTML. They're styled here
   defensively, using the class names Elementor generates in post-6023.css.
   --------------------------------------------------------------------------- */

/* "View cart" — a secondary action, so a clear text link rather than a
   second button competing with Add to Cart. #415161 on white is 8.16:1. */
body .woocommerce a.added_to_cart,
body .elementor-wc-products a.added_to_cart,
body .elementor-widget-woocommerce-product-add-to-cart a.added_to_cart {
	color: var(--alilis-cart-hover-bg) !important;
	text-decoration: underline;
	text-underline-offset: 3px;
	font-weight: 500;
}

body .woocommerce a.added_to_cart:hover,
body .woocommerce a.added_to_cart:focus,
body .elementor-wc-products a.added_to_cart:hover,
body .elementor-widget-woocommerce-product-add-to-cart a.added_to_cart:hover {
	color: var(--alilis-cart-fg) !important;
	text-decoration-thickness: 2px;
}

/* Mini-cart drawer: Checkout is the primary action, View Cart the secondary. */
body .elementor-menu-cart__footer-buttons a.elementor-button--checkout {
	background-color: var(--alilis-cart-hover-bg) !important;
	border-color: var(--alilis-cart-hover-bg) !important;
	color: var(--alilis-cart-hover-fg) !important;
}

body .elementor-menu-cart__footer-buttons a.elementor-button--view-cart {
	background-color: transparent !important;
	border: 1px solid var(--alilis-cart-border) !important;
	color: var(--alilis-cart-fg) !important;
}

body .elementor-menu-cart__footer-buttons a.elementor-button--view-cart:hover,
body .elementor-menu-cart__footer-buttons a.elementor-button--view-cart:focus,
body .elementor-menu-cart__footer-buttons a.elementor-button--checkout:hover,
body .elementor-menu-cart__footer-buttons a.elementor-button--checkout:focus {
	background-color: var(--alilis-cart-hover-bg) !important;
	border-color: var(--alilis-cart-hover-bg) !important;
	color: var(--alilis-cart-hover-fg) !important;
}

body .elementor-menu-cart__footer-buttons a.elementor-button:focus-visible,
body .woocommerce a.added_to_cart:focus-visible {
	outline: 2px solid var(--alilis-cart-hover-bg);
	outline-offset: 2px;
}