/* ============================================================
 * 三角色全局主题系统（themes.css）
 *
 * 在 <body> 上设置 .theme-contest / .theme-admin / .theme-observer
 * 即可切换整体配色。所有共享组件（forms.css / login.css / dashboard.css
 * / 模板内联 <style>）统一使用下列变量即可全站一致。
 *
 * 业务要求：
 *   - 参赛选手：浅蓝主题（明快、专注、清爽）
 *   - 管 理 员 ：粉紫主题（精致、管理感、柔和）
 *   - 观 察 员 ：绿色主题 （自然、观摩、安全）
 * ============================================================ */

/* ---------- 默认（未登录首页/其他页面）：中性浅蓝 ---------- */
:root {
    --bg-page: linear-gradient(135deg, #e0f2fe 0%, #eff6ff 50%, #f0f9ff 100%);
    --bg-page-solid: #f0f9ff;
    --bg-card: #ffffff;
    --bg-sidebar: #f0f9ff;
    --bg-muted: #f8fafc;

    --accent-color: #0ea5e9;
    --accent-color-dark: #0284c7;
    --accent-gradient: linear-gradient(135deg, #0ea5e9 0%, #3b82f6 100%);
    --accent-gradient-soft: linear-gradient(135deg, #38bdf8 0%, #60a5fa 100%);
    --accent-shadow: rgba(14, 165, 233, 0.18);
    --accent-shadow-strong: rgba(14, 165, 233, 0.32);
    --accent-ring: rgba(14, 165, 233, 0.12);

    --text-primary: #0c4a6e;
    --text-secondary: #075985;
    --text-muted: #64748b;

    --border-color: #bae6fd;
    --border-color-strong: #7dd3fc;

    --stat-accent: var(--accent-gradient);
    --stat-accent-bg: var(--accent-color);
    --modal-header-bg: var(--accent-gradient);

    --btn-primary-bg: var(--accent-gradient);
    --btn-primary-hover-shadow: var(--accent-shadow-strong);
}

/* ============================================================
 * 1. 参赛选手：浅蓝主题（theme-contest）
 * ============================================================ */
body.theme-contest {
    --bg-page: linear-gradient(135deg, #e0f2fe 0%, #eff6ff 50%, #f0f9ff 100%);
    --bg-page-solid: #f0f9ff;
    --bg-card: #ffffff;
    --bg-sidebar: #f0f9ff;
    --bg-muted: #f8fafc;

    --accent-color: #0ea5e9;
    --accent-color-dark: #0284c7;
    --accent-gradient: linear-gradient(135deg, #0ea5e9 0%, #3b82f6 50%, #60a5fa 100%);
    --accent-gradient-soft: linear-gradient(135deg, #38bdf8 0%, #60a5fa 100%);
    --accent-shadow: rgba(14, 165, 233, 0.15);
    --accent-shadow-strong: rgba(14, 165, 233, 0.3);
    --accent-ring: rgba(14, 165, 233, 0.12);

    --text-primary: #0c4a6e;
    --text-secondary: #075985;
    --text-muted: #64748b;

    --border-color: #bae6fd;
    --border-color-strong: #7dd3fc;

    --stat-accent: linear-gradient(135deg, #0ea5e9 0%, #3b82f6 50%, #60a5fa 100%);
    --stat-accent-bg: #0ea5e9;
    --modal-header-bg: linear-gradient(135deg, #0ea5e9 0%, #3b82f6 100%);

    --btn-primary-bg: linear-gradient(135deg, #0ea5e9 0%, #3b82f6 100%);
    --btn-primary-hover-shadow: rgba(14, 165, 233, 0.3);

    /* 多层背景：上层是主题色渐变（半透明遮罩），下层是 bg.jpg 原图；两者 blend 出"带纹理的彩色背景" */
    background-image:
        linear-gradient(135deg, rgba(224, 242, 254, 0.88) 0%, rgba(239, 246, 255, 0.9) 50%, rgba(240, 249, 255, 0.88) 100%),
        url('../bg.jpg') !important;
    background-size: cover !important;
    background-position: center !important;
    background-attachment: fixed !important;
    background-repeat: no-repeat !important;
    background-blend-mode: overlay;
}

/* 选手容器阴影 */
body.theme-contest .container,
body.theme-contest .dashboard-container > * {
    --shadow-md: 0 4px 6px -1px rgba(14, 165, 233, 0.1), 0 2px 4px -2px rgba(14, 165, 233, 0.1);
    --shadow-lg: 0 10px 15px -3px rgba(14, 165, 233, 0.12), 0 4px 6px -4px rgba(14, 165, 233, 0.1);
    --shadow-xl: 0 20px 25px -5px rgba(14, 165, 233, 0.15), 0 8px 10px -6px rgba(14, 165, 233, 0.1);
}

/* ============================================================
 * 2. 管理员：粉紫主题（theme-admin）
 * ============================================================ */
body.theme-admin {
    --bg-page: linear-gradient(135deg, #fdf4ff 0%, #faf5ff 50%, #f5f3ff 100%);
    --bg-page-solid: #faf5ff;
    --bg-card: #ffffff;
    --bg-sidebar: #faf5ff;
    --bg-muted: #fafafa;

    --accent-color: #a855f7;
    --accent-color-dark: #9333ea;
    --accent-gradient: linear-gradient(135deg, #c084fc 0%, #a855f7 50%, #ec4899 100%);
    --accent-gradient-soft: linear-gradient(135deg, #d8b4fe 0%, #f0abfc 100%);
    --accent-shadow: rgba(168, 85, 247, 0.15);
    --accent-shadow-strong: rgba(168, 85, 247, 0.32);
    --accent-ring: rgba(168, 85, 247, 0.12);

    --text-primary: #581c87;
    --text-secondary: #7e22ce;
    --text-muted: #6b7280;

    --border-color: #e9d5ff;
    --border-color-strong: #d8b4fe;

    --stat-accent: linear-gradient(135deg, #c084fc 0%, #a855f7 50%, #ec4899 100%);
    --stat-accent-bg: #a855f7;
    --modal-header-bg: linear-gradient(135deg, #c084fc 0%, #a855f7 100%);

    --btn-primary-bg: linear-gradient(135deg, #c084fc 0%, #a855f7 50%, #ec4899 100%);
    --btn-primary-hover-shadow: rgba(168, 85, 247, 0.3);

    background-image:
        linear-gradient(135deg, rgba(253, 244, 255, 0.88) 0%, rgba(250, 245, 255, 0.9) 50%, rgba(245, 243, 255, 0.88) 100%),
        url('../bg.jpg') !important;
    background-size: cover !important;
    background-position: center !important;
    background-attachment: fixed !important;
    background-repeat: no-repeat !important;
    background-blend-mode: overlay;
}

/* 管理员容器阴影 */
body.theme-admin .container,
body.theme-admin .dashboard-container > * {
    --shadow-md: 0 4px 6px -1px rgba(168, 85, 247, 0.1), 0 2px 4px -2px rgba(168, 85, 247, 0.1);
    --shadow-lg: 0 10px 15px -3px rgba(168, 85, 247, 0.12), 0 4px 6px -4px rgba(168, 85, 247, 0.1);
    --shadow-xl: 0 20px 25px -5px rgba(168, 85, 247, 0.15), 0 8px 10px -6px rgba(168, 85, 247, 0.1);
}

/* ============================================================
 * 3. 观察员：绿色主题（theme-observer）
 * ============================================================ */
body.theme-observer {
    --bg-page: linear-gradient(135deg, #ecfdf5 0%, #f0fdf4 50%, #f7fee7 100%);
    --bg-page-solid: #ecfdf5;
    --bg-card: #ffffff;
    --bg-sidebar: #ecfdf5;
    --bg-muted: #fafafa;

    --accent-color: #10b981;
    --accent-color-dark: #059669;
    --accent-gradient: linear-gradient(135deg, #11998e 0%, #10b981 50%, #38ef7d 100%);
    --accent-gradient-soft: linear-gradient(135deg, #34d399 0%, #6ee7b7 100%);
    --accent-shadow: rgba(16, 185, 129, 0.15);
    --accent-shadow-strong: rgba(16, 185, 129, 0.32);
    --accent-ring: rgba(16, 185, 129, 0.12);

    --text-primary: #064e3b;
    --text-secondary: #065f46;
    --text-muted: #6b7280;

    --border-color: #a7f3d0;
    --border-color-strong: #6ee7b7;

    --stat-accent: linear-gradient(135deg, #11998e 0%, #10b981 50%, #38ef7d 100%);
    --stat-accent-bg: #10b981;
    --modal-header-bg: linear-gradient(135deg, #11998e 0%, #38ef7d 100%);

    --btn-primary-bg: linear-gradient(135deg, #11998e 0%, #10b981 50%, #38ef7d 100%);
    --btn-primary-hover-shadow: rgba(16, 185, 129, 0.3);

    background-image:
        linear-gradient(135deg, rgba(236, 253, 245, 0.88) 0%, rgba(240, 253, 244, 0.9) 50%, rgba(247, 254, 231, 0.88) 100%),
        url('../bg.jpg') !important;
    background-size: cover !important;
    background-position: center !important;
    background-attachment: fixed !important;
    background-repeat: no-repeat !important;
    background-blend-mode: overlay;
}

/* 观察员容器阴影 */
body.theme-observer .container,
body.theme-observer .dashboard-container > * {
    --shadow-md: 0 4px 6px -1px rgba(16, 185, 129, 0.1), 0 2px 4px -2px rgba(16, 185, 129, 0.1);
    --shadow-lg: 0 10px 15px -3px rgba(16, 185, 129, 0.12), 0 4px 6px -4px rgba(16, 185, 129, 0.1);
    --shadow-xl: 0 20px 25px -5px rgba(16, 185, 129, 0.15), 0 8px 10px -6px rgba(16, 185, 129, 0.1);
}

/* ============================================================
 * 共享：应用主题变量到通用组件
 * ============================================================ */

/* （已删除原来的 background-image: none 规则，避免误删除背景图） */

/* 表单聚焦色 */
.form-control:focus,
.form-group input:focus,
.form-group select:focus,
.form-group textarea:focus {
    border-color: var(--accent-color) !important;
    box-shadow: 0 0 0 3px var(--accent-ring) !important;
}

/* 主按钮 */
.btn-primary,
.btn-login,
.action-btn,
.login-btn {
    background: var(--btn-primary-bg) !important;
}

.btn-primary:hover,
.btn-login:hover,
.action-btn:hover,
.login-btn:hover {
    box-shadow: 0 6px 18px var(--btn-primary-hover-shadow) !important;
}

/* 链接色 */
a, .footer-link, .login-back a, .forgot-password, .register-link {
    color: var(--accent-color);
}

/* 欢迎卡片 / 头部卡片 / 模态框头 */
.welcome-card,
.header-card,
.modal-header,
.login-logo,
.stat-icon,
.action-icon {
    background: var(--accent-gradient) !important;
}

/* 数据卡片左边框 accent */
.stat-card {
    border-left-color: var(--accent-color);
}

/* 文本主色 */
h1, h2, h3, h4, .section-title, .dashboard-title {
    color: var(--text-primary);
}

.subtitle, .text-muted, .stat-label, .activity-time {
    color: var(--text-muted);
}
