/**
 * 高级 Apple 风格主题变量定义
 * 强调通透感、圆润度、以及精准的色彩平衡
 */

:root {
  /* 系统基调 - 苹果 SF 系统配色 */
  --apple-gray-50: #f5f5f7;
  --apple-gray-100: #e8e8ed;
  --apple-gray-200: #d2d2d7;
  --apple-gray-300: #b0b0b5;
  --apple-gray-400: #86868b;
  --apple-gray-500: #6e6e73;
  --apple-gray-600: #424245;
  --apple-gray-700: #3a3a3c;
  --apple-gray-800: #2c2c2e;
  --apple-gray-900: #1c1c1e;

  /* 品牌色 - 苹果蓝 */
  --brand-blue: #0071e3;
  --brand-blue-hover: #0077ed;
  --brand-blue-light: rgba(0, 113, 227, 0.1);

  /* 语义化变量 - 浅色模式 (苹果白) */
  --bg-app: #f5f5f7;
  --bg-sidebar: rgba(255, 255, 255, 0.8);
  --bg-content: #ffffff;
  --bg-input: rgba(255, 255, 255, 0.8);
  --bg-hover: rgba(0, 0, 0, 0.05);
  --bg-active: rgba(0, 0, 0, 0.1);
  --bg-glass: rgba(255, 255, 255, 0.7);

  /* 消息气泡 */
  --bg-bubble-ai: #f2f2f7;
  --bg-bubble-user: var(--brand-blue);
  --text-bubble-user: #ffffff;
  --text-bubble-ai: #1d1d1f;

  /* 文字颜色 */
  --text-primary: #1d1d1f;
  --text-secondary: #86868b;
  --text-muted: #a1a1a6;
  --text-on-brand: #ffffff;

  /* 语义化颜色 */
  --accent-success: #34c759;
  --accent-error: #ff3b30;
  --accent-warning: #ff9500;
  --accent-info: #0071e3;

  /* 边框与阴影 */
  --border-color: rgba(0, 0, 0, 0.1);
  --shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.04);
  --shadow-md: 0 4px 16px rgba(0, 0, 0, 0.08);
  --shadow-lg: 0 12px 32px rgba(0, 0, 0, 0.12);

  /* 苹果式模糊 */
  --blur-std: blur(20px);

  /* 交互节奏 */
  --dur-fast: 200ms;
  --dur-normal: 300ms;
  --dur-slow: 500ms;
  --ease-standard: cubic-bezier(0.25, 0.1, 0.25, 1);

  /* 圆角 - 苹果超椭圆感 */
  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-lg: 20px;
  --radius-full: 999px;

  /* 安全区域 */
  --safe-area-top: env(safe-area-inset-top, 0px);
  --safe-area-bottom: env(safe-area-inset-bottom, 0px);
}

/* 深色模式覆盖 - 苹果暗黑 */
[data-theme="dark"] {
  --bg-app: #000000;
  --bg-sidebar: rgba(28, 28, 30, 0.8);
  --bg-content: #1c1c1e;
  --bg-input: rgba(44, 44, 46, 0.8);
  --bg-hover: rgba(255, 255, 255, 0.1);
  --bg-active: rgba(255, 255, 255, 0.15);
  --bg-glass: rgba(28, 28, 30, 0.7);

  /* 消息气泡 */
  --bg-bubble-ai: #2c2c2e;
  --bg-bubble-user: var(--brand-blue);
  --text-bubble-user: #ffffff;
  --text-bubble-ai: #f5f5f7;

  /* 文字颜色 */
  --text-primary: #f5f5f7;
  --text-secondary: #a1a1a6;
  --text-muted: #6e6e73;

  /* 边框与阴影 */
  --border-color: rgba(255, 255, 255, 0.1);
  --shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.4);
  --shadow-md: 0 4px 16px rgba(0, 0, 0, 0.6);
  --shadow-lg: 0 12px 32px rgba(0, 0, 0, 0.8);
}

/* 全局过渡效果 */
body {
  transition: background-color var(--dur-normal) var(--ease-standard),
              color var(--dur-normal) var(--ease-standard);
  background-attachment: fixed;
}

.main-app, .sidebar, .header, .chat-container, .input-container {
  transition: background-color var(--dur-normal) var(--ease-standard),
              border-color var(--dur-normal) var(--ease-standard);
}