/* =========================================================================
   Digibouz Checkout — design tokens carrier.

   This file holds only the fallback token values and the shared primitives.
   The per-site values are injected as an inline <style> attached to this
   handle (see class-dbck-theme.php), so a site's colours always win the
   cascade without needing !important, and they cannot be lost to a CDN
   caching a stale generated stylesheet.

   Scoped to our own containers rather than :root, so a page-builder header
   still rendering on the thank-you page cannot collide with these names.
   ========================================================================= */

.dbck-checkout-page,
.dbck-cart-page,
.dbck-drawer-root {
  /* Brand */
  --dbck-navy: #01273f;
  --dbck-navy-2: #052e4a;
  --dbck-accent: #e77935;
  --dbck-accent-hover: #d96b27;
  --dbck-accent-hover-deep: #bf5615;
  --dbck-accent-soft: #fdf1e8;

  /* Surfaces */
  --dbck-summary-bg: #f4f1ea;
  --dbck-summary-panel: #01273f;
  --dbck-summary-panel-glow: #16456b;
  /* Everything written ON the panel. The stylesheet builds a family of
     opacities out of the triplet (rules at .16, muted text at .62), which is
     why the bare "r,g,b" form exists alongside the hex: rgba() cannot take a
     hex custom property. Both are overwritten per site by the inline block. */
  --dbck-summary-fg: #ffffff;
  --dbck-summary-fg-rgb: 255, 255, 255;
  --dbck-summary-green: #46d39a;
  --dbck-cream-soft: #f6f1e7;
  --dbck-light-blue-2: #dfe6ef;
  --dbck-surface: #fff;

  /* Text */
  --dbck-text: #0e2a3f;
  --dbck-muted: #5e6f7c;
  --dbck-muted-2: #8a98a4;

  /* Lines */
  --dbck-border: #e3e7ec;
  --dbck-border-soft: #eef1f4;
  --dbck-field-border: #c9d0d8;

  /* States */
  --dbck-green: #1f8a5b;
  --dbck-green-soft: #e6f4ec;
  --dbck-danger: #d63638;
  --dbck-star: #ffb814;
  --dbck-focus-ring: #e77935;

  /* Shape */
  --dbck-radius: 10px;

  /* Boxed content width. The plugin brings its own rather than inheriting a
     container from a theme it has never seen. */
  --dbck-cart-max: 1240px;

  /* Typography.
     The fallback is a real system stack, NOT `inherit`. Measured on staging:
     the checkout deliberately dequeues the page builder's stylesheets, so on
     that page there is no theme font left to inherit and `inherit` resolved all
     the way up to the browser default — the checkout rendered in Times New
     Roman. A site that wants its own typeface sets font_source=custom. */
  font-family: var(--dbck-font, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif);
}

/* Tabular figures everywhere a price is shown — prices that jitter while a
   total updates read as a glitch. */
.dbck-checkout-page .amount,
.dbck-cart-page .amount,
.dbck-drawer-root .amount,
.dbck-tnum {
  font-variant-numeric: tabular-nums;
}

/* A visible focus ring is a requirement, not a decoration: the checkout must
   be completable on a keyboard. */
.dbck-checkout-page :focus-visible,
.dbck-cart-page :focus-visible,
.dbck-drawer-root :focus-visible {
  outline: 2px solid var(--dbck-focus-ring);
  outline-offset: 2px;
}

@media (prefers-reduced-motion: reduce) {
  .dbck-checkout-page *,
  .dbck-cart-page *,
  .dbck-drawer-root * {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}
