/* FACOBE Design Tokens — the single source of truth for colors, type, scale.
   v2: Aubergine × Blush × Rose-Gold palette + Fraunces / DM Sans / DM Mono.
   Old token names kept intentionally so downstream selectors stay green;
   only their values are remapped. New tokens (--fcb-primary, --fcb-sale)
   are additive. */

:root {
  /* --- Color ---------------------------------------------------------- */
  --fcb-bg:            #F4E1D8;   /* blush page background */
  --fcb-bg-2:          #EDD6C9;   /* deeper blush for banded sections */
  --fcb-surface:       #FBF7F2;   /* ivory cards / drawers */
  --fcb-surface-2:     #F5EDE5;   /* subtle raised surface */

  --fcb-ink:           #2A1F2A;   /* body ink (muted charcoal, warm) */
  --fcb-ink-2:         #4A3B4A;   /* softer text */
  --fcb-muted:         #7A6870;   /* labels / secondary */

  --fcb-primary:       #3D1F3D;   /* aubergine — main CTA */
  --fcb-primary-ink:   #521A52;   /* aubergine hover / active */
  --fcb-primary-soft:  #E7D6E7;   /* aubergine tint / hover fills */

  --fcb-accent:        #B8925A;   /* rose-gold accent */
  --fcb-accent-ink:    #7A5C2C;   /* rose-gold hover */
  --fcb-accent-soft:   #EAD1B0;   /* rose-gold tint */

  --fcb-line:          #EAD8CE;   /* blush hairline */
  --fcb-line-2:        #D6B8A6;   /* blush border */

  --fcb-success:       #6E8570;   /* sage — "SAVE ₹X" ribbon, "in stock" */
  --fcb-sale:          #7A2E3A;   /* wine — sale / urgency */
  --fcb-danger:        #7A2E3A;
  --fcb-focus:         #B8925A;   /* focus ring uses accent */

  /* Backwards-compat aliases so old rules keep working. */
  --fcb-gold:          var(--fcb-accent);
  --fcb-gold-soft:     var(--fcb-accent-soft);
  --fcb-gold-ink:      var(--fcb-accent-ink);

  /* --- Type ----------------------------------------------------------- */
  --fcb-font-display: 'Fraunces', 'Playfair Display', Georgia, 'Times New Roman', serif;
  --fcb-font-body:    'DM Sans', 'Inter', ui-sans-serif, system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  --fcb-font-num:     'DM Mono', ui-monospace, 'SFMono-Regular', Menlo, Consolas, monospace;

  --fcb-fs-xs:  11px;
  --fcb-fs-sm:  13px;
  --fcb-fs-md:  14px;
  --fcb-fs-lg:  16px;
  --fcb-fs-xl:  20px;
  --fcb-fs-2xl: 26px;
  --fcb-fs-3xl: 36px;
  --fcb-fs-4xl: 52px;

  --fcb-lh-tight: 1.12;
  --fcb-lh-body:  1.6;

  /* --- Spacing --------------------------------------------------------- */
  --fcb-s-1:   4px;
  --fcb-s-2:   8px;
  --fcb-s-3:  12px;
  --fcb-s-4:  16px;
  --fcb-s-5:  24px;
  --fcb-s-6:  32px;
  --fcb-s-7:  40px;
  --fcb-s-8:  56px;
  --fcb-s-9:  80px;

  /* --- Radius / shadow / motion --------------------------------------- */
  --fcb-r-btn:      6px;
  --fcb-r-card:     10px;
  --fcb-r-modal:    18px;
  --fcb-r-pill:     999px;

  --fcb-shadow-soft: 0 1px 2px rgba(61,31,61,.06), 0 1px 3px rgba(61,31,61,.04);
  --fcb-shadow-pop:  0 8px 24px rgba(61,31,61,.10);
  --fcb-shadow-lift: 0 16px 40px rgba(61,31,61,.16);
  --fcb-shadow-inset: inset 0 0 0 1px var(--fcb-line);

  --fcb-ease:     cubic-bezier(.2,.7,.2,1);
  --fcb-ease-emphasized: cubic-bezier(.16,1,.3,1);
  --fcb-t-fast:   120ms;
  --fcb-t-base:   200ms;
  --fcb-t-slow:   360ms;

  /* --- Gradients (placeholder art + hero scrims) ---------------------- */
  --fcb-grad-hero:      radial-gradient(120% 90% at 20% 30%, #6E406E 0%, #3D1F3D 55%, #2A1F2A 100%);
  --fcb-grad-blush:     linear-gradient(135deg, #F4E1D8 0%, #EAD1B0 100%);
  --fcb-grad-aubergine: linear-gradient(135deg, #3D1F3D 0%, #521A52 100%);
  --fcb-scrim-bottom:   linear-gradient(180deg, transparent 40%, rgba(42,31,42,.55) 100%);

  /* --- Layout --------------------------------------------------------- */
  --fcb-container:      1360px;
  --fcb-container-tight: 1120px;
  --fcb-gutter:         16px;
  --fcb-bottom-nav-h:   64px;
  --fcb-header-h:       72px;

  color-scheme: light;
}

/* Reduce motion for users who prefer it. */
@media (prefers-reduced-motion: reduce) {
  :root { --fcb-t-fast: 0ms; --fcb-t-base: 0ms; --fcb-t-slow: 0ms; }
}

/* Typography defaults — body renders in DM Sans, display in Fraunces via classes. */
html { font-family: var(--fcb-font-body); }
body { background: var(--fcb-bg); color: var(--fcb-ink); }
h1, h2, h3, .fcb-h1, .fcb-h2, .fcb-h3 { font-family: var(--fcb-font-display); font-weight: 600; letter-spacing: -.01em; }
.fcb-num, .price, .amount, .woocommerce-Price-amount { font-family: var(--fcb-font-num); font-feature-settings: "tnum"; }
