/* ============================================================
 * P015 智小盛CEO · 设计令牌
 * 4套皮肤CSS变量 · 从design-system.html提取
 * ============================================================ */

/* === SHARED DESIGN TOKENS (ALL SKINS) ==================== */
:root{
  --fontFamily: system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', sans-serif;
  --fontSize-xs: 10px;
  --fontSize-sm: 12px;
  --fontSize-base: 14px;
  --fontSize-lg: 16px;
  --fontSize-xl: 18px;
  --fontSize-xxl: 22px;
  --fontWeight-normal: 400;
  --fontWeight-medium: 500;
  --fontWeight-bold: 700;
  --lineHeight-tight: 1.25;
  --lineHeight-normal: 1.5;
  --lineHeight-loose: 1.75;
  --radius-xs: 2px;
  --radius-full: 9999px;
  --touch-min: 44px;
}

/* === DEFAULT BUSINESS SKIN (light) ======================= */
[data-skin="default-business"]{
  --bgPrimary: #FFFFFF;
  --bgSecondary: #F5F5F5;
  --bgCard: #FFFFFF;
  --textPrimary: #1A1A2E;
  --textSecondary: #666680;
  --accent: #4A6CF7;
  --danger: #EF4444;
  --success: #10B981;
  --warning: #F59E0B;
  --border: #E5E7EB;
  --spacing-xs: 4px;
  --spacing-sm: 8px;
  --spacing-md: 16px;
  --spacing-lg: 24px;
  --spacing-xl: 32px;
  --radius-sm: 6px;
  --radius-md: 10px;
  --radius-lg: 16px;
  --shadow-sm: 0 1px 3px rgba(0,0,0,0.06);
  --shadow-md: 0 4px 12px rgba(0,0,0,0.08);
  --shadow-lg: 0 8px 24px rgba(0,0,0,0.12);
  --bgOverlay: rgba(0,0,0,0.5);
  --bgInput: #F5F5F5;
  --bgDisabled: #E5E5E5;
  --textDisabled: #C0C0C0;
  --textPlaceholder: #BFBFBF;
  --textOnAccent: #FFFFFF;
  --divider: #E5E7EB;
  --bubbleUser: #E8F0FE;
  --bubbleAI: #FFFFFF;
  --bubbleSystem: #F0F0F0;
  --progressBg: #E5E7EB;
  --progressFill: #4A6CF7;
  --btnPrimaryBg: #4A6CF7;
  --btnPrimaryText: #FFFFFF;
  --btnSecondaryBg: #F0F0F0;
  --btnSecondaryText: #1A1A2E;
  --btnDangerBg: #EF4444;
  --btnDangerText: #FFFFFF;
  --btnGhostText: #4A6CF7;
  --btnGhostBorder: #4A6CF7;
  --inputFocusBorder: #4A6CF7;
  --tagGreen: #D1FAE5;
  --tagGreenText: #065F46;
  --tagYellow: #FEF3C7;
  --tagYellowText: #92400E;
  --tagRed: #FEE2E2;
  --tagRedText: #991B1B;
  --tagGray: #F3F4F6;
  --tagGrayText: #374151;
  --tagBlue: #DBEAFE;
  --tagBlueText: #1E40AF;
  --tagPurple: #EDE9FE;
  --tagPurpleText: #5B21B6;
  --tagTeal: #CCFBF1;
  --tagTealText: #115E59;
  --tagOrange: #FFEDD5;
  --tagOrangeText: #9A3412;
  --navBg: #FFFFFF;
  --navText: #1A1A2E;
  --navBorder: #E5E7EB;
  --tabBarBg: #FFFFFF;
  --tabBarBorder: #E5E7EB;
  --tabActive: #4A6CF7;
  --tabInactive: #999999;
}

/* === MINIMAL WHITE SKIN (light) ========================== */
[data-skin="minimal-white"]{
  --bgPrimary: #FAFAFA;
  --bgSecondary: #FFFFFF;
  --bgCard: #FFFFFF;
  --textPrimary: #111111;
  --textSecondary: #555555;
  --accent: #000000;
  --danger: #E53E3E;
  --success: #38A169;
  --warning: #D69E2E;
  --border: #E2E2E2;
  --spacing-xs: 4px;
  --spacing-sm: 8px;
  --spacing-md: 16px;
  --spacing-lg: 24px;
  --spacing-xl: 40px;
  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-lg: 12px;
  --shadow-sm: 0 0 0 1px rgba(0,0,0,0.04);
  --shadow-md: 0 0 0 1px rgba(0,0,0,0.06);
  --shadow-lg: 0 2px 16px rgba(0,0,0,0.08);
  --bgOverlay: rgba(0,0,0,0.4);
  --bgInput: #F5F5F5;
  --bgDisabled: #E8E8E8;
  --textDisabled: #B0B0B0;
  --textPlaceholder: #AAAAAA;
  --textOnAccent: #FFFFFF;
  --divider: #E2E2E2;
  --bubbleUser: #F0F0F0;
  --bubbleAI: #FFFFFF;
  --bubbleSystem: #F5F5F5;
  --progressBg: #E2E2E2;
  --progressFill: #000000;
  --btnPrimaryBg: #000000;
  --btnPrimaryText: #FFFFFF;
  --btnSecondaryBg: #F0F0F0;
  --btnSecondaryText: #111111;
  --btnDangerBg: #E53E3E;
  --btnDangerText: #FFFFFF;
  --btnGhostText: #000000;
  --btnGhostBorder: #000000;
  --inputFocusBorder: #000000;
  --tagGreen: #C6F6D5;
  --tagGreenText: #22543D;
  --tagYellow: #FEFCBF;
  --tagYellowText: #744210;
  --tagRed: #FED7D7;
  --tagRedText: #9B2C2C;
  --tagGray: #EDF2F7;
  --tagGrayText: #2D3748;
  --tagBlue: #BEE3F8;
  --tagBlueText: #2A4365;
  --tagPurple: #E9D8FD;
  --tagPurpleText: #44337A;
  --tagTeal: #B2F5EA;
  --tagTealText: #234E52;
  --tagOrange: #FEEBC8;
  --tagOrangeText: #7B341E;
  --navBg: #FFFFFF;
  --navText: #111111;
  --navBorder: #E2E2E2;
  --tabBarBg: #FFFFFF;
  --tabBarBorder: #E2E2E2;
  --tabActive: #000000;
  --tabInactive: #999999;
}

/* === DARK NIGHT SKIN (dark) ============================== */
[data-skin="dark-night"]{
  --bgPrimary: #0F0F1A;
  --bgSecondary: #1A1A2E;
  --bgCard: #16213E;
  --textPrimary: #EAEAEA;
  --textSecondary: #A0A0B0;
  --accent: #667EEA;
  --danger: #FC8181;
  --success: #68D391;
  --warning: #F6AD55;
  --border: #2D2D44;
  --spacing-xs: 4px;
  --spacing-sm: 8px;
  --spacing-md: 16px;
  --spacing-lg: 24px;
  --spacing-xl: 32px;
  --radius-sm: 6px;
  --radius-md: 10px;
  --radius-lg: 16px;
  --shadow-sm: 0 1px 3px rgba(0,0,0,0.3);
  --shadow-md: 0 4px 12px rgba(0,0,0,0.4);
  --shadow-lg: 0 8px 24px rgba(0,0,0,0.5);
  --bgOverlay: rgba(0,0,0,0.7);
  --bgInput: #1A1A2E;
  --bgDisabled: #2D2D44;
  --textDisabled: #555566;
  --textPlaceholder: #666680;
  --textOnAccent: #FFFFFF;
  --divider: #2D2D44;
  --bubbleUser: #1E3A5F;
  --bubbleAI: #16213E;
  --bubbleSystem: #1A1A2E;
  --progressBg: #2D2D44;
  --progressFill: #667EEA;
  --btnPrimaryBg: #667EEA;
  --btnPrimaryText: #FFFFFF;
  --btnSecondaryBg: #2D2D44;
  --btnSecondaryText: #EAEAEA;
  --btnDangerBg: #FC8181;
  --btnDangerText: #0F0F1A;
  --btnGhostText: #667EEA;
  --btnGhostBorder: #667EEA;
  --inputFocusBorder: #667EEA;
  --tagGreen: #064E3B;
  --tagGreenText: #6EE7B7;
  --tagYellow: #78350F;
  --tagYellowText: #FCD34D;
  --tagRed: #7F1D1D;
  --tagRedText: #FCA5A5;
  --tagGray: #374151;
  --tagGrayText: #D1D5DB;
  --tagBlue: #1E3A5F;
  --tagBlueText: #93C5FD;
  --tagPurple: #3B1F6E;
  --tagPurpleText: #C4B5FD;
  --tagTeal: #134E4A;
  --tagTealText: #99F6E4;
  --tagOrange: #774316;
  --tagOrangeText: #FED7AA;
  --navBg: #16213E;
  --navText: #EAEAEA;
  --navBorder: #2D2D44;
  --tabBarBg: #16213E;
  --tabBarBorder: #2D2D44;
  --tabActive: #667EEA;
  --tabInactive: #666680;
}

/* === VIBRANT ORANGE SKIN (light) ========================= */
[data-skin="vibrant-orange"]{
  --bgPrimary: #FFFBF5;
  --bgSecondary: #FFF4E6;
  --bgCard: #FFFFFF;
  --textPrimary: #2D1B00;
  --textSecondary: #6B4C2A;
  --accent: #FF6B35;
  --danger: #E53E3E;
  --success: #38A169;
  --warning: #ED8936;
  --border: #F0E0D0;
  --spacing-xs: 4px;
  --spacing-sm: 8px;
  --spacing-md: 16px;
  --spacing-lg: 24px;
  --spacing-xl: 36px;
  --radius-sm: 8px;
  --radius-md: 14px;
  --radius-lg: 20px;
  --shadow-sm: 0 2px 4px rgba(255,107,53,0.06);
  --shadow-md: 0 4px 12px rgba(255,107,53,0.1);
  --shadow-lg: 0 8px 24px rgba(255,107,53,0.15);
  --bgOverlay: rgba(0,0,0,0.45);
  --bgInput: #FFF4E6;
  --bgDisabled: #F0E0D0;
  --textDisabled: #C0A080;
  --textPlaceholder: #BFA080;
  --textOnAccent: #FFFFFF;
  --divider: #F0E0D0;
  --bubbleUser: #FFF0E0;
  --bubbleAI: #FFFFFF;
  --bubbleSystem: #FFF4E6;
  --progressBg: #F0E0D0;
  --progressFill: #FF6B35;
  --btnPrimaryBg: #FF6B35;
  --btnPrimaryText: #FFFFFF;
  --btnSecondaryBg: #FFF4E6;
  --btnSecondaryText: #2D1B00;
  --btnDangerBg: #E53E3E;
  --btnDangerText: #FFFFFF;
  --btnGhostText: #FF6B35;
  --btnGhostBorder: #FF6B35;
  --inputFocusBorder: #FF6B35;
  --tagGreen: #C6F6D5;
  --tagGreenText: #22543D;
  --tagYellow: #FEEBC8;
  --tagYellowText: #7B341E;
  --tagRed: #FED7D7;
  --tagRedText: #9B2C2C;
  --tagGray: #F7F3EE;
  --tagGrayText: #4A4030;
  --tagBlue: #DBEAFE;
  --tagBlueText: #1E40AF;
  --tagPurple: #EDE9FE;
  --tagPurpleText: #5B21B6;
  --tagTeal: #B2F5EA;
  --tagTealText: #234E52;
  --tagOrange: #FEEBC8;
  --tagOrangeText: #7B341E;
  --navBg: #FFFFFF;
  --navText: #2D1B00;
  --navBorder: #F0E0D0;
  --tabBarBg: #FFFFFF;
  --tabBarBorder: #F0E0D0;
  --tabActive: #FF6B35;
  --tabInactive: #C0A080;
}
