/**
 * AI Link Design System v2 Override
 * 
 * 원칙: 기존 design-system.css를 절대 수정하지 않음
 * 동작: body.v2 클래스가 있을 때만 CSS 변수값을 오버라이드
 * 롤백: body에서 v2 클래스를 제거하면 즉시 기존 디자인 복원
 *
 * 참고: ailink-platform-final.html 디자인 시스템 기반
 * 위치: /css/design-system-v2.css
 */

/* ============================================
   Phase 1: 색상 체계 오버라이드
   - 기존 변수명 유지, 값만 변경
   - 기존 코드에서 var(--primary) 등을 쓰는 곳 전부 자동 반영
   ============================================ */
body.v2 {
  /* Primary — 인디고 → 딥 퍼플 */
  --primary: #6C3AE0;
  --primary-dark: #4A1FB8;
  --primary-light: #8B5CF6;
  --primary-lighter: #C4B5FD;
  --primary-bg: #EDE5FB;
  --primary-bg-hover: #DDD6FE;

  /* Role Colors — 유지 (이미 적합) */
  /* --customer-primary, --sales-primary 등은 변경 불필요 */

  /* Semantic Colors — 미세 조정 */
  --success: #059669;
  --success-dark: #047857;
  --success-bg: #D1FAE5;
  
  --warning: #D97706;
  --warning-dark: #B45309;
  --warning-bg: #FEF3C7;
  
  --danger: #DC2626;
  --danger-dark: #B91C1C;
  --danger-bg: #FEE2E2;
  
  --info: #2563EB;
  --info-dark: #1D4ED8;
  --info-bg: #DBEAFE;

  /* Gray Scale — 약간 쿨톤으로 조정 */
  --gray-50: #F8FAFC;
  --gray-100: #F1F5F9;
  --gray-200: #E2E8F0;
  --gray-300: #CBD5E1;
  --gray-400: #94A3B8;
  --gray-500: #64748B;
  --gray-600: #475569;
  --gray-700: #334155;
  --gray-800: #1E293B;
  --gray-900: #0F172A;

  /* Typography — Pretendard로 전환 */
  --font-family: 'Pretendard', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  
  /* Shadows — 더 정제된 그림자 */
  --shadow-xs: 0 1px 2px rgba(15, 23, 42, 0.04);
  --shadow-sm: 0 1px 3px rgba(15, 23, 42, 0.06), 0 1px 2px rgba(15, 23, 42, 0.04);
  --shadow: 0 4px 12px rgba(15, 23, 42, 0.07);
  --shadow-md: 0 8px 20px rgba(15, 23, 42, 0.08);
  --shadow-lg: 0 16px 40px rgba(15, 23, 42, 0.1);
  --shadow-primary: 0 8px 30px rgba(108, 58, 224, 0.25);

  /* Border Radius — 약간 더 부드럽게 */
  --radius-sm: 6px;
  --radius: 8px;
  --radius-md: 10px;
  --radius-lg: 14px;
  --radius-xl: 18px;
}

/* ============================================
   Phase 1: 기본 스타일 오버라이드
   ============================================ */
body.v2 {
  background: var(--gray-50);
  color: var(--gray-800);
  -webkit-font-smoothing: antialiased;
}

/* 버튼 호버 효과 강화 */
body.v2 .btn-primary:hover:not(:disabled) {
  background: var(--primary-dark);
  box-shadow: var(--shadow-primary);
}

/* 모달 둥글기 조정 */
body.v2 .modal-content {
  border-radius: var(--radius-lg);
}

/* 토스트 둥글기 조정 */
body.v2 .toast,
body.v2 .toast-message {
  border-radius: var(--radius-md);
}

/* ============================================
   이후 Phase에서 추가될 영역 (아직 비어 있음)
   ============================================ */

/* Phase 2: global-header-v2.css에서 처리 */
/* Phase 2: sidebar-v2.css에서 처리 */
/* Phase 3: 페이지별 v2 CSS에서 처리 */