/* ==========================================================================
   大西瓜博客 · 前台全局毛玻璃样式（方案 A：背景清晰，卡片磨砂）
   被 index.php / post.php / archive.php / about.php 共同引用
   ========================================================================== */

/* ---------- 背景：清晰的彩色光斑渐变 ---------- */
:root{
  --bg-image:
    radial-gradient(ellipse 600px 400px at 20% 15%, rgba(255,107,107,.18) 0%, transparent 60%),
    radial-gradient(ellipse 500px 350px at 80% 25%, rgba(91,141,239,.15) 0%, transparent 60%),
    radial-gradient(ellipse 450px 300px at 50% 60%, rgba(72,187,120,.12) 0%, transparent 60%),
    radial-gradient(ellipse 400px 280px at 70% 80%, rgba(246,211,101,.1) 0%, transparent 60%),
    linear-gradient(135deg,#eef1f7 0%,#e2e8f5 50%,#f3e8f8 100%);
  --glass-bg:hsla(0,0%,100%,.28);
  --glass-border:rgba(255,255,255,.45);
  --glass-shadow:0 8px 32px rgba(0,0,0,.12),0 1px 2px rgba(0,0,0,.06);
}
html[data-theme="dark"]{
  --bg-image:
    radial-gradient(ellipse 600px 400px at 20% 15%, rgba(255,107,107,.15) 0%, transparent 60%),
    radial-gradient(ellipse 500px 350px at 80% 25%, rgba(91,141,239,.12) 0%, transparent 60%),
    radial-gradient(ellipse 450px 300px at 50% 60%, rgba(72,187,120,.1) 0%, transparent 60%),
    radial-gradient(ellipse 400px 280px at 70% 80%, rgba(246,211,101,.08) 0%, transparent 60%),
    linear-gradient(135deg,#0f1419 0%,#131a24 50%,#1a1520 100%);
  --glass-bg:hsla(220,20%,12%,.4);
  --glass-border:rgba(255,255,255,.12);
  --glass-shadow:0 8px 32px rgba(0,0,0,.4),0 1px 2px rgba(0,0,0,.3);
}

/* 背景应用到 body（各页面的 body 背景由本文件接管） */
body{
  background:var(--bg-image) !important;
  background-attachment:fixed !important;
}

/* ---------- 毛玻璃工具类 ---------- */
/* 用法：给需要磨砂的元素加 class="glass-fx" */
.glass-fx{
  position:relative;overflow:hidden;
  background:var(--glass-bg) !important;
  border:1px solid var(--glass-border);
  border-radius:var(--radius);
  box-shadow:var(--glass-shadow);
  backdrop-filter:none !important;
  -webkit-backdrop-filter:none !important;
}
.glass-fx::before{
  content:'';position:absolute;top:0;right:0;bottom:0;left:0;
  background:var(--bg-image);background-attachment:fixed;
  filter:blur(18px);
  margin:-30px;             /* 外扩防止模糊边缘被裁切 */
  z-index:0;
}
.glass-fx > *{position:relative;z-index:1;}

/* 导航栏：半透明磨砂（sticky 定位，不裁切子元素） */
.nav{
  background:var(--glass-bg) !important;
  backdrop-filter:blur(18px) saturate(180%) !important;
  -webkit-backdrop-filter:blur(18px) saturate(180%) !important;
  border-bottom:1px solid var(--glass-border) !important;
}