/*
Theme Name:   Hello Elementor Child
Theme URI:    https://yoursite.com/
Description:  Child theme for Hello Elementor – MyCo branding
Author:       Dream Media
Template:     hello-elementor
Version:      1.0.8
Text Domain:  hello-elementor-child
*/

/* Define variables globally */
:root {
    --myco-teal:       #00bdb2;
    --myco-teal-light: #00e0d4;
    --myco-dark:       #0f1f24;
    --myco-text:       #4b646b;
    --myco-bg:         #f7f9fb;
}
a {
    color: teal; /* or use a specific teal-blue hex code like #008080 */
    text-decoration: none; /* optional: removes underline */
}

a:hover {
    color: #20B2AA; /* lighter teal-blue shade */
    text-decoration: underline; /* optional: underline on hover */
}

/* Base block button - gradient fill by default */
.wc-block-components-button,
.wc-block-components-button:not(.wp-block-button__link) {
    background: linear-gradient(90deg, var(--myco-teal), var(--myco-teal-light)) !important;
    color: #ffffff !important;
    border: none !important;
    border-radius: 50px !important;
    padding: 16px 45px !important;
    font-size: 16px !important;
    font-weight: 600 !important;
    box-shadow: 0 4px 12px rgba(0, 189, 178, 0.15) !important;
    transition: all 0.3s ease !important;
    text-decoration: none !important;
}

/* Hover & focus: lift + stronger glow, keep gradient */
.wc-block-components-button:hover,
.wc-block-components-button:focus,
.wc-block-components-button:focus-visible {
    transform: translateY(-4px) !important;
    box-shadow: 0 12px 28px rgba(0, 189, 178, 0.28) !important;
}

/* Active: subtle press down */
.wc-block-components-button:active {
    transform: translateY(-1px) !important;
    box-shadow: 0 6px 16px rgba(0, 189, 178, 0.22) !important;
}

/* Target Place Order specifically (common override miss) */
.wc-block-components-checkout-place-order-button,
.wc-block-checkout .wc-block-components-button {
    background: linear-gradient(90deg, var(--myco-teal), var(--myco-teal-light)) !important;
    color: #ffffff !important;
}

/* If still ignored, nuke Woo's button resets more aggressively */
:where(.wp-block-woocommerce-cart, .wp-block-woocommerce-checkout) .wc-block-components-button {
    background: linear-gradient(90deg, var(--myco-teal), var(--myco-teal-light)) !important;
    color: #ffffff !important;
    border: none !important;
}
main {padding: 50px;}
/* Single product page Add to Cart button — match the block buttons style */
.single_add_to_cart_button,
.single-product .single_add_to_cart_button,
.single-product form.cart .button {
    background: linear-gradient(90deg, var(--myco-teal), var(--myco-teal-light)) !important;
    color: #ffffff !important;
    border: none !important;
    border-radius: 50px !important;
    padding: 16px 45px !important;
    font-size: 16px !important;
    font-weight: 600 !important;
    box-shadow: 0 4px 12px rgba(0, 189, 178, 0.15) !important;
    transition: all 0.3s ease !important;
    text-decoration: none !important;
    min-width: 180px;               /* optional: prevent tiny buttons */
}

/* Hover: lift + stronger underglow */
.single_add_to_cart_button:hover,
.single_add_to_cart_button:focus,
.single-product form.cart .button:hover,
.single-product form.cart .button:focus {
    transform: translateY(-4px) !important;
    box-shadow: 0 12px 28px rgba(0, 189, 178, 0.28) !important;
}

/* Active: subtle press */
.single_add_to_cart_button:active,
.single-product form.cart .button:active {
    transform: translateY(-1px) !important;
    box-shadow: 0 6px 16px rgba(0, 189, 178, 0.22) !important;
}

/* Global WooCommerce prices → teal, match your brand */
.price,
.woocommerce-Price-amount,
.woocommerce-Price-amount bdi,
.woocommerce-Price-amount .woocommerce-Price-currencySymbol,
.amount {
    color: var(--myco-teal) !important;
    font-weight: 600 !important;  /* optional: bolder for emphasis */
}

/* Sale price: keep teal, but strike-through regular in gray */
.price del,
ins .price del {
    color: #9fb3b8 !important;   /* muted gray for old price */
    opacity: 0.7;
}

.price ins,
.price ins .woocommerce-Price-amount {
    color: var(--myco-teal) !important;
    text-decoration: none;
}

/* Scope tighter to single product if you want only there (optional) */
.single-product .price,
.single-product .woocommerce-Price-amount {
    color: var(--myco-teal) !important;
    font-size: 28px !important;   /* matches your earlier single-product rule */
}
/* =========================
   Cart Cross-Sell Products
   ========================= */

.wc-block-cart .wc-block-product {
    background: #ffffff;
    border-radius: 16px;
    padding: 20px;
    transition: all 0.25s ease;
    box-shadow: 0 6px 20px rgba(0,0,0,0.04);
    text-align: center;
}

.wc-block-cart .wc-block-product:hover {
    transform: translateY(-4px);
    box-shadow: 0 12px 30px rgba(0,0,0,0.08);
}

/* Product image */
.wc-block-cart .wc-block-product img {
    border-radius: 12px;
    margin-bottom: 15px;
    max-height: 180px;
    object-fit: contain;
}

/* Product title */
.wc-block-cart .wc-block-product .wc-block-components-product-name {
    font-size: 18px;
    font-weight: 600;
    color: #0d6f6b;
    margin-bottom: 10px;
    text-decoration: none;
}

/* Price */
.wc-block-cart .wc-block-product .wc-block-components-product-price {
    font-size: 16px;
    font-weight: 500;
    color: #0d6f6b;
    margin-bottom: 15px;
}

/* Add to cart button */
.wc-block-cart .wc-block-product .wp-block-button__link {
    background: #0d6f6b;
    color: #ffffff;
    border-radius: 30px;
    padding: 10px 24px;
    font-weight: 600;
    transition: all 0.2s ease;
}

.wc-block-cart .wc-block-product .wp-block-button__link:hover {
    background: #094f4c;
    transform: scale(1.05);
}
.wc-block-cart h2 {
    font-size: 26px;
    font-weight: 700;
    color: #0d6f6b;
    margin-bottom: 30px;
}