/* css/pb/tokens.css — design tokens for the WP1+ "pb" (Partners Brand) screens.
   SOURCE OF TRUTH: the brand block below re-exports Partners.Application.Common.BrandPalette,
   emitted server-side as --brand* by Views/Shared/_BrandTokens.cshtml (ADR-0044). Every other
   token (ink, surfaces, lines, status, radii, shadows, type, spacing, layout, motion) is owned
   HERE — this file, not BrandPalette, is their one source. PbTokensParityTests pins every
   re-export's literal fallback to its BrandPalette constant.
   LOAD ORDER: _BrandTokens.cshtml (emits --brand*) → css/pb/fonts.css → css/pb/tokens.css →
   base.css → layout.css → components.css. Never through bundleconfig.json (see root CLAUDE.md). */

:root {
  /* Brand — re-exported from --brand* (BrandPalette via _BrandTokens), literal fallback so this
     file still paints correctly if ever loaded without the partial in the head. */
  --pb-purple: var(--brand, #6C3AED);
  --pb-purple-deep: var(--brand-dark, #5325C4);
  --pb-indigo: var(--brand-indigo, #3B2BD9);
  --pb-indigo-deep: #2E21B0;
  --pb-navy: var(--brand-navy, #0B1446);
  --pb-blue: var(--brand-secondary, #0D6EFD);
  --pb-blue-hover: var(--brand-secondary-dark, #0B57CC);
  --pb-magenta: var(--brand-magenta, #C026D3);
  --pb-grad-brand: linear-gradient(135deg, var(--pb-purple) 0%, var(--pb-magenta) 100%);

  /* Ink */
  --pb-ink: #1F2937;
  --pb-ink-2: #374151;
  --pb-ink-3: #4B5563;
  --pb-ink-muted: #6B7280;       /* smallest text allowed on white */

  /* Surfaces */
  --pb-bg: #FFFFFF;
  --pb-bg-subtle: #F8FAFC;
  --pb-tint-1: var(--brand-soft, #F5F3FF);
  --pb-tint-2: #F4F0FE;          /* chip / secondary button */
  --pb-tint-3: #ECE8FB;
  --pb-tint-4: #E3DAFB;
  --pb-selected-bg: #FCFAFF;     /* selected radio card */

  /* Lines */
  --pb-line: #E5E7EB;
  --pb-line-soft: #F1F5F9;       /* row dividers inside panels */
  --pb-line-input: #D1D5DB;
  --pb-line-accent: #C9B5F7;     /* dashed upload, hover border */
  --pb-line-hover: #9B72EF;

  /* Status (AA-safe, from the app) */
  --pb-success: #047857;  --pb-success-text: #036B4E; --pb-success-bg: #E7F8F1;
  --pb-warning: #B45309;  --pb-warning-text: #92400E; --pb-warning-border: #F59E0B;
  --pb-error:   #DC2626;  --pb-error-text:   #B42318; --pb-error-bg:     #FEECEC;

  /* Radii */
  --pb-r-xs: 6px;  --pb-r-sm: 8px;  --pb-r-md: 12px; --pb-r-lg: 16px;
  --pb-r-xl: 18px; --pb-r-2xl: 22px; --pb-r-panel: 26px; --pb-r-pill: 100px;

  /* Shadows — soft shadows on cards, hairlines for lists/tables. cta/tint are DERIVED from
     --pb-purple via color-mix(), not a restated rgba() triple, so a rebrand moves them with the
     accent instead of leaving a second, unreachable copy of the old colour behind. */
  --pb-shadow-card: 0 10px 26px rgba(31,27,84,0.10);
  --pb-shadow-card-hover: 0 16px 36px rgba(31,27,84,0.12);
  --pb-shadow-cta: 0 10px 26px color-mix(in srgb, var(--pb-purple) 30%, transparent);
  --pb-shadow-tint: 0 14px 30px color-mix(in srgb, var(--pb-purple) 12%, transparent);
  --pb-shadow-float: 0 50px 110px rgba(5,8,28,0.60);   /* white panel on dark */

  /* Type — re-exported from --brand-font* so a rebrand's typeface edit reaches pb screens too. */
  --pb-font: var(--brand-font, 'Inter', system-ui, -apple-system, 'Segoe UI', sans-serif);
  --pb-font-bn: var(--brand-font-bn, 'Noto Sans Bengali', 'Inter', sans-serif);
  --pb-fs-display: 60px;  /* hero h1, 800, -0.036em, lh 1.06 */
  --pb-fs-h1: 42px;       /* page h1, 800, -0.034em */
  --pb-fs-h2: 34px;       /* section, 800, -0.032em */
  --pb-fs-h3: 21px;       /* 700, -0.022em */
  --pb-fs-lead: 17px;     /* lh 1.65 */
  --pb-fs-body: 15px;
  --pb-fs-ui: 14px;
  --pb-fs-small: 13px;
  --pb-fs-micro: 11px;    /* badges only, 700, +0.04em */

  /* Spacing (4px base) */
  --pb-s-1: 4px; --pb-s-2: 8px; --pb-s-3: 12px; --pb-s-4: 16px; --pb-s-5: 20px;
  --pb-s-6: 24px; --pb-s-8: 32px; --pb-s-11: 44px; --pb-s-14: 56px; --pb-s-18: 72px;

  /* Layout */
  --pb-container: 1320px;
  --pb-gutter: 32px;
  --pb-header-h: 72px;
  --pb-hit: 44px;          /* minimum interactive size */

  /* Motion */
  --pb-ease: cubic-bezier(.16,1,.3,1);
  --pb-dur-fast: .2s;
  --pb-dur: .24s;
  --pb-dur-enter: .6s;
}

[data-theme="dark"] {
  --pb-bg: #0B1030;
  --pb-ink: #FFFFFF;
  --pb-ink-2: #EEF2FF;
  --pb-ink-3: #B9C3E4;
  --pb-ink-muted: #97A3C8;
  --pb-tint-1: rgba(108,58,237,0.16);
  --pb-tint-2: rgba(108,58,237,0.26);
  --pb-line: rgba(255,255,255,0.10);
  --pb-line-soft: rgba(255,255,255,0.08);
  --pb-line-input: rgba(255,255,255,0.16);
  --pb-glass: rgba(255,255,255,0.04);
  --pb-accent-on-dark: #A88BFF;
  --pb-accent-on-dark-2: #C4AEFF;
  --pb-link-on-dark: #8AB4FF;
  --pb-success: #34D399; --pb-warning: #FCD34D; --pb-error: #FCA5A5;
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .001ms !important; animation-iteration-count: 1 !important; transition-duration: .001ms !important; }
}
.pb-num { font-variant-numeric: tabular-nums; }
