/*
Theme Name: Shop Blueprint
Theme URI: https://example.com/shop-blueprint
Author: You
Description: Reusable single-/few-product WooCommerce shop base. Re-skin each clone by editing three colour tokens (primary, secondary, tertiary) and one font in theme.json or the Site Editor. Block-checkout ready. Front page defaults to the Shop; switchable to a single product via the Customizer.
Version: 1.1.0
Requires at least: 6.6
Tested up to: 6.8
Requires PHP: 7.4
Text Domain: shop-blueprint
Tags: e-commerce, full-site-editing, block-patterns, custom-colors
*/

/* Most styling is driven by theme.json (colours, type, spacing, buttons).
   This file only covers interaction states and a few WooCommerce-legacy bits
   that are most robustly set with the generated CSS variables. */

:root {
  --sb-radius: 8px;
  --sb-transition: 150ms ease;
}

/* Links + buttons: hover moves from primary -> secondary */
a { transition: color var(--sb-transition); }

.wp-element-button,
.wc-block-components-button,
button.button,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce #respond input#submit,
.woocommerce input.button {
  background-color: var(--wp--preset--color--primary);
  color: var(--wp--preset--color--base);
  border: 0;
  border-radius: var(--sb-radius);
  transition: background-color var(--sb-transition), transform var(--sb-transition);
}

.wp-element-button:hover,
.wc-block-components-button:hover,
button.button:hover,
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce #respond input#submit:hover,
.woocommerce input.button:hover {
  background-color: var(--wp--preset--color--secondary);
  color: var(--wp--preset--color--base);
}

/* Visible keyboard focus everywhere (quality floor) */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
.wp-element-button:focus-visible {
  outline: 3px solid var(--wp--preset--color--tertiary);
  outline-offset: 2px;
}

/* Sale flash + price accents pick up tertiary */
.woocommerce span.onsale,
.wc-block-grid__product-onsale {
  background-color: var(--wp--preset--color--tertiary);
  color: var(--wp--preset--color--contrast);
  border-radius: 999px;
}

.woocommerce ul.products li.product .price,
.woocommerce div.product p.price {
  color: var(--wp--preset--color--secondary);
}

/* Lines / dividers / borders use a quiet neutral, accents stay deliberate */
.woocommerce table.shop_table,
.woocommerce .cart-collaterals,
hr.wp-block-separator {
  border-color: color-mix(in srgb, var(--wp--preset--color--muted) 35%, transparent);
}

/* Product grid breathing room */
.woocommerce ul.products { gap: clamp(1rem, 3vw, 2rem); }

@media (prefers-reduced-motion: reduce) {
  * { transition: none !important; animation: none !important; }
}