/* Let's Talk — design tokens for the team-facing web surfaces.
 *
 * Mirrors the iOS AppTheme (terracotta / marigold / forest teal) so the
 * portal, login, Jazzmin admin, and django-wiki feel like one product.
 * Canonical reference: Guide/mobile_developer_guide.md §12 and
 * "Design Tokens — Color & Typography".
 *
 * Light-mode only for now (web surfaces don't switch with the OS yet).
 */

:root {
  /* Brand */
  --brand-primary: #D9532B;     /* Terracotta — primary CTAs, hero, accents */
  --brand-primary-deep: #B8401E; /* hover/active variant */
  --brand-accent: #E8B547;      /* Marigold — secondary highlights, badges */
  --brand-cool: #2D5F5D;        /* Forest Teal — links, sidebar accents */

  /* Surfaces */
  --background: #F5EFE6;        /* Cream — root */
  --surface: #FFFFFF;
  --surface-elevated: #FFFFFF;
  --surface-tint: #FBF6EE;      /* tinted surface for content wells */

  /* Ink (typography) */
  --ink-primary: #1A1A1A;
  --ink-secondary: #5C5C5C;
  --ink-tertiary: #9A9A9A;
  --ink-inverse: #FFFFFF;

  /* Borders */
  --border-light: #E8E0D2;
  --border-strong: #3D3D3D;

  /* Semantic */
  --success: #7A8B3A;           /* Olive */
  --warning: #E8852F;           /* Amber */
  --error:   #A93D2C;           /* Brick */

  /* Spacing scale (matches iOS) */
  --space-xs: 4px;
  --space-sm: 8px;
  --space-md: 16px;
  --space-lg: 24px;
  --space-xl: 32px;
  --space-xxl: 48px;

  /* Corner radius */
  --radius-sm: 8px;
  --radius-md: 16px;
  --radius-lg: 24px;
  --radius-pill: 999px;

  /* Shadows */
  --shadow-card: 0 10px 30px rgba(31, 22, 18, 0.06);
  --shadow-card-hover: 0 18px 44px rgba(31, 22, 18, 0.10);
  --shadow-elevated: 0 20px 60px rgba(31, 22, 18, 0.12);

  /* Typography */
  --font-display: "Fraunces", "Georgia", serif;
  --font-body: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", system-ui, sans-serif;
  --font-mono: "JetBrains Mono", "SF Mono", "Menlo", "Consolas", monospace;
}