/**
 * variables.css - 网站统一风格变量
 *
 * 莫兰迪色系 - 素雅风格
 * 主色调：#6B7B8C（雾霾蓝灰）
 * 辅助色：#9B8E7E（暖灰褐）
 * 背景色：#F5F4F1（米白）
 * 文字色：#4A4A4A（深灰）
 *
 * @author 小猪
 * @date 2026-03-30
 */

:root {
    /* 主色调 - 莫兰迪雾霾蓝灰 */
    --primary-color: #6B7B8C;
    --primary-hover: #5A6A7B;
    --primary-light: #E8EBEE;

    /* 辅助色 - 暖灰褐 */
    --secondary-color: #9B8E7E;
    --secondary-light: #F0EDE8;

    /* 强调色 - 灰绿 */
    --accent-color: #7A8B69;
    --accent-light: #E8EBE5;

    /* 渐变色 */
    --gradient-primary: linear-gradient(135deg, #6B7B8C 0%, #9B8E7E 100%);
    --gradient-vip: linear-gradient(135deg, #5A6A7B 0%, #7A8B69 100%);

    /* 背景色 - 温暖的米白色系 */
    --bg-color: #F5F4F1;
    --bg-white: #FFFFFF;
    --bg-light: #FAF9F7;
    --bg-warm: #F0EDE8;

    /* 文字色 - 柔和的深灰色 */
    --text-primary: #4A4A4A;
    --text-secondary: #6B6B6B;
    --text-muted: #8B8B8B;
    --text-light: #A0A0A0;

    /* 边框色 - 低饱和度的灰褐色 */
    --border-color: #E0DDD5;
    --border-light: #EBE8E2;

    /* 状态色 - 莫兰迪风格的柔和状态色 */
    --success-color: #7A8B69;
    --warning-color: #B8A070;
    --error-color: #B87070;
    --info-color: #6B8B9B;

    /* VIP色 - 素雅金色系 */
    --vip-gold: #C4A574;
    --vip-bg: #4A5568;

    /* 阴影 - 更柔和的阴影 */
    --shadow-sm: 0 2px 8px rgba(107, 123, 140, 0.08);
    --shadow-md: 0 4px 16px rgba(107, 123, 140, 0.12);
    --shadow-lg: 0 8px 24px rgba(107, 123, 140, 0.16);

    /* 圆角 */
    --radius-sm: 6px;
    --radius-md: 8px;
    --radius-lg: 12px;
    --radius-xl: 16px;

    /* 间距 */
    --spacing-xs: 8px;
    --spacing-sm: 12px;
    --spacing-md: 16px;
    --spacing-lg: 24px;
    --spacing-xl: 32px;

    /* 字体 */
    --font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', sans-serif;
}