/* ============================================================ 模板：蓝色清新（默认浅色方案） 以 [data-theme-template="blue-fresh"] 限定作用域；三套模板 CSS 同时加载，当前 的 data-theme-template 决定生效哪一套。 布局相关变量（圆角/过渡/字体）三套模板完全一致 → 切换不错位。 ============================================================ */ [data-theme-template="blue-fresh"] { --theme-bg: #fafbff; --theme-bg-secondary: #f3f5fb; --theme-bg-tertiary: #eceff7; --theme-card-bg: #ffffff; --theme-card-bg-hover: #f7f8fe; --theme-text-primary: #1a1f36; --theme-text-secondary: #4a5168; --theme-text-muted: #6b7390; --theme-text-weak: #95a0bd; --theme-border: #e4e8f2; --theme-border-light: #eef1f8; --theme-primary: #5b5bd6; --theme-primary-hover: #4a4ac4; --theme-primary-light: #eef0ff; --theme-primary-dark: #3d3da8; --theme-accent: #7c6ff0; --theme-accent-light: #f3f0ff; --theme-accent2: #0ea5e9; --theme-accent2-light: #e6f5fc; --theme-success: #10b981; --theme-info: #06b6d4; --theme-warning: #f59e0b; --theme-danger: #ef4444; --theme-shadow-sm: 0 1px 3px 0 rgba(30, 35, 80, 0.06), 0 1px 2px -1px rgba(30, 35, 80, 0.04); --theme-shadow-md: 0 4px 10px -2px rgba(30, 35, 80, 0.08), 0 2px 6px -2px rgba(30, 35, 80, 0.05); --theme-shadow-lg: 0 12px 28px -4px rgba(30, 35, 80, 0.1), 0 6px 14px -3px rgba(30, 35, 80, 0.06); --theme-shadow-xl: 0 20px 40px -6px rgba(30, 35, 80, 0.14), 0 10px 20px -4px rgba(30, 35, 80, 0.08); --primary-gradient: linear-gradient(135deg, #667eea 0%, #764ba2 100%); --primary-gradient-soft: linear-gradient(135deg, #7b8ff0 0%, #9b7de0 100%); --bg-gradient: radial-gradient(ellipse at 15% 0%, rgba(102, 126, 234, 0.08) 0%, transparent 50%), radial-gradient(ellipse at 85% 0%, rgba(124, 111, 240, 0.06) 0%, transparent 45%); --navbar-bg: rgba(255, 255, 255, 0.72); --navbar-border: rgba(228, 232, 242, 0.8); /* 导航/网址卡的品牌色 */ --theme-nav-primary: #2f6fe0; --theme-nav-primary-deep: #2457b4; --theme-nav-soft: rgba(47, 111, 224, 0.08); --theme-nav-soft-strong: rgba(47, 111, 224, 0.12); --theme-nav-shadow: rgba(47, 111, 224, 0.12); --theme-nav-border-soft: rgba(47, 111, 224, 0.3); /* 公告区域 */ --announce-top-bg: linear-gradient(135deg, #fde68a, #fcd34d); --announce-top-border: #d97706; --announce-top-icon: #d97706; --announce-bg: rgba(91, 91, 214, 0.06); --announce-border: #5b5bd6; --announce-icon: #5b5bd6; /* 布局变量：三套模板保持完全一致，避免切换错位 */ --theme-radius-sm: 10px; --theme-radius-md: 14px; --theme-radius-lg: 18px; --theme-radius-xl: 24px; --theme-radius-full: 9999px; --theme-transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1); --theme-transition-bounce: all 0.4s cubic-bezier(0.34, 1.56, 0.64, 1); --theme-font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "PingFang SC", "Microsoft YaHei", sans-serif; --card-shadow: var(--theme-shadow-sm); --card-hover-shadow: var(--theme-shadow-md); --border-radius: var(--theme-radius-md); --transition: var(--theme-transition); } /* 导航栏磨砂 */ [data-theme-template="blue-fresh"]:not([data-bs-theme="dark"]) .navbar { background-color: var(--navbar-bg) !important; border-bottom: 1px solid var(--navbar-border) !important; backdrop-filter: blur(18px) saturate(1.2); -webkit-backdrop-filter: blur(18px) saturate(1.2); } [data-theme-template="blue-fresh"] footer { background: linear-gradient(180deg, transparent 0%, rgba(243, 245, 251, 0.5) 100%); } [data-theme-template="blue-fresh"] .user-profile-header, [data-theme-template="blue-fresh"] .category-header, [data-theme-template="blue-fresh"] .admin-card-header, [data-theme-template="blue-fresh"] .dashboard-content-header { background: linear-gradient(180deg, var(--theme-bg-secondary) 0%, var(--theme-card-bg) 100%); }