/**
 * 全局 CSS 变量（唯一事实来源）
 * 
 * 使用说明：
 * 1. 修改此文件即可改变整站配色
 * 2. 所有项目通过引用此文件来使用变量
 * 3. 禁止在项目中重复定义这些变量
 * 4. 只定义变量，不定义样式规则
 * 5. 主题定义在 themes.css 中
 */

/* ==================== 默认变量（:root） ==================== */
/* Web 端使用 :root，小程序端使用 page */
:root {
  /* ========== 主色调（默认值，可被主题覆盖） ========== */
  --primary-color: #ff5000;
  --primary-hover: #e04300;
  --primary-light: rgba(255, 80, 0, 0.1);
  --primary-dark: #cc4000;
  --text-on-primary: #ffffff;

  /* ========== 辅助色 ========== */
  --secondary-color: #f5f5f5;
  --accent-color: #667eea;
  --accent-hover: #764ba2;

  /* ========== 语义化颜色 ========== */
  --success-color: #56ab2f;
  --success-light: rgba(86, 171, 47, 0.1);
  --warning-color: #f09819;
  --warning-light: rgba(240, 152, 25, 0.1);
  --danger-color: #dc3545;
  --danger-light: rgba(220, 53, 69, 0.1);
  --info-color: #00c6fb;
  --info-light: rgba(0, 198, 251, 0.1);

  /* ========== 订单状态颜色 ========== */
  --order-pending-pay-bg: #fff3cd;
  --order-pending-pay-text: #856404;
  --order-pending-ship-bg: #cce5ff;
  --order-pending-ship-text: #004085;
  --order-pending-receive-bg: #d4edda;
  --order-pending-receive-text: #155724;
  --order-completed-bg: #d1e7dd;
  --order-completed-text: #0f5132;
  --order-cancelled-bg: #f8d7da;
  --order-cancelled-text: #721c24;

  /* ========== 商品标签颜色 ========== */
  --badge-new-bg: linear-gradient(135deg, #ff416c 0%, #ff4b2b 100%);
  --badge-hot-bg: linear-gradient(135deg, #f09819 0%, #edde5d 100%);
  --badge-recommend-bg: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
  --badge-text: #ffffff;

  /* ========== 价格变动颜色 ========== */
  --price-down-color: #10b981;
  --price-up-color: var(--text-secondary);

  /* ========== 客服消息颜色 ========== */
  --cs-system-message-color: #6c757d;
  --cs-order-message-bg: linear-gradient(135deg, #f8f9fa, #e9ecef);
  --cs-order-message-border: #dee2e6;
  --cs-order-label-color: #6c757d;
  --cs-order-value-color: #212529;
  --cs-order-no-bg: #e7f3ff;
  --cs-order-no-color: #0066cc;
  --cs-product-message-bg: linear-gradient(135deg, #fff8e1, #ffe8c1);
  --cs-product-message-border: #ffc107;
  --cs-product-header-color: #e0a800;
  --cs-product-type-bg: #fff3cd;
  --cs-product-type-text: #856404;

  /* ========== 徽章颜色 ========== */
  --badge-light-bg: #e9ecef;
  --badge-light-text: #1f1f1f;
  --badge-secondary-bg: #6c757d;
  --badge-secondary-text: #ffffff;
  --badge-info-bg: #00c6fb;
  --badge-info-text: #ffffff;

  /* ========== 会员类型颜色 ========== */
  --member-ecommerce-bg: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
  --member-ecommerce-text: #ffffff;
  --member-ecommerce-border: #764ba2;
  --member-offline-bg: linear-gradient(135deg, #f093fb 0%, #f5576c 100%);
  --member-offline-text: #ffffff;
  --member-offline-border: #f5576c;

  /* ========== 会员等级颜色 ========== */
  --member-normal-bg: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
  --member-silver-bg: linear-gradient(135deg, #c0c0c0 0%, #e8e8e8 100%);
  --member-gold-bg: linear-gradient(135deg, #ffd700 0%, #ffec8b 100%);
  --member-platinum-bg: linear-gradient(135deg, #e5e4e2 0%, #f5f5f5 100%);
  --member-diamond-bg: linear-gradient(135deg, #b9f2ff 0%, #e0f7fa 100%);
  --member-level-text: #ffffff;

  /* ========== 其他颜色 ========== */
  --overlay-dark: rgba(0, 0, 0, 0.6);
  --overlay-darker: rgba(0, 0, 0, 0.8);
  --overlay-darkest: rgba(0, 0, 0, 0.9);
  --delete-danger: #ef4444;
  --delete-danger-light: rgba(239, 68, 68, 0.1);
  --favorite-color: #ff4757;
  --skeleton-bg: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%);
  --filter-alert-bg: linear-gradient(135deg, #fff3cd 0%, #ffe69c 100%);
  --filter-alert-border: #ffc107;
  --filter-alert-text: #856404;
  
  /* ========== 文本颜色 ========== */
  --text-primary: #1f1f1f;
  --text-secondary: #666666;
  --text-tertiary: #999999;
  --text-light: #bbbbbb;
  --text-white: #ffffff;
  --text-white-rgb: 255, 255, 255;
  --text-disabled: #cccccc;
  
  /* ========== 边框颜色 ========== */
  --border-color: #e5e5e5;
  --border-light: #f0f0f0;
  
  /* ========== 背景颜色 ========== */
  --bg-primary: #ffffff;
  --bg-secondary: #fafafa;
  --bg-tertiary: #f8f9fa;
  --bg-light: #f5f5f5;
  --bg-dark: #1a1a1a;
  --hover-bg: #f8f9fa;
  
  /* ========== 阴影 ========== */
  --shadow-sm: 0 2px 4px rgba(0, 0, 0, 0.08);
  --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.12);
  --shadow-lg: 0 8px 24px rgba(0, 0, 0, 0.15);
  --shadow-xl: 0 12px 32px rgba(0, 0, 0, 0.2);
  
  /* ========== 渐变 ========== */
  --gradient-primary: linear-gradient(135deg, #ff6b6b 0%, #ff5000 100%);
  --gradient-secondary: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
  --gradient-success: linear-gradient(135deg, #56ab2f 0%, #a8e063 100%);
  --gradient-info: linear-gradient(135deg, #00c6fb 0%, #005bea 100%);
  --gradient-warning: linear-gradient(135deg, #f09819 0%, #edde5d 100%);
  --gradient-danger: linear-gradient(135deg, #ff416c 0%, #ff4b2b 100%);
  --gradient-purple: linear-gradient(135deg, #8b5cf6 0%, #a78bfa 100%);
  
  /* ========== 间距 ========== */
  --spacing-xs: 4px;
  --spacing-sm: 8px;
  --spacing-md: 16px;
  --spacing-lg: 24px;
  --spacing-xl: 32px;
  --spacing-2xl: 48px;

  /* ========== 圆角 ========== */
  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-lg: 12px;
  --radius-xl: 16px;
  --radius-full: 9999px;

  /* ========== UI组件尺寸 ========== */
  --input-height-sm: 32px;
  --input-height-base: 40px;
  --input-height-lg: 48px;
  --button-height-sm: 32px;
  --button-height-base: 40px;
  --button-height-lg: 48px;
  --icon-size-xs: 12px;
  --icon-size-sm: 14px;
  --icon-size-base: 16px;
  --icon-size-lg: 20px;
  --icon-size-xl: 24px;

  /* ========== 模态框尺寸 ========== */
  --modal-header-padding: 16px 20px;
  --modal-body-padding: 20px;
  --modal-footer-padding: 16px 20px;
  --modal-close-size: 32px;
  --modal-close-icon-size: 18px;
  --modal-close-border-width: 2px;

  /* ========== 列表/卡片尺寸 ========== */
  --list-item-padding: 12px 16px;
  --list-item-gap: 12px;
  --card-padding: 16px;
  --card-padding-sm: 12px;
  --card-gap: 16px;
  --card-gap-sm: 12px;
  
  /* ========== 字体 ========== */
  --font-family-base: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', 'Noto Sans SC', sans-serif;
  --font-size-xs: 12px;
  --font-size-sm: 14px;
  --font-size-base: 16px;
  --font-size-lg: 18px;
  --font-size-xl: 20px;
  --font-size-2xl: 24px;
  --font-size-3xl: 32px;

  /* ========== UI组件专用字体大小 ========== */
  --font-size-modal-title: 18px;
  --font-size-modal-label: 13px;
  --font-size-modal-input: 14px;
  --font-size-modal-hint: 12px;
  --font-size-card-title: 14px;
  --font-size-card-content: 13px;
  --font-size-card-meta: 12px;
  --font-size-button: 14px;
  --font-size-list-item-title: 14px;
  --font-size-list-item-content: 13px;
  --font-size-list-item-meta: 12px;
  --font-size-stat-label: 13px;
  --font-size-stat-value: 16px;
  --font-size-tag: 11px;
  --font-size-badge: 11px;

  /* ========== 字体粗细 ========== */
  --font-weight-normal: 400;
  --font-weight-medium: 500;
  --font-weight-semibold: 600;
  --font-weight-bold: 700;
  
  /* ========== 聊天气泡 ========== */
  --chat-bubble-customer-bg: #fff;
  --chat-bubble-customer-text: #1f1f1f;
  --chat-bubble-admin-bg: var(--primary-color, #ff5000);
  --chat-bubble-admin-text: #fff;

  /* ========== 头像 ========== */
  --customer-avatar-bg: rgba(255, 80, 0, 0.1);
  --customer-avatar-text: #ff5000;
  --admin-avatar-bg: #1890ff;
  --admin-avatar-text: #fff;
  
  /* ========== 过渡 ========== */
  --transition-fast: 0.15s ease;
  --transition-base: 0.3s ease;
  --transition-slow: 0.5s ease;
  
  /* ========== Z-index ========== */
  --z-dropdown: 1000;
  --z-sticky: 1020;
  --z-fixed: 1030;
  --z-modal-backdrop: 1040;
  --z-modal: 1050;
  --z-popover: 1060;
  --z-tooltip: 1070;

  /* ========== 评分星级 ========== */
  --rating-star-color: #ffc107;
  --rating-star-fill-color: #ffc107;
  --rating-star-empty-color: #e0e0e0;

  /* ========== 统计卡片颜色 ========== */
  --stats-secondary-bg: linear-gradient(135deg, #6c757d 0%, #495057 100%);
  --stats-secondary-text: #ffffff;
  --stats-warning-bg: linear-gradient(135deg, #f09819 0%, #edde5d 100%);
  --stats-warning-text: #000000;

  /* ========== 状态徽章颜色 ========== */
  --badge-success-bg: #198754;
  --badge-success-text: #ffffff;
  --badge-danger-bg: #dc3545;
  --badge-danger-text: #ffffff;
  --badge-info-bg: #0dcaf0;
  --badge-info-text: #ffffff;
}