/* ═══════════════════════════════════════════════════════════════════
   CTB Realty — Design Tokens
   Apple-inspired design system shared across public, agent, and client
   ═══════════════════════════════════════════════════════════════════ */

:root {
  /* Brand — Stripe Design Language */
  --accent:        #635bff;
  --accent-hover:  #7c73ff;
  --accent-dark:   #8b83ff;
  --accent-on-dark: #8b83ff;
  --accent-light:  rgba(99,91,255,0.08);

  /* ── Base Colors ── */
  --bg:           #f5f5fa;
  --mega-bg:      rgba(255,255,255,0.7);
  --surface:      #ffffff;
  --surface-raised: #f9f9fb;
  --card:         #ffffff;
  --border:       #e4e4e8;
  --border-hover: #c7c7cc;

  /* ── Command Center Accent Colors (Preserved) ── */
  --navy:        #1A3C6B;
  --navy-deep:   #0F2545;
  --emerald:     #059669;
  --sapphire:    #2563EB;
  --amber:       #D97706;
  --rose:        #E11D48;
  --violet:      #7C3AED;

  /* ── Refined Glass ── */
  --glass:       rgba(255,255,255,0.8);
  --glass-b:     rgba(255,255,255,0.95);
  --glass-sh:    0 4px 24px rgba(0,0,0,0.04), 0 1px 4px rgba(0,0,0,0.02);
  --glass-sh-lg: 0 8px 40px rgba(0,0,0,0.08), 0 2px 8px rgba(0,0,0,0.04);
  --hairline: rgba(0,0,0,0.08);

  /* Always-dark tile colours */
  --tile-1: #000000;
  --tile-2: #1c1c1e;
  --tile-3: #2c2c2e;

  /* Light mode text */
  --ink:       #1d1d1f;
  --ink-muted: #6e6e73;
  --ink-faint: #aeaeb2;

  /* Aliases for legacy pages */
  --text:  var(--ink);
  --text2: var(--ink-muted);
  --text3: var(--ink-faint);

  /* Dark mode surfaces */
  --canvas:           #ffffff;
  --canvas-parchment: #f5f5f7;
  --mega-bg:          rgba(255,255,255,0.97);
  --mega-border:      rgba(0,0,0,0.08);

  /* Status colors */
  --green:  #30d158;
  --amber:  #ff9f0a;
  --red:    #ff453a;
  --purple: #bf5af2;

  /* Priority tags */
  --ph-bg: #fff1f1; --ph-tx: #c0392b; --ph-bd: #ffd5d5;
  --pm-bg: #fffbeb; --pm-tx: #b45309; --pm-bd: #fde68a;
  --pl-bg: #f0fdf4; --pl-tx: #166534; --pl-bd: #bbf7d0;

  /* Typography */
  --font: "Inter", system-ui, -apple-system, sans-serif;
  --font-mono: "SF Mono", "JetBrains Mono", "Fira Code", monospace;

  /* Layout */
  --sidebar-w: 248px;
  --topbar-h: 54px;

  /* Radii */
  --r4:  4px;
  --r6:  6px;
  --r8:  8px;
  --r10: 10px;
  --r12: 12px;
  --r16: 16px;
  --r20: 20px;
  --r99: 9999px;

  /* Shadows */
  --shadow-sm: 0 1px 3px rgba(0,0,0,.07), 0 2px 6px rgba(0,0,0,.04);
  --shadow-md: 0 4px 20px rgba(0,0,0,.11), 0 1px 4px rgba(0,0,0,.06);
  --shadow-lg: 0 12px 40px rgba(0,0,0,.15);

  /* Motion */
  --ease: cubic-bezier(0.2, 0.8, 0.2, 1);
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --t: 0.25s;
}

/* Dark Mode */
[data-theme="dark"] {
  --bg:            #09090f;
  --surface:       #111119;
  --surface-raised: #18181f;
  --card:          #111119;
  --border:        #26262e;
  --border-hover: #3e3e48;
  --hairline: rgba(255,255,255,0.1);
  --ink:       #f5f5f7;
  --ink-muted: #8e8e93;
  --ink-faint: #636366;
  --canvas:           #000000;
  --canvas-parchment: #1c1c1e;
  --mega-bg: rgba(14,14,20,0.98);
  --mega-border: rgba(255,255,255,0.12);
  --accent-light: rgba(99,91,255,0.12);
  --ph-bg: #2d1111; --ph-tx: #fca5a5; --ph-bd: #5a1a1a;
  --pm-bg: #2d1f00; --pm-tx: #fcd34d; --pm-bd: #5a3d00;
  --pl-bg: #001f0a; --pl-tx: #6ee7b7; --pl-bd: #003d14;

  /* Dashboard semantic overrides */
  --navy-deep: #e5e7eb;
  --glass:     rgba(28,28,30,0.8);
  --glass-b:   rgba(28,28,30,0.95);
  --glass-sh:  0 4px 24px rgba(0,0,0,0.2), 0 1px 4px rgba(0,0,0,0.1);
}