/*
  IBC Platform Design Tokens
  ---------------------------------------------------------------------------
  Shared visual primitives for the advisor platform. These variables are
  intentionally namespaced with --ibc-* so they can be introduced without
  overriding legacy page-local CSS during the modernization rollout.
*/

:root {
  /*
    Color system
    Use the ink, surface, and accent scales for CRM-style screens that need
    financial polish without overwhelming dense household data.
  */
  --ibc-color-ink-900: #0f2044;
  --ibc-color-ink-800: #1a3260;
  --ibc-color-ink-700: #243b67;
  --ibc-color-ink-600: #374151;
  --ibc-color-ink-500: #6b7280;
  --ibc-color-ink-400: #9ca3af;
  --ibc-color-surface-0: #ffffff;
  --ibc-color-surface-50: #f9fafb;
  --ibc-color-surface-100: #f5f6f8;
  --ibc-color-surface-200: #eef1f5;
  --ibc-color-surface-raised: #ffffff;
  --ibc-color-surface-muted: #f8fafc;
  --ibc-color-border: #d8dde6;
  --ibc-color-border-soft: #e5e7eb;
  --ibc-color-accent-gold: #c9a84c;
  --ibc-color-accent-gold-soft: #f6edcf;
  --ibc-color-link: #244a94;
  --ibc-color-focus: rgba(36, 74, 148, .22);
  --ibc-color-text: var(--ibc-color-ink-600);
  --ibc-color-text-strong: var(--ibc-color-ink-900);
  --ibc-color-text-muted: var(--ibc-color-ink-500);

  /*
    Semantic and status colors
    Keep badges subtle: light backgrounds, darker text, and visible borders.
  */
  --ibc-color-success: #15803d;
  --ibc-color-success-bg: #dcfce7;
  --ibc-color-success-border: #bbf7d0;
  --ibc-color-warning: #b45309;
  --ibc-color-warning-bg: #fef3c7;
  --ibc-color-warning-border: #fde68a;
  --ibc-color-danger: #b91c1c;
  --ibc-color-danger-bg: #fee2e2;
  --ibc-color-danger-border: #fecaca;
  --ibc-color-info: #1d4ed8;
  --ibc-color-info-bg: #dbeafe;
  --ibc-color-info-border: #bfdbfe;
  --ibc-color-purple: #6d28d9;
  --ibc-color-purple-bg: #ede9fe;
  --ibc-color-purple-border: #ddd6fe;
  --ibc-color-neutral: #374151;
  --ibc-color-neutral-bg: #f3f4f6;
  --ibc-color-neutral-border: #e5e7eb;

  /*
    Typography
    Static HTML pages should use the system font stack for speed and Vercel
    compatibility. Do not scale type with viewport width.
  */
  --ibc-font-family-base: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --ibc-font-size-xs: .72rem;
  --ibc-font-size-sm: .82rem;
  --ibc-font-size-md: .94rem;
  --ibc-font-size-lg: 1.08rem;
  --ibc-font-size-xl: 1.32rem;
  --ibc-font-size-2xl: 1.68rem;
  --ibc-font-size-page-title: 1.48rem;
  --ibc-font-size-section-title: 1.02rem;
  --ibc-line-height-tight: 1.2;
  --ibc-line-height-base: 1.45;
  --ibc-line-height-relaxed: 1.65;
  --ibc-font-weight-medium: 600;
  --ibc-font-weight-semibold: 700;
  --ibc-font-weight-bold: 800;

  /*
    Spacing scale
    Designed for compact CRM records: enough breathing room to scan, not so much
    that advisors lose context while scrolling.
  */
  --ibc-space-1: 4px;
  --ibc-space-2: 8px;
  --ibc-space-3: 12px;
  --ibc-space-4: 16px;
  --ibc-space-5: 20px;
  --ibc-space-6: 24px;
  --ibc-space-8: 32px;
  --ibc-space-10: 40px;
  --ibc-space-12: 48px;
  --ibc-space-section: 18px;

  /*
    Shape and elevation
    Cards stay modestly rounded; interactive controls use slightly smaller
    radii to feel crisp and operational.
  */
  --ibc-radius-sm: 6px;
  --ibc-radius-md: 8px;
  --ibc-radius-lg: 10px;
  --ibc-radius-pill: 999px;
  --ibc-shadow-xs: 0 1px 2px rgba(15, 32, 68, .06);
  --ibc-shadow-sm: 0 8px 20px rgba(15, 32, 68, .07);
  --ibc-shadow-md: 0 14px 34px rgba(15, 32, 68, .09);
  --ibc-shadow-card: 0 10px 26px rgba(15, 32, 68, .075);
  --ibc-shadow-card-hover: 0 14px 34px rgba(15, 32, 68, .10);

  /*
    App shell layout
    Future phases should use these values to make Households, Household Home,
    Strategy, and diagnostic pages feel like one advisor workspace.
  */
  --ibc-shell-bg: var(--ibc-color-surface-100);
  --ibc-shell-header-bg: var(--ibc-color-ink-900);
  --ibc-container-max: 1240px;
  --ibc-container-narrow: 760px;
  --ibc-container-padding: 24px;
  --ibc-sticky-top: 0;
  --ibc-nav-height-compact: 42px;
  --ibc-control-height: 38px;
  --ibc-control-height-sm: 32px;
  --ibc-rail-sticky-top: 76px;
}