/*
Theme Name: POD Store Child
Template: kadence
Description: Kadence child theme for POD stores. Design tokens applied via functions.php from config.
*/

/* =========================================================
   CSS Custom Properties (design tokens)
   Values are overwritten at runtime by functions.php, which
   injects a <style> block based on design-tokens.json.
   These fallbacks keep the theme functional if PHP injection
   hasn't run yet.
   ========================================================= */
:root {
  --primary:      /* set by PHP */;
  --secondary:    /* set by PHP */;
  --font-heading: /* set by PHP */;
  --font-body:    /* set by PHP */;
}

/* =========================================================
   Typography
   ========================================================= */
body,
p,
li,
td,
th,
label,
input,
textarea,
select {
  font-family: var(--font-body), sans-serif;
}

h1, h2, h3, h4, h5, h6,
.entry-title,
.page-title,
.product_title,
.woocommerce-loop-product__title {
  font-family: var(--font-heading), serif;
}

/* =========================================================
   WooCommerce — buttons
   ========================================================= */
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit,
.woocommerce a.button.alt,
.woocommerce button.button.alt,
.woocommerce input.button.alt,
.woocommerce #payment #place_order {
  background-color: var(--primary);
  color: #fff;
  border: 2px solid var(--primary);
  border-radius: 4px;
  font-family: var(--font-body), sans-serif;
  font-weight: 600;
  letter-spacing: 0.03em;
  transition: background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease;
}

.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover,
.woocommerce #respond input#submit:hover,
.woocommerce a.button.alt:hover,
.woocommerce button.button.alt:hover,
.woocommerce input.button.alt:hover,
.woocommerce #payment #place_order:hover {
  background-color: transparent;
  color: var(--primary);
  border-color: var(--primary);
}

/* Secondary / outline button */
.woocommerce a.button.button-secondary,
.woocommerce button.button.button-secondary {
  background-color: transparent;
  color: var(--secondary);
  border: 2px solid var(--secondary);
}

.woocommerce a.button.button-secondary:hover,
.woocommerce button.button.button-secondary:hover {
  background-color: var(--secondary);
  color: #fff;
}

/* =========================================================
   WooCommerce — product listing
   ========================================================= */
.woocommerce ul.products li.product .price {
  color: var(--primary);
}

.woocommerce ul.products li.product:hover img {
  opacity: 0.9;
}

/* =========================================================
   WooCommerce — cart page
   ========================================================= */
.woocommerce-cart .cart-collaterals .cart_totals h2,
.woocommerce-cart .woocommerce-cart-form table thead th {
  font-family: var(--font-heading), serif;
  color: var(--primary);
}

.woocommerce-cart .woocommerce-cart-form table .product-name a {
  color: var(--primary);
  text-decoration: none;
}

.woocommerce-cart .woocommerce-cart-form table .product-name a:hover {
  color: var(--secondary);
  text-decoration: underline;
}

.woocommerce .cart-collaterals .cart_totals .checkout-button {
  display: block;
  text-align: center;
  width: 100%;
}

/* =========================================================
   WooCommerce — checkout page
   ========================================================= */
.woocommerce-checkout .woocommerce-billing-fields h3,
.woocommerce-checkout #order_review_heading,
.woocommerce-checkout h3#ship-to-different-address {
  font-family: var(--font-heading), serif;
  color: var(--primary);
  border-bottom: 2px solid var(--secondary);
  padding-bottom: 0.4em;
}

.woocommerce-checkout form .form-row input.input-text:focus,
.woocommerce-checkout form .form-row textarea:focus,
.woocommerce-checkout form .form-row select:focus {
  border-color: var(--primary);
  outline: none;
  box-shadow: 0 0 0 2px color-mix(in srgb, var(--primary) 20%, transparent);
}

.woocommerce-checkout #payment ul.payment_methods li label {
  font-family: var(--font-body), sans-serif;
}

/* =========================================================
   Single product page
   ========================================================= */
.woocommerce div.product .product_title {
  font-family: var(--font-heading), serif;
  color: var(--primary);
}

.woocommerce div.product .price {
  color: var(--primary);
  font-size: 1.4em;
}

.woocommerce div.product div.summary .woocommerce-product-details__short-description {
  font-family: var(--font-body), sans-serif;
}

/* =========================================================
   Kadence theme overrides
   ========================================================= */
.wp-block-kadence-button .kb-button.kb-btn-global-outline {
  border-color: var(--primary);
  color: var(--primary);
}

.wp-block-kadence-button .kb-button.kb-btn-global-fill {
  background-color: var(--primary);
  color: #fff;
}

/* Kadence header CTA */
.kadence-header-btn a {
  background-color: var(--primary) !important;
  border-color: var(--primary) !important;
  color: #fff !important;
}