/* ============================================
   帮帮乐 · Design Tokens v1.0
   三套主题共享的基础设计令牌
   ============================================ */

:root {
  /* === 间距系统 === */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-8: 32px;
  --space-10: 40px;
  --space-12: 48px;

  /* === 字体系统 === */
  --font-display: 'Noto Serif SC', 'Songti SC', 'SimSun', serif;
  --font-body: 'Noto Sans SC', 'PingFang SC', 'Microsoft YaHei', sans-serif;

  /* 基础字号 */
  --text-xs: 11px;
  --text-sm: 13px;
  --text-base: 15px;
  --text-md: 17px;
  --text-lg: 20px;
  --text-xl: 24px;
  --text-2xl: 30px;
  --text-3xl: 36px;

  /* === 圆角系统 === */
  --radius-sm: 8px;
  --radius-md: 14px;
  --radius-lg: 20px;
  --radius-xl: 28px;
  --radius-full: 999px;

  /* === 阴影系统 === */
  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.04);
  --shadow-card: 0 1px 3px rgba(0, 0, 0, 0.08);
  --shadow-elevated: 0 4px 12px rgba(0, 0, 0, 0.12);
  --shadow-modal: 0 8px 32px rgba(0, 0, 0, 0.18);

  /* === 触控 === */
  --touch-min: 44px;

  /* === 动画 === */
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --dur-fast: 150ms;
  --dur-normal: 250ms;
  --dur-slow: 400ms;

  /* === 小程序尺寸 === */
  --phone-width: 390px;
  --phone-height: 844px;
  --status-bar-h: 54px;
  --navbar-h: 44px;
  --tabbar-h: 60px;
  --safe-bottom: 20px;
}

/* ============================================
   主题1: 温暖邻里风 (默认)
   ============================================ */
.theme-warm {
  --color-primary: #EA580C;
  --color-primary-light: #FFEDD5;
  --color-primary-dark: #C2410C;
  --color-primary-bg: #FFF7ED;

  --color-success: #16A34A;
  --color-success-light: #DCFCE7;
  --color-warning: #F59E0B;
  --color-warning-light: #FEF3C7;
  --color-error: #DC2626;
  --color-error-light: #FEE2E2;
  --color-info: #0EA5E9;
  --color-info-light: #E0F2FE;

  --color-bg: #FDF6F0;
  --color-surface: #FFFFFF;
  --color-border: #E8D5C0;
  --color-divider: #F0E5D8;

  --color-text: #292524;
  --color-text-secondary: #78716C;
  --color-text-tertiary: #A8A29E;
  --color-text-inverse: #FFFFFF;

  --color-tab-active: #EA580C;
  --color-tab-inactive: #A8A29E;
  --color-tab-bg: rgba(255, 255, 255, 0.95);
}

/* ============================================
   主题2: 简约清爽风 (服务商端)
   ============================================ */
.theme-fresh {
  --color-primary: #0D9488;
  --color-primary-light: #CCFBF1;
  --color-primary-dark: #0F766E;
  --color-primary-bg: #F0FDFA;

  --color-success: #16A34A;
  --color-success-light: #DCFCE7;
  --color-warning: #F59E0B;
  --color-warning-light: #FEF3C7;
  --color-error: #DC2626;
  --color-error-light: #FEE2E2;
  --color-info: #0EA5E9;
  --color-info-light: #E0F2FE;

  --color-bg: #FAFBFC;
  --color-surface: #FFFFFF;
  --color-border: #D1D5DB;
  --color-divider: #E5E7EB;

  --color-text: #111827;
  --color-text-secondary: #6B7280;
  --color-text-tertiary: #9CA3AF;
  --color-text-inverse: #FFFFFF;

  --color-tab-active: #0D9488;
  --color-tab-inactive: #9CA3AF;
  --color-tab-bg: rgba(255, 255, 255, 0.95);
}

/* ============================================
   主题3: 极致关怀风 (银发大字版)
   ============================================ */
.theme-care {
  --color-primary: #D4380D;
  --color-primary-light: #FFE4D5;
  --color-primary-dark: #B8320C;
  --color-primary-bg: #FFFDF7;

  --color-success: #15803D;
  --color-success-light: #DCFCE7;
  --color-warning: #D97706;
  --color-warning-light: #FEF3C7;
  --color-error: #DC2626;
  --color-error-light: #FEE2E2;
  --color-info: #0369A1;
  --color-info-light: #E0F2FE;

  --color-bg: #FFFDF7;
  --color-surface: #FFFFFF;
  --color-border: #D6D3D1;
  --color-divider: #E7E5E4;

  --color-text: #1C1917;
  --color-text-secondary: #57534E;
  --color-text-tertiary: #78716C;
  --color-text-inverse: #FFFFFF;

  --color-tab-active: #D4380D;
  --color-tab-inactive: #78716C;
  --color-tab-bg: rgba(255, 255, 255, 0.95);

  /* 大字版特殊覆盖 */
  --text-xs: 16px;
  --text-sm: 18px;
  --text-base: 22px;
  --text-md: 26px;
  --text-lg: 30px;
  --text-xl: 36px;
  --text-2xl: 42px;

  --touch-min: 56px;
  --space-1: 6px;
  --space-2: 12px;
  --space-3: 18px;
  --space-4: 24px;
}
