/**
 * 灵休 · 液态玻璃 —— 材质（material）
 *
 * 三种材质，按“离用户手指的远近”区分：
 *   .lg-glass    控制层玻璃：顶栏、底部导航、弹层、下拉、Toast。带真实背景模糊（backdrop-filter）。
 *   .lg-surface  内容层表面：卡片、列表。半透明 + 边缘高光，不模糊（便宜，且背景本来就是柔和渐变）。
 *   .lg-tint     着色玻璃：主按钮、强调块。品牌色渐变 + 高光。
 *
 * 铁律：
 *   - 玻璃上不要再叠玻璃（嵌套的 backdrop-filter 在 Chrome/Safari 里不会生效，只会白白耗性能）。
 *   - 一屏同时可见的 backdrop-filter 元素 ≤ 4 个（顶栏 + 底部导航 + 一个弹层/下拉 + Toast）。
 *   - 页面 CSS 里禁止出现 backdrop-filter，需要玻璃就给元素加 .lg-glass。
 */

/* ---------- 控制层玻璃 ---------- */
.lg-glass {
    background: var(--lg-glass-solid);
    border: 1px solid var(--lg-rim);
    box-shadow: var(--lg-edge), var(--lg-shadow-2);
    color: var(--lg-text);
}

@supports ((-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px))) {
    .lg-glass {
        background: var(--lg-glass);
        -webkit-backdrop-filter: var(--lg-blur);
        backdrop-filter: var(--lg-blur);
    }
}

/* 稍弱的玻璃：用于较大面积（如整条顶栏），减轻 GPU 负担 */
.lg-glass--soft {
    box-shadow: var(--lg-edge-soft), var(--lg-shadow-1);
}

@supports ((-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px))) {
    .lg-glass--soft {
        -webkit-backdrop-filter: var(--lg-blur-soft);
        backdrop-filter: var(--lg-blur-soft);
    }
}

/* ---------- 内容层表面 ---------- */
.lg-surface {
    background: var(--lg-surface);
    border: 1px solid var(--lg-rim);
    border-radius: var(--lg-r-lg);
    box-shadow: var(--lg-edge-soft), var(--lg-shadow-1);
}

/* 高光反射：左上角一抹柔光，模拟光源（只用于较大的卡片，避免满屏花哨） */
.lg-sheen {
    position: relative;
    overflow: hidden;
}

.lg-sheen::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 60%;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.34), rgba(255, 255, 255, 0));
    pointer-events: none;
}

[data-theme="dark"] .lg-sheen::before {
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.10), rgba(255, 255, 255, 0));
}

/* ---------- 着色玻璃 ---------- */
.lg-tint {
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.34), rgba(255, 255, 255, 0) 52%),
        linear-gradient(150deg, var(--lg-brand-hi), var(--lg-brand-lo));
    color: var(--lg-text-on-tint);
    border: 1px solid rgba(255, 255, 255, 0.34);
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.55),
        inset 0 -1px 0 rgba(0, 0, 0, 0.10),
        var(--lg-shadow-tint);
}

/* ---------- 触摸高光（由 assets/js/lx/glass.js 写入 --lg-lx / --lg-ly） ---------- */
.lg-lit,
body.lg .btn,
body.lg .quick-action {
    position: relative;
    overflow: hidden;
}

.lg-lit::after,
body.lg .btn::after,
body.lg .quick-action::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    border-radius: inherit;
    background: radial-gradient(circle 90px at var(--lg-lx, 50%) var(--lg-ly, 50%), rgba(255, 255, 255, 0.50), rgba(255, 255, 255, 0) 70%);
    opacity: 0;
    transition: opacity var(--lg-dur-2) var(--lg-ease);
    pointer-events: none;
}

.lg-lit.is-lit::after,
body.lg .btn.is-lit::after,
body.lg .quick-action.is-lit::after {
    opacity: 1;
    transition-duration: 0.06s;
}

/* ---------- 辅助功能：减少透明度 / 减少动效 ---------- */
@media (prefers-reduced-transparency: reduce) {
    .lg-glass,
    .lg-glass--soft {
        background: var(--lg-glass-solid);
        -webkit-backdrop-filter: none;
        backdrop-filter: none;
    }
}

@media (prefers-reduced-motion: reduce) {
    body.lg *,
    body.lg *::before,
    body.lg *::after {
        transition-duration: 0.01ms !important;
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
    }
}

/* ============================================================
   滚动条（统一定制）：细、圆角、半透明；平时几乎看不见，悬停/滚动时变明显。
   页面主滚动条、抽屉、表格、命令面板、列表都会自动应用。
   不要在页面里再写 ::-webkit-scrollbar。
   ============================================================ */
html {
    scrollbar-width: thin;
    scrollbar-color: var(--lg-fill-2) transparent;
}

body.lg * {
    scrollbar-width: thin;
    scrollbar-color: var(--lg-fill-2) transparent;
}

::-webkit-scrollbar {
    width: 10px;
    height: 10px;
}

::-webkit-scrollbar-track,
::-webkit-scrollbar-corner {
    background: transparent;
}

::-webkit-scrollbar-thumb {
    min-height: 36px;
    border: 3px solid transparent;
    border-radius: 999px;
    background: var(--lg-fill-2);
    background-clip: content-box;
}

::-webkit-scrollbar-thumb:hover {
    background: var(--lg-text-3);
    background-clip: content-box;
}

::-webkit-scrollbar-thumb:active {
    background: var(--lg-brand);
    background-clip: content-box;
}

/* 横向滚动条（表格、标签条）：更细一点；隐藏型滚动区用 .lg-noscrollbar */
.lg-noscrollbar {
    scrollbar-width: none;
}

.lg-noscrollbar::-webkit-scrollbar {
    display: none;
}
