@import url('../../public/css/style.css');

:root {
    /* ====================
       1. 核心品牌色 (Brand Colors)
       严格控制在3种主色调：红、金、灰/白
       ==================== */
    /* 主色调：标准党旗红/中国红 
       用于：导航栏、头部背景、主要按钮、重点标题、Active状态 */
    --color-primary: #DE2910;
    /* 主色调-浅：亮红色 
       用于：鼠标悬停(Hover)、选中态高亮、次要强调 */
    --color-primary-light: #FF4D4F;
    /* 主色调-深：深红色 
       用于：页脚背景、深色侧边栏、文字强调、底部导航 */
    --color-primary-dark: #A80000;
    /* 辅助色：尊贵金 
       用于：党徽、图标点缀、边框装饰、徽章、特殊高亮 */
    --color-secondary: #D4AF37;
    /* 辅助色-浅：淡金色/米色 
       用于：极淡的背景装饰、分割线、标签底色 */
    --color-secondary-light: #FDF5E6;
    /* ====================
       2. 基础中性色 (Base Neutrals)
       用于内容阅读，确保清晰、庄重
       ==================== */
    /* 纯白：页面主背景、卡片背景 */
    --color-white: #FFFFFF;
    /* 灰色阶梯：用于文本层级和边框 */
    --color-gray-50: #F9FAFB; /* 极淡灰，模块背景 */
    --color-gray-100: #F3F4F6; /* 浅灰，隔行变色 */
    --color-gray-200: #E5E7EB; /* 标准边框 */
    --color-gray-300: #D1D5DB; /* 禁用边框 */
    --color-gray-400: #9CA3AF; /* 禁用文字 */
    --color-gray-500: #6B7280; /* 次要文字 */
    --color-gray-600: #4B5563; /* 正文辅助 */
    --color-gray-800: #1F2937; /* 标题文字 */
    --color-gray-900: #111827; /* 重要文字 */
    /* 语义化映射 */
    --color-bg: var(--color-white); /* 页面整体背景 */
    --color-bg-light: var(--color-gray-50); /* 浅色背景区域 */
    --color-border: var(--color-gray-200); /* 标准边框 */
    --color-light-border: var(--color-gray-100); /* 浅色边框 */
    --color-text-primary: var(--color-gray-900); /* 主要文字 */
    --color-text-secondary: var(--color-gray-600); /* 次要文字 */
    /* ====================
       3. 功能状态色 (Functional Colors)
       保持低饱和度，不抢主色风头
       ==================== */
    --color-success: #52C41A; /* 成功/通过 */
    --color-warning: #FAAD14; /* 警告/待办 */
    --color-error: #FF4D4F; /* 错误/禁止 */
    --color-info: #1890FF; /* 信息/链接 */
    /* ====================
       4. 组件与交互样式 (Components & Interaction)
       ==================== */
    /* --- 侧边栏标题 (Sidebar Title) --- */
    /* 采用红金渐变或红底金字，体现党建特色 */
    --sidebar-title-gradient: linear-gradient(135deg, var(--color-primary) 0%, var(--color-primary-dark) 100%);
    /* 如果侧边栏标题需要文字渐变效果（较少用，建议用背景渐变）： */
    /* --sidebar-title-text-gradient: linear-gradient(135deg, #DE2910, #D4AF37); */
    /* --- 头部 (Header) --- */
    /* 经典的红色渐变，从正红到深红，增加立体感和庄重感 */
    --header-gradient: linear-gradient(135deg, #DE2910 0%, #A80000 100%);
    /* 头部阴影：红色系微弱阴影 */
    --header-shadow: 0 2px 8px rgba(222, 41, 16, 0.15);
    /* --- 功能区块 (Feature Section) --- */
    /* 极淡的红色背景渐变，用于特色栏目 */
    --feature-bg-gradient: linear-gradient(135deg, #FFF1F0 0%, #FFFFFF 100%);
    /* 图标渐变：红到金，点睛之笔 */
    --feature-icon-gradient: linear-gradient(135deg, #DE2910, #D4AF37);
    /* --- 其他全局元素 --- */
    --footer-bg: var(--color-primary-dark); /* 页脚使用深红，稳重压轴 */
    --gotop-bg: var(--color-primary); /* 回到顶部使用主红 */
    /* 交互背景 */
    --color-compact-hover-bg: #FFF1F0; /* 悬停淡红背景 */
    /* 遮罩层 */
    --color-overlay-start: rgba(0, 0, 0, 0.5);
    --color-overlay-end: rgba(0, 0, 0, 0.8);
    /* 链接颜色：建议使用蓝色或主红色，此处为区分品牌色，常用政务蓝，若需统一可用主红 */
    --color-link: #1890FF;
    --color-link-hover: #40A9FF;
}