/* 远银 · 液态玻璃全局皮肤（反射 + 折射 + 流动光晕）
 * 配合 yuanyin-themes.css 变量；切换 data-yy-theme / data-yy-layout 时整体布局随之变化 */

:root {
  --yy-glass-blur: 20px;
  --yy-glass-saturate: 1.35;
  --yy-glass-bg: rgba(255, 255, 255, 0.42);
  --yy-glass-bg-strong: rgba(255, 255, 255, 0.62);
  --yy-glass-border: rgba(255, 255, 255, 0.55);
  --yy-glass-border-outer: rgba(255, 255, 255, 0.28);
  --yy-glass-highlight: linear-gradient(
    145deg,
    rgba(255, 255, 255, 0.72) 0%,
    rgba(255, 255, 255, 0.18) 42%,
    rgba(255, 255, 255, 0.04) 58%,
    rgba(255, 255, 255, 0.12) 100%
  );
  --yy-glass-shadow:
    0 10px 40px rgba(15, 23, 42, 0.1),
    0 2px 8px rgba(15, 23, 42, 0.04),
    inset 0 1px 0 rgba(255, 255, 255, 0.65),
    inset 0 -1px 0 rgba(255, 255, 255, 0.08);
  --yy-glass-radius: var(--yy-radius-card, 16px);
  --yy-motion: 0.28s cubic-bezier(0.4, 0, 0.2, 1);
}

/* ── 动态环境光斑：默认关闭，避免大面积色块干扰阅读 ── */
html.yy-glass-ready body::before,
html.yy-glass-ready body::after {
  display: none !important;
}

@keyframes yy-glass-drift {
  0% { transform: translate(0, 0) scale(1); }
  50% { transform: translate(2%, 3%) scale(1.06); }
  100% { transform: translate(-2%, 1%) scale(0.96); }
}

@keyframes yy-glass-shine {
  0% { background-position: 0% 50%; }
  100% { background-position: 200% 50%; }
}

/* ── 玻璃基类 ── */
.yy-glass,
.layui-card,
.layui-layer,
.layui-layer-page .layui-layer-content,
.layui-nav-tree,
.item-card,
.product-card,
.reward-card,
.mall-page,
.page-hint,
.card-filter-bar,
.yuanyin-search-dropdown,
.scum-items-page .layui-card,
.login-card,
.auth-card {
  position: relative;
  overflow: hidden;
}

.yy-glass::before,
.layui-card::before,
.layui-layer::before,
.item-card::before,
.product-card::before,
.mall-page::before,
.login-card::before,
.auth-card::before {
  display: none;
}

.yy-glass > *,
.layui-card > *,
.layui-layer > *,
.item-card > *,
.product-card > *,
.mall-page > * {
  position: relative;
  z-index: 1;
}

/* ── 卡片 / 面板玻璃材质 ── */
.layui-card,
.item-card,
.product-card,
.reward-card,
.mall-page,
.page-hint,
.card-filter-bar,
.login-card,
.auth-card,
.scum-items-page .layui-card {
  background: var(--yy-glass-bg) !important;
  backdrop-filter: blur(var(--yy-glass-blur)) saturate(var(--yy-glass-saturate));
  -webkit-backdrop-filter: blur(var(--yy-glass-blur)) saturate(var(--yy-glass-saturate));
  border: 1px solid var(--yy-glass-border) !important;
  box-shadow: var(--yy-glass-shadow) !important;
  border-radius: var(--yy-glass-radius) !important;
  transition: transform var(--yy-motion), box-shadow var(--yy-motion), border-color var(--yy-motion);
}

.layui-card:hover,
.item-card:hover,
.product-card:hover {
  transform: translateY(-2px);
  box-shadow:
    0 16px 48px rgba(15, 23, 42, 0.14),
    inset 0 1px 0 rgba(255, 255, 255, 0.75) !important;
}

/* ── 侧栏 / 顶栏玻璃 ── */
.layui-layout-admin .layui-side {
  background: color-mix(in srgb, var(--yy-glass-bg-strong) 88%, transparent) !important;
  backdrop-filter: blur(calc(var(--yy-glass-blur) + 4px)) saturate(var(--yy-glass-saturate));
  -webkit-backdrop-filter: blur(calc(var(--yy-glass-blur) + 4px)) saturate(var(--yy-glass-saturate));
  border-right: 1px solid var(--yy-glass-border-outer) !important;
  box-shadow: 4px 0 24px rgba(15, 23, 42, 0.06);
}

.layui-layout-admin .layui-header {
  background: color-mix(in srgb, var(--yy-glass-bg-strong) 90%, transparent) !important;
  backdrop-filter: blur(calc(var(--yy-glass-blur) + 2px)) saturate(var(--yy-glass-saturate));
  -webkit-backdrop-filter: blur(calc(var(--yy-glass-blur) + 2px)) saturate(var(--yy-glass-saturate));
  border-bottom: 1px solid var(--yy-glass-border-outer) !important;
  overflow: visible !important;
}

.layui-layout-admin .layui-header .layui-nav-child {
  z-index: 1010;
}

.layui-layout-admin .layui-logo {
  background: color-mix(in srgb, var(--yy-glass-bg) 70%, transparent) !important;
  backdrop-filter: blur(12px);
}

.layui-layout-admin .layui-nav-tree .layui-nav-item a {
  border-radius: 12px;
  margin: 3px 10px;
  transition: background var(--yy-motion), color var(--yy-motion), transform var(--yy-motion);
}

.layui-layout-admin .layui-nav-tree .layui-nav-item a:hover {
  transform: translateX(2px);
}

/* ── 按钮玻璃 ── */
.layui-btn,
.btn-login,
.yy-theme-btn {
  position: relative;
  overflow: hidden;
  transition: transform var(--yy-motion), box-shadow var(--yy-motion), filter var(--yy-motion);
}

.cat-chip {
  position: relative;
  overflow: visible;
  transition: transform var(--yy-motion), box-shadow var(--yy-motion), filter var(--yy-motion);
}

.layui-btn-normal,
.layui-btn:not(.layui-btn-primary):not(.layui-btn-danger):not(.layui-btn-warm) {
  background: var(--yy-accent-grad) !important;
  border: 1px solid rgba(255, 255, 255, 0.35) !important;
  box-shadow:
    0 6px 20px color-mix(in srgb, var(--yy-accent) 28%, transparent),
    inset 0 1px 0 rgba(255, 255, 255, 0.45) !important;
  border-radius: var(--yy-radius-btn, 12px) !important;
}

.layui-btn-primary {
  background: var(--yy-glass-bg) !important;
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border: 1px solid var(--yy-glass-border) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.5) !important;
}

.layui-btn:hover {
  transform: translateY(-1px);
  filter: brightness(1.04);
}

.layui-btn:active {
  transform: translateY(0);
  filter: brightness(0.98);
}

/* ── 输入框玻璃 ── */
.layui-input,
.layui-textarea,
.layui-select,
.qty-input {
  background: color-mix(in srgb, var(--yy-glass-bg-strong) 75%, var(--yy-input-bg)) !important;
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  border: 1px solid var(--yy-glass-border-outer) !important;
  box-shadow: inset 0 1px 2px rgba(15, 23, 42, 0.04);
  border-radius: 10px !important;
  transition: border-color var(--yy-motion), box-shadow var(--yy-motion);
}

.layui-input:focus,
.layui-textarea:focus {
  border-color: color-mix(in srgb, var(--yy-accent) 45%, white) !important;
  box-shadow:
    0 0 0 3px color-mix(in srgb, var(--yy-accent) 15%, transparent),
    inset 0 1px 0 rgba(255, 255, 255, 0.5) !important;
}

/* ── 表格玻璃 ── */
.layui-table {
  background: transparent !important;
}

.layui-table thead tr {
  background: color-mix(in srgb, var(--yy-glass-bg-strong) 85%, transparent) !important;
  backdrop-filter: blur(10px);
}

.layui-table tbody tr {
  transition: background var(--yy-motion);
}

.layui-table tbody tr:hover {
  background: color-mix(in srgb, var(--yy-accent) 8%, var(--yy-glass-bg)) !important;
}

/* ── Layui 弹窗玻璃（排除消息气泡 / 进度条，避免白底白字） ── */
.layui-layer:not(.layui-layer-msg):not(.yy-toast):not(.yy-load-bar):not(.yy-theme-msg) {
  background: var(--yy-glass-bg-strong) !important;
  backdrop-filter: blur(calc(var(--yy-glass-blur) + 6px)) saturate(var(--yy-glass-saturate));
  -webkit-backdrop-filter: blur(calc(var(--yy-glass-blur) + 6px)) saturate(var(--yy-glass-saturate));
  border: 1px solid var(--yy-glass-border) !important;
  border-radius: calc(var(--yy-glass-radius) + 4px) !important;
  box-shadow:
    0 24px 64px rgba(15, 23, 42, 0.2),
    inset 0 1px 0 rgba(255, 255, 255, 0.6) !important;
  overflow: hidden;
}

/* 主题色消息气泡：深色底 + 浅色字（与主色一致可读） */
.layui-layer-msg.layui-layer-hui,
.layui-layer.layui-layer-msg:not(.yy-toast) {
  background: color-mix(in srgb, var(--yy-accent, #0ea5e9) 18%, rgba(15, 23, 42, 0.92)) !important;
  color: #f8fafc !important;
  border: 1px solid color-mix(in srgb, var(--yy-accent, #0ea5e9) 45%, transparent) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  box-shadow: 0 10px 28px rgba(15, 23, 42, 0.28) !important;
}
.layui-layer-msg .layui-layer-content {
  color: #f8fafc !important;
}

.layui-layer-title {
  background: color-mix(in srgb, var(--yy-glass-bg) 60%, transparent) !important;
  border-bottom: 1px solid var(--yy-glass-border-outer) !important;
  backdrop-filter: blur(8px);
}

/* ── 分类条 / 统计卡 ── */
.cat-chip {
  border: 1px solid rgba(255, 255, 255, 0.35) !important;
  box-shadow:
    0 8px 24px rgba(15, 23, 42, 0.15),
    inset 0 1px 0 rgba(255, 255, 255, 0.35) !important;
}

.stats-grid .core-status-card,
.stat-card {
  background: var(--yy-glass-bg) !important;
  backdrop-filter: blur(var(--yy-glass-blur)) saturate(var(--yy-glass-saturate));
  -webkit-backdrop-filter: blur(var(--yy-glass-blur)) saturate(var(--yy-glass-saturate));
  border: 1px solid var(--yy-glass-border) !important;
  box-shadow: var(--yy-glass-shadow) !important;
}

/* ── 主题布局：标准玻璃 ── */
html[data-yy-layout="glass-standard"] .layui-layout-admin .layui-body {
  background: #f4f5f8 !important;
}

/* ── 主题布局：B2 紫韵（仅卡片圆角，无大面积背景条） ── */
html[data-yy-layout="b2-magazine"] {
  --yy-glass-blur: 16px;
  --yy-glass-radius: 16px;
  --yy-glass-bg: rgba(255, 255, 255, 0.88);
}

html[data-yy-layout="b2-magazine"] body,
html[data-yy-layout="b2-magazine"] .layui-layout-admin .layui-body {
  background: #f4f5f8 !important;
}

html[data-yy-layout="b2-magazine"] .layui-layout-admin .layui-body::after {
  display: none !important;
}

html[data-yy-layout="b2-magazine"] .stats-grid .core-status-card {
  border-radius: 16px !important;
}

html[data-yy-layout="b2-magazine"] .stats-grid .core-status-card .layui-card-body {
  padding: 20px 22px !important;
}

html[data-yy-layout="b2-magazine"] .layui-layout-admin .layui-nav-tree .layui-this > a {
  background: rgba(124, 58, 237, 0.1) !important;
  color: var(--yy-accent) !important;
  box-shadow: none;
}

html[data-yy-layout="b2-magazine"] .page-panel > .layui-card {
  border-radius: 16px !important;
}

html[data-yy-layout="b2-magazine"] .cat-chip {
  border-radius: 14px !important;
  min-width: 120px;
  padding: 14px 16px;
}

/* ── 磨砂 / 霜冻布局变体 ── */
html[data-yy-layout="frost-clean"] {
  --yy-glass-blur: 14px;
  --yy-glass-bg: rgba(255, 255, 255, 0.78);
  --yy-glass-saturate: 1.1;
}

html[data-yy-layout="frost-clean"] .layui-card {
  border-radius: 12px !important;
}

/* ── 薄荷 / 暖沙布局变体 ── */
html[data-yy-layout="mint-flow"] .stats-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

html[data-yy-layout="sand-warm"] .layui-layout-admin .layui-body::after {
  display: none !important;
}

/* ── iframe 内页 / 登录页 ── */
.scum-items-page,
body.auth-page,
body.login-page {
  background: #f4f5f8 !important;
}

.login-card,
.auth-card {
  max-width: 400px;
  margin: 0 auto;
  padding: 32px 28px;
}

/* ── 移动端减弱模糊以保性能 ── */
@media (max-width: 768px) {
  :root {
    --yy-glass-blur: 14px;
    --yy-glass-saturate: 1.15;
  }

  html.yy-glass-ready body::before,
  html.yy-glass-ready body::after {
    display: none !important;
  }

  html[data-yy-layout="b2-magazine"] .layui-layout-admin .layui-side {
    width: 200px !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  html.yy-glass-ready body::before,
  html.yy-glass-ready body::after,
  .layui-card::before,
  .yy-glass::before {
    animation: none !important;
  }
}

/* SCUM 物品卡：选择框在圆角区外，禁止 overflow 裁切 */
.scum-items-page .item-card,
.scum-items-page .item-card:hover {
  overflow: visible !important;
}

.item-card > .item-card-check-wrap {
  position: absolute !important;
  z-index: 20 !important;
}