/* Loaded ONLY on the WooCommerce cart and checkout pages (see the
   wp_enqueue_scripts hook in the plugin file). This can't fully replace
   your MasterStudy theme's header/footer/page-title banner without a
   child theme, but it brings fonts, colors, and buttons in line with
   the rest of the site so it doesn't feel like a different product
   mid-purchase. */

body.woocommerce-cart,
body.woocommerce-checkout {
    font-family: 'Space Grotesk', system-ui, sans-serif !important;
    color: #14192E;
}

/* h1 specifically is excluded here — that's the page-title banner,
   which already gets the correct gold color from .page-header h1
   elsewhere. This only needs to style WooCommerce's OWN in-content
   headings (e.g. "Billing details"), which sit on a white background
   further down the page. */
body.woocommerce-cart h2,
body.woocommerce-checkout h2,
body.woocommerce-checkout h3 {
    font-family: 'Fraunces', Georgia, serif !important;
    color: #14192E !important;
}

/* Buttons: cart quantity update, "Proceed to Checkout", "Place Order" */
.woocommerce .button,
.woocommerce button.button,
.woocommerce a.button,
.woocommerce input.button,
.woocommerce #place_order,
.woocommerce .checkout-button,
.woocommerce .wc-proceed-to-checkout .checkout-button {
    background: #F2B705 !important;
    border: none !important;
    color: #14192E !important;
    font-weight: 600 !important;
    border-radius: 6px !important;
    padding: 12px 26px !important;
    text-transform: none !important;
    box-shadow: none !important;
    transition: background .3s ease, transform .3s ease !important;
}
.woocommerce .button:hover,
.woocommerce button.button:hover,
.woocommerce a.button:hover,
.woocommerce input.button:hover,
.woocommerce #place_order:hover,
.woocommerce .checkout-button:hover {
    background: #ffce33 !important;
    color: #14192E !important;
    transform: translateY(-2px);
}

/* Links and prices */
.woocommerce a:not(.button) {
    color: #14192E;
}
.woocommerce-Price-amount {
    color: #14192E !important;
    font-weight: 600;
}

/* Tables (cart contents, order review) */
.woocommerce table.shop_table,
.woocommerce table.shop_table th,
.woocommerce table.shop_table td {
    border-color: #E4E7EE !important;
}
.woocommerce table.shop_table thead th {
    background: #EFF2F6 !important;
    font-family: 'Space Grotesk', sans-serif !important;
}

/* Form fields (checkout billing form, coupon code, etc) */
.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce form .form-row select,
.woocommerce table.shop_table input[type="number"] {
    border: 1px solid #D6DAE3 !important;
    border-radius: 6px !important;
    padding: 10px !important;
}
.woocommerce form .form-row input.input-text:focus,
.woocommerce form .form-row textarea:focus,
.woocommerce form .form-row select:focus {
    border-color: #7C5CFF !important;
    outline: none !important;
    box-shadow: 0 0 0 3px rgba(124,92,255,0.15) !important;
}

/* Order totals / review boxes */
.woocommerce-checkout-review-order,
.cart_totals,
.woocommerce-checkout #order_review {
    background: #FAFBFD !important;
    border: 1px solid #E4E7EE !important;
    border-radius: 10px !important;
    padding: 20px !important;
}

/*
  The colored page-title banner is no longer an issue — the plugin's
  template_include hook now bypasses your theme's page template
  entirely for the cart/checkout pages, replacing it with our own
  header/footer (see templates/woocommerce-page.php). This stylesheet
  only needs to style WooCommerce's own form/table/button output,
  which still renders in the middle of that page as normal.
*/
