/* ==========================================================================
   全站毛玻璃（Glassmorphism）增强样式
   --------------------------------------------------------------------------
   引入位置：放在主题样式之后、ui.css 之后、页面内联 <style> 之前。
             推荐顺序：bootstrap → style.min.css/m.css → ui.css（已内联 Token）
                       → glass.css → 页面内联 <style>
             这样页面自定义样式优先级更高，本文件只做"增强"，不会覆盖既有设计。
             注意：本文件引用了 ui.css 的 --sh-* / --brand-*，须先加载 ui.css。

   作用范围：PC 首页、用户中心、后台管理、M 移动端（含 /m/user、/m/admin）。

   关闭方式：
     1) 给 <html> 加 class="glass-off"（如 <html class="glass-off">）；
     2) 或删除对应页面里的 glass.css 引用；
     3) 系统开启「减少透明效果 / 减少动态效果」时自动降级为不透明。
   ========================================================================== */

:root {
  --glass-blur: 14px;              /* 模糊半径 */
  --glass-sat: 170%;               /* 饱和度 */
  --glass-bg: rgba(255, 255, 255, .66);   /* 卡片等普通面 */
  --glass-bg-2: rgba(255, 255, 255, .80); /* 侧边栏 / 顶栏等大面积面 */
  --glass-bg-3: rgba(255, 255, 255, .90); /* 弹窗 / 下拉等浮层 */
  --glass-border: rgba(255, 255, 255, .75);
  --glass-line: rgba(15, 23, 42, .07);
  /* 阴影复用 Design Token，保证与 ui.css 的卡片层级一致 */
  --glass-shadow: var(--sh-2, 0 6px 24px rgba(15, 23, 42, .09));
  --glass-shadow-lg: var(--sh-3, 0 12px 36px rgba(15, 23, 42, .14));

  /* 背景光斑：毛玻璃需要有层次的底色才看得出折射，可单独给某页复用 */
  --glass-aurora:
    radial-gradient(closest-side, rgba(0, 189, 233, .22), rgba(0, 189, 233, 0) 100%),
    radial-gradient(closest-side, rgba(102, 126, 234, .16), rgba(102, 126, 234, 0) 100%),
    radial-gradient(closest-side, rgba(126, 217, 87, .20), rgba(126, 217, 87, 0) 100%),
    radial-gradient(closest-side, rgba(255, 193, 120, .14), rgba(255, 193, 120, 0) 100%);
  --glass-aurora-size: 72vmax 72vmax, 60vmax 60vmax, 78vmax 78vmax, 56vmax 56vmax, cover;
  --glass-aurora-pos: -10vmax -8vmax,
                      calc(100% + 10vmax) -6vmax,
                      calc(100% + 8vmax) calc(100% + 10vmax),
                      -8vmax calc(100% + 8vmax),
                      0 0;
}

/* ---------- 1. 全局背景光斑 ----------
   注意：仅作用于未自行定义 body 背景的页面（后台 / 用户中心 / M 端）。
   像 media.php（深色底）、各登录页（自带装饰圆）在页面内联样式里覆盖了
   body 背景，这里不会生效，保持它们原有设计。 */
body,
body.m-app {
  background-image: var(--glass-aurora),
                    linear-gradient(160deg, #e8fcff 0%, #f4ffe6 50%, #e8fcff 100%);
  background-repeat: no-repeat;
  background-size: var(--glass-aurora-size);
  background-position: var(--glass-aurora-pos);
}

/* ---------- 2. 通用毛玻璃工具类（供页面按需使用） ---------- */
.glass {
  background-color: var(--glass-bg);
  -webkit-backdrop-filter: blur(var(--glass-blur)) saturate(var(--glass-sat));
  backdrop-filter: blur(var(--glass-blur)) saturate(var(--glass-sat));
  border: 1px solid var(--glass-border);
  box-shadow: var(--glass-shadow);
}
.glass-strong {
  background-color: var(--glass-bg-3);
  -webkit-backdrop-filter: blur(20px) saturate(var(--glass-sat));
  backdrop-filter: blur(20px) saturate(var(--glass-sat));
  border: 1px solid var(--glass-border);
  box-shadow: var(--glass-shadow-lg);
}

/* ---------- 3. PC 后台 / 用户中心（Light Year 主题） ---------- */
.lyear-layout-header {
  background-color: var(--glass-bg-2);
  -webkit-backdrop-filter: blur(var(--glass-blur)) saturate(var(--glass-sat));
  backdrop-filter: blur(var(--glass-blur)) saturate(var(--glass-sat));
  box-shadow: 0 1px 0 var(--glass-line), 0 6px 20px rgba(15, 23, 42, .05);
}
.lyear-layout-sidebar-info,
.sidebar-header {
  background-color: var(--glass-bg-2);
  -webkit-backdrop-filter: blur(var(--glass-blur)) saturate(var(--glass-sat));
  backdrop-filter: blur(var(--glass-blur)) saturate(var(--glass-sat));
}
.sidebar-footer {
  background-color: transparent;
}

/* 卡片 */
.card {
  background-color: var(--glass-bg);
  -webkit-backdrop-filter: blur(var(--glass-blur)) saturate(var(--glass-sat));
  backdrop-filter: blur(var(--glass-blur)) saturate(var(--glass-sat));
  border: 1px solid var(--glass-border);
  box-shadow: var(--glass-shadow);
}
/* 带背景色的卡片头/尾（.bg-primary 等）保持原样，其余透出毛玻璃 */
.card-header:not([class*="bg-"]),
.card-footer:not([class*="bg-"]) {
  background-color: transparent;
  border-color: var(--glass-line);
}

/* 浮层：弹窗 / 抽屉 / 下拉 / 气泡 / Toast */
.modal-content,
.offcanvas,
.dropdown-menu,
.popover,
.toast {
  background-color: var(--glass-bg-3);
  -webkit-backdrop-filter: blur(20px) saturate(var(--glass-sat));
  backdrop-filter: blur(20px) saturate(var(--glass-sat));
  border: 1px solid var(--glass-border);
  box-shadow: var(--glass-shadow-lg);
}
.modal-header,
.modal-footer {
  border-color: var(--glass-line);
}

/* 表单控件 */
.form-control:not([class*="bg-"]),
.form-select:not([class*="bg-"]),
.input-group-text {
  background-color: rgba(255, 255, 255, .58);
  border-color: rgba(15, 23, 42, .10);
  -webkit-backdrop-filter: blur(6px) saturate(150%);
  backdrop-filter: blur(6px) saturate(150%);
}
.form-control:focus:not([class*="bg-"]),
.form-select:focus:not([class*="bg-"]) {
  background-color: rgba(255, 255, 255, .78);
}

/* 分页 */
.page-link {
  background-color: rgba(255, 255, 255, .62);
  border-color: rgba(15, 23, 42, .08);
  -webkit-backdrop-filter: blur(6px) saturate(150%);
  backdrop-filter: blur(6px) saturate(150%);
}

/* ---------- 4. M 移动端 ---------- */
.m-card,
.m-list {
  background-color: var(--glass-bg);
  -webkit-backdrop-filter: blur(var(--glass-blur)) saturate(var(--glass-sat));
  backdrop-filter: blur(var(--glass-blur)) saturate(var(--glass-sat));
  border: 1px solid var(--glass-border);
  box-shadow: var(--glass-shadow);
}
.m-bottom-nav {
  background-color: rgba(255, 255, 255, .78);
  -webkit-backdrop-filter: blur(18px) saturate(180%);
  backdrop-filter: blur(18px) saturate(180%);
  border-top: 1px solid var(--glass-border);
}
.m-input,
.m-select,
.m-textarea {
  background-color: rgba(255, 255, 255, .58);
  border-color: rgba(15, 23, 42, .10);
  -webkit-backdrop-filter: blur(6px) saturate(150%);
  backdrop-filter: blur(6px) saturate(150%);
}

/* ---------- 5. 兼容与降级 ---------- */
/* 浏览器不支持 backdrop-filter：回退为接近不透明的纯色，保证可读性 */
@supports not ((backdrop-filter: blur(2px)) or (-webkit-backdrop-filter: blur(2px))) {
  :root {
    --glass-bg: rgba(255, 255, 255, .95);
    --glass-bg-2: rgba(255, 255, 255, .97);
    --glass-bg-3: #fff;
  }
}
/* 系统开启「减少透明效果」时自动降级 */
@media (prefers-reduced-transparency: reduce) {
  :root {
    --glass-blur: 0px;
    --glass-bg: rgba(255, 255, 255, .95);
    --glass-bg-2: rgba(255, 255, 255, .97);
    --glass-bg-3: #fff;
  }
}
/* 手动关闭：<html class="glass-off"> */
html.glass-off {
  --glass-blur: 0px;
  --glass-bg: rgba(255, 255, 255, .96);
  --glass-bg-2: rgba(255, 255, 255, .98);
  --glass-bg-3: #fff;
}
html.glass-off body,
html.glass-off body.m-app {
  background-image: linear-gradient(160deg, #e8fcff 0%, #f4ffe6 50%, #e8fcff 100%);
}

/* 打印时去掉模糊，避免底色发灰 */
@media print {
  * {
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
  }
}
