/**
 * Feature 035 — DPD shop chrome: Add-to-Cart button.
 *
 * Primary buy action = DPD red, matching the header "START FREE" CTA so the whole
 * site has one action colour. Self-scoped under `body.dpd-chrome` (site-wide class,
 * see inc/header.php) and depends on dpd-tokens.css for the palette. Values also carry
 * literal fallbacks so this file ports 1:1 to the Slovenian child theme even if the
 * token names ever drift.
 *
 * Covers: shop/archive loop buttons + the single-product add-to-cart button.
 * Deliberately NOT touching cart/checkout "Proceed" buttons — only the buy action.
 */

body.dpd-chrome {
  /* button-local tokens (derive from the shared palette; fall back to literals) */
  --btn-bg:        var(--red, #DC0028);
  --btn-bg-hover:  var(--red-deep, #A8001F);
  --btn-bg-active: #8E001A;
  --btn-fg:        var(--paper, #FBFAF7);
}

/* Shop loop (archive grid) + single-product add-to-cart. Scope + class stack gives us
   enough specificity to win over Shoptimizer's accent without !important. */
body.dpd-chrome.woocommerce ul.products li.product a.button.add_to_cart_button,
body.dpd-chrome.woocommerce ul.products li.product a.button.product_type_simple,
body.dpd-chrome.woocommerce a.button.add_to_cart_button,
body.dpd-chrome.woocommerce button.single_add_to_cart_button.button.alt,
body.dpd-chrome.woocommerce .single_add_to_cart_button.button {
  background-color: var(--btn-bg);
  color: var(--btn-fg);
  border-color: var(--btn-bg);
  transition: background-color .18s ease, box-shadow .18s ease, transform .18s ease;
}

/* Hover / focus — darken (never brighten red) + a subtle red-tinted lift. */
body.dpd-chrome.woocommerce ul.products li.product a.button.add_to_cart_button:hover,
body.dpd-chrome.woocommerce ul.products li.product a.button.product_type_simple:hover,
body.dpd-chrome.woocommerce a.button.add_to_cart_button:hover,
body.dpd-chrome.woocommerce button.single_add_to_cart_button.button.alt:hover,
body.dpd-chrome.woocommerce .single_add_to_cart_button.button:hover,
body.dpd-chrome.woocommerce ul.products li.product a.button.add_to_cart_button:focus-visible,
body.dpd-chrome.woocommerce a.button.add_to_cart_button:focus-visible,
body.dpd-chrome.woocommerce button.single_add_to_cart_button.button.alt:focus-visible,
body.dpd-chrome.woocommerce .single_add_to_cart_button.button:focus-visible {
  background-color: var(--btn-bg-hover);
  border-color: var(--btn-bg-hover);
  color: var(--btn-fg);
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(220, 0, 40, .25);
}

/* Keyboard focus ring (in addition to the hover styling above). */
body.dpd-chrome.woocommerce a.button.add_to_cart_button:focus-visible,
body.dpd-chrome.woocommerce button.single_add_to_cart_button.button.alt:focus-visible,
body.dpd-chrome.woocommerce .single_add_to_cart_button.button:focus-visible {
  outline: 3px solid rgba(220, 0, 40, .4);
  outline-offset: 2px;
}

/* Pressed. */
body.dpd-chrome.woocommerce a.button.add_to_cart_button:active,
body.dpd-chrome.woocommerce button.single_add_to_cart_button.button.alt:active,
body.dpd-chrome.woocommerce .single_add_to_cart_button.button:active {
  background-color: var(--btn-bg-active);
  border-color: var(--btn-bg-active);
  transform: translateY(0);
  box-shadow: none;
}

/* "Added" / loading state — keep it red so the button doesn't flash the theme accent. */
body.dpd-chrome.woocommerce a.button.add_to_cart_button.added,
body.dpd-chrome.woocommerce a.button.add_to_cart_button.loading {
  background-color: var(--btn-bg-hover);
  border-color: var(--btn-bg-hover);
  color: var(--btn-fg);
}