/* ============================================================================
   Nuvia — Design System tokens (DS §2–§4)
   Single source of truth for palette, typography, spacing, radii, shadows.

   SCOPING: every token lives under `.nuvia` (the root wrapper added by
   nuvia_base.html), never `:root`, so the Nuvia layer cannot leak into the
   ~70 legacy Able Pro / Bootstrap screens that share the same document.
   ============================================================================ */

.nuvia {
  /* ── 2.1 Palette · Brand & accents ─────────────────────────────────── */
  --b-terracotta-50:  #FBEEE7;
  --b-terracotta-100: #F4D6C5;
  --b-terracotta-200: #E9B398;
  --b-terracotta-300: #DC8E6E;
  --b-terracotta-400: #CE7553;
  --b-terracotta-500: #B85A3A; /* Primary · CTAs, active, focus ring */
  --b-terracotta-600: #9C4830; /* Hover primary, eyebrow, links */
  --b-terracotta-700: #7A3624;

  --b-mustard-50:  #FBF3DC;
  --b-mustard-200: #E8C96B;
  --b-mustard-400: #BF9032;
  --b-mustard-500: #9D7421;

  --b-sage-100: #DDE5D6;
  --b-sage-300: #A4B89F;
  --b-sage-500: #6E8A6C; /* Success / completed */
  --b-sage-700: #4B6049;

  --b-rose-300: #E0B0A6;
  --b-rose-500: #C8786E; /* Warning / overrun */
  --b-rose-700: #8E483F;

  /* ── 2.1 Palette · Warm neutrals ───────────────────────────────────── */
  --b-cream-50:  #FBF7F1; /* Page background */
  --b-cream-100: #F6EFE5; /* Sidebar bg, subtle item hover */
  --b-cream-200: #ECE2D2; /* Card hover, soft chips, bar tracks */
  --b-cream-300: #DDD0BB;
  --b-sand-400:  #C6B59C; /* Border-strong */
  --b-sand-500:  #A89377;

  --b-surface:        #FFFFFF;
  --b-border-soft:    #ECE2D2;
  --b-border:         #DDD0BB;
  --b-border-strong:  #C6B59C;

  --b-ink-300:  #B5A695; /* Tertiary text, inactive icons, dashed */
  --b-ink-500:  #7C6B5E; /* Secondary text */
  --b-ink-700:  #4A3A30; /* Body text */
  --b-ink-900:  #2B201A; /* Headings */
  --b-ink-1000: #1A120D; /* Reserved, max contrast on imagery */

  /* ── 2.2 Semantic roles ────────────────────────────────────────────── */
  --b-bg-page:        var(--b-cream-50);
  --b-bg-sidebar:     var(--b-cream-100);
  --b-primary:        var(--b-terracotta-500);
  --b-primary-hover:  var(--b-terracotta-600);
  --b-success:        var(--b-sage-500);
  --b-warning:        var(--b-rose-500);
  --b-accent:         var(--b-mustard-400);
  --b-focus-ring:     var(--b-terracotta-500);
  --b-selection-bg:   rgba(184, 90, 58, 0.16);

  /* ── 2.3 Tag pairs · wedding categories (bg / text) ────────────────── */
  --b-tag-venue-bg:   var(--b-terracotta-50);  --b-tag-venue-fg:   var(--b-terracotta-700);
  --b-tag-vision-bg:  var(--b-mustard-50);     --b-tag-vision-fg:  var(--b-mustard-500);
  --b-tag-foto-bg:    #EADFE7;                 --b-tag-foto-fg:    #6D3F66;
  --b-tag-catering-bg:var(--b-sage-100);       --b-tag-catering-fg:var(--b-sage-700);
  --b-tag-musica-bg:  #E1DEEC;                 --b-tag-musica-fg:  #4F4A78;
  --b-tag-flores-bg:  var(--b-rose-300);       --b-tag-flores-fg:  var(--b-rose-700);
  --b-tag-vestir-bg:  #EFE4D2;                 --b-tag-vestir-fg:  #7A5C18;
  --b-tag-invitaciones-bg: #E6DCD0;            --b-tag-invitaciones-fg: var(--b-ink-700);
  --b-tag-transporte-bg:   #DBE5DF;            --b-tag-transporte-fg:   var(--b-sage-700);
  --b-tag-legal-bg:   var(--b-cream-200);      --b-tag-legal-fg:   var(--b-ink-700);
  --b-tag-lunamiel-bg:#D7E2EA;                 --b-tag-lunamiel-fg:#2C4E66;

  /* ── 1.1 / 3 Typography · Romance ──────────────────────────────────── */
  --b-display: "DM Serif Display", Georgia, serif;
  --b-body:    "Plus Jakarta Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --b-mono:    ui-monospace, SFMono-Regular, Menlo, monospace;
  --b-display-em-style: italic;
  --b-display-weight: 400;
  --b-display-letter: -0.015em;

  /* 3.1 Type scale — size / line-height / weight / letter-spacing */
  --b-font-display-xl:   400 56px/1.0 var(--b-display);   /* hero title */
  --b-font-display-l:    400 52px/1.1 var(--b-display);   /* page h1 */
  --b-font-display-m:    400 22px/1.1 var(--b-display);   /* card title */
  --b-font-display-s:    400 17px/1.15 var(--b-display);  /* event name */
  --b-font-kpi:          400 42px/1.0 var(--b-display);   /* KPI value */
  --b-font-body-l:       400 15px/1.5 var(--b-body);
  --b-font-body-m:       500 14px/1.45 var(--b-body);
  --b-font-body-s:       500 13px/1.45 var(--b-body);
  --b-font-body-xs:      500 12px/1.4 var(--b-body);
  --b-font-eyebrow:      600 11px/1.4 var(--b-body);
  --b-font-caps:         600 10px/1.4 var(--b-body);

  /* ── 4.1 Spacing (8pt grid) ────────────────────────────────────────── */
  --b-s-1: 4px;
  --b-s-2: 8px;
  --b-s-3: 12px;
  --b-s-4: 16px;
  --b-s-5: 24px;
  --b-s-6: 32px;
  --b-s-7: 48px;
  --b-s-8: 64px;
  --b-s-9: 96px;

  /* ── 4.2 Radii ─────────────────────────────────────────────────────── */
  --b-r-sm:   6px;
  --b-r-md:   10px;
  --b-r-lg:   16px;
  --b-r-xl:   22px;
  --b-r-2xl:  28px;
  --b-r-pill: 9999px;

  /* ── 4.3 Shadows ───────────────────────────────────────────────────── */
  --b-shadow-1: 0 1px 2px rgba(74,58,48,0.04), 0 1px 1px rgba(74,58,48,0.03);
  --b-shadow-2: 0 4px 14px -2px rgba(74,58,48,0.08), 0 2px 4px rgba(74,58,48,0.04);
  --b-shadow-3: 0 14px 32px -8px rgba(74,58,48,0.14), 0 4px 10px rgba(74,58,48,0.06);
  --b-shadow-warm: 0 18px 40px -12px rgba(184,90,58,0.22);

  /* ── 5 Layout ──────────────────────────────────────────────────────── */
  --b-sidebar-w: 232px;
  --b-main-max:  1380px;
}