/* ==========================================================================
   Design Tokens - CSS Custom Properties
   ใช้เป็นแหล่งข้อมูลสีและค่ามาตรฐานกลางของทั้งระบบ ห้าม Hardcode สีซ้ำในไฟล์อื่น
   ========================================================================== */
:root {
  /* Brand Colors */
  --color-primary: #4F46E5;
  --color-primary-dark: #3730A3;
  --color-primary-light: #EEF2FF;
  --color-secondary: #06B6D4;
  --color-secondary-light: #ECFEFF;
  --color-accent: #F59E0B;

  /* Semantic / Status Colors */
  --color-success: #10B981;
  --color-success-light: #ECFDF5;
  --color-warning: #F59E0B;
  --color-warning-light: #FFFBEB;
  --color-danger: #EF4444;
  --color-danger-light: #FEF2F2;
  --color-info: #0EA5E9;
  --color-info-light: #F0F9FF;

  /* Pipeline / CRM Status Colors */
  --color-status-new: #3B82F6;
  --color-status-new-light: #EFF6FF;
  --color-status-contacting: #0EA5E9;
  --color-status-contacting-light: #F0F9FF;
  --color-status-interested: #8B5CF6;
  --color-status-interested-light: #F5F3FF;
  --color-status-pending: #F59E0B;
  --color-status-pending-light: #FFFBEB;
  --color-status-won: #10B981;
  --color-status-won-light: #ECFDF5;
  --color-status-lost: #EF4444;
  --color-status-lost-light: #FEF2F2;
  --color-status-overdue: #EF4444;
  --color-status-overdue-light: #FEF2F2;
  --color-status-done: #10B981;
  --color-status-done-light: #ECFDF5;

  /* Surfaces */
  --color-background: #F6F8FC;
  --color-surface: #FFFFFF;
  --color-border: #E5E7EB;
  --color-border-strong: #D1D5DB;

  /* Text */
  --color-text-primary: #172033;
  --color-text-secondary: #64748B;
  --color-text-muted: #94A3B8;
  --color-text-inverse: #FFFFFF;
  --color-text-on-accent: #1F2937;

  /* Layout */
  --sidebar-width: 260px;
  --sidebar-collapsed-width: 84px;
  --topbar-height: 68px;

  /* Radius */
  --border-radius-sm: 8px;
  --border-radius-md: 12px;
  --border-radius-lg: 18px;
  --border-radius-pill: 999px;

  /* Shadow */
  --shadow-sm: 0 2px 8px rgba(15, 23, 42, 0.06);
  --shadow-md: 0 10px 30px rgba(15, 23, 42, 0.08);
  --shadow-lg: 0 20px 45px rgba(15, 23, 42, 0.12);

  /* Spacing scale */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-7: 48px;

  /* Typography */
  --font-family-base: "Noto Sans Thai", "Prompt", "Sarabun", system-ui,
    -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;

  --font-size-page-title: 1.75rem;
  --font-size-section-title: 1.25rem;
  --font-size-card-title: 1.05rem;
  --font-size-body: 0.95rem;
  --font-size-small: 0.85rem;
  --font-size-label: 0.85rem;
  --font-size-helper: 0.8rem;
  --font-size-button: 0.95rem;

  --transition-fast: 150ms ease;
  --transition-base: 220ms ease;
}