/*
 * Virtualaw OS -- FluentCart storefront skin.
 *
 * FluentCart (1.5.x) themes its whole front end -- single product, product cards,
 * the global cart drawer and the modal checkout -- through a set of `--fct-*` custom
 * properties it sets on :root. We remap those to the Virtualaw brand tokens (defined
 * in site.css), so the store inherits the same ink / ochre / paper palette, JetBrains
 * Mono figures and 4px button radius as the rest of the site, without overriding
 * FluentCart's markup. A few element rules cover the handful of things that are not
 * exposed as variables (button radius + hover, product-title scale, price weight).
 *
 * Enqueued site-wide from functions.php (the cart drawer is global); the variable
 * overrides are inert on pages where FluentCart does not render.
 */

:root {
  /* --- primary action buttons: brand ink, paper text --- */
  --fct-direct-btn-bg-color: var(--ink);
  --fct-direct-btn-text-color: var(--paper);
  --fct-card-btn-bg-color: var(--ink);
  --fct-card-btn-text-color: var(--paper);

  /* --- cart drawer --- */
  --fct-cart-drawer-bg: var(--paper);
  --fct-cart-drawer-border-color: var(--rule);
  --fct-cart-drawer-primary-bg-color: var(--ink);
  --fct-cart-drawer-primary-text-color: var(--ink);
  --fct-cart-drawer-secondary-text-color: var(--ink-soft);
  --fct-cart-drawer-close-btn-color: var(--ink);
  --fct-cart-drawer-btn-bg-color: var(--ink);
  --fct-cart-drawer-btn-text-color: var(--paper);
  --fct-cart-drawer-btn-border-color: var(--ink);
  --fct-cart-drawer-footer-action-bg-color: var(--paper);
  --fct-cart-drawer-badge-bg-color: var(--accent-ink);
  --fct-cart-drawer-badge-text-color: var(--paper);
  --fct-cart-drawer-quantity-bg-color: var(--paper);
  --fct-cart-drawer-quantity-color: var(--ink);
  --fct-cart-drawer-quantity-border-color: var(--rule);
  --fct-cart-drawer-quantity-btn-color: var(--ink-soft);
  --fct-cart-drawer-quantity-btn-bg: var(--paper-tint);
  --fct-cart-drawer-quantity-btn-hover-bg: var(--rule);
  --fct-cart-drawer-open-btn-bg-color: var(--paper);

  /* --- add-to-cart / view-cart: ghost (paper + rule) --- */
  --fct-add-to-cart-btn-bg-color: var(--paper);
  --fct-add-to-cart-btn-text-color: var(--ink);
  --fct-add-to-cart-btn-border-color: var(--rule-strong);
  --fct-add-to-cart-btn-hover-bg-color: var(--paper-tint);
  --fct-view-cart-btn-bg-color: var(--paper);
  --fct-view-cart-drawer-btn-color: var(--ink);
  --fct-view-cart-drawer-btn-border-color: var(--rule-strong);
  --fct-view-cart-drawer-btn-hover-bg: var(--paper-tint);

  /* --- product cards --- */
  --fct-card-bg: var(--paper);
  --fct-card-border-color: var(--rule);
  --fct-card-primary-text-color: var(--ink);
  --fct-card-text-color: var(--ink-soft);

  /* --- single product --- */
  --fct-heading-color: var(--ink);
  --fct-single-product-primary-text-color: var(--ink);
  --fct-single-product-secondary-text-color: var(--ink-soft);
  --fct-single-product-border-color: var(--rule);
  --fct-single-product-active-border-color: var(--accent-ink); /* selected variant = ochre */
  --fct-single-product-qty-bg: var(--paper-tint);
  --fct-single-product-qty-text-color: var(--ink);

  /* --- delete control: neutral --- */
  --fct-cart-item-delete-btn-bg-color: var(--paper);
  --fct-cart-item-delete-btn-color: var(--ink);
  --fct-cart-item-delete-btn-border-color: var(--rule);
  --fct-cart-item-delete-btn-hover-bg-color: var(--paper-tint);
}

/* Brand button shape + hover (no FluentCart variable for these). */
.fluent-cart-direct-checkout-button,
.fct-add-to-cart-btn,
.fct-add-to-cart-button {
  border-radius: 4px;
  font-weight: 500;
  letter-spacing: 0.01em;
  transition: background 240ms var(--ease), border-color 240ms var(--ease);
}
.fluent-cart-direct-checkout-button:hover { background: var(--accent-ink); }

/* Product title as a brand H1 (FluentCart ships it small + muted). */
.fct-product-title h1 {
  color: var(--ink);
  font-family: var(--sans);
  font-weight: 600;
  font-size: clamp(28px, 3.6vw, 40px);
  line-height: 1.06;
  letter-spacing: -0.03em;
}

/* Price: ink, a touch heavier. */
.fct-product-prices,
.fct-max-price,
.fct-min-price { color: var(--ink); font-weight: 600; font-size: 20px; }

/* Subscription terms ("$490.00 per year") in the mono clerical voice. */
.fct-product-payment-type {
  font-family: var(--mono);
  font-size: 12.5px;
  color: var(--ink-mute);
}

/* Variant chips: 4px corners; selected chip gets the ochre tint. */
.fct-product-variant-item { border-radius: 4px; }
.fct-product-variant-item.selected { background: var(--paper-tint); }
.fct-product-variant-title { color: var(--ink); font-weight: 600; }
