multi-platform-media-manage/client/src/styles/variables.scss

// 主题颜色 - 精致简约浅色系
$primary-color: #4f8cff;
$primary-color-light: #e8f1ff;
$primary-color-dark: #3a7bd5;
$success-color: #52c41a;
$success-color-light: #f6ffed;
$warning-color: #faad14;
$warning-color-light: #fffbe6;
$danger-color: #ff4d4f;
$danger-color-light: #fff2f0;
$info-color: #8c8c8c;

// 品牌渐变色
$gradient-primary: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
$gradient-success: linear-gradient(135deg, #11998e 0%, #38ef7d 100%);
$gradient-info: linear-gradient(135deg, #4facfe 0%, #00f2fe 100%);
$gradient-warm: linear-gradient(135deg, #fa709a 0%, #fee140 100%);

// 文字颜色
$text-primary: #1f2937;
$text-regular: #4b5563;
$text-secondary: #9ca3af;
$text-placeholder: #d1d5db;

// 边框颜色
$border-base: #e5e7eb;
$border-light: #f3f4f6;
$border-lighter: #f9fafb;

// 背景颜色
$bg-base: #f8fafc;
$bg-light: #ffffff;
$bg-page: #f1f5f9;

// 侧边栏 - 浅色优雅风格
$sidebar-width: 200px;
$sidebar-collapsed-width: 64px;
$sidebar-bg: #ffffff;
$sidebar-menu-active-bg: $primary-color-light;
$sidebar-text-color: #64748b;
$sidebar-active-text-color: $primary-color;

// 头部
$header-height: 48px;
$header-bg: #ffffff;

// 布局
$content-padding: 20px;

// 标签页面板
$tabs-panel-width: 480px;
$tabs-panel-min-width: 360px;
$tabs-panel-max-width: 640px;

// 阴影
$shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
$shadow-base: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px -1px rgba(0, 0, 0, 0.1);
$shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -2px rgba(0, 0, 0, 0.1);
$shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -4px rgba(0, 0, 0, 0.1);

// 圆角
$radius-sm: 6px;
$radius-base: 8px;
$radius-lg: 12px;
$radius-xl: 16px;