/* =====================================================================
   次元闸云盘 · 新版皮肤（仅在 html[data-yz-skin="new"] 下生效）
   ---------------------------------------------------------------------
   本文件的所有规则都被限定在「管理员切换到新版」时才会命中；
   默认（原版）状态下不会加载、更不会影响任何样式。
   切换由同目录的 skin-switcher.js 负责。

   用法：与 index.html 同目录放置，并在 index.html 的 </head> 前加
        <!-- 可选：预加载（不预加载也行，JS 会按需注入） -->
        <link rel="stylesheet" href="/custom.css" media="not all" onload="this.media='all'">
   实际生效仍由 [data-yz-skin="new"] 决定，所以提前引入也安全。

   Cloudreve V3 用 MUI v4 + JSS，主色为运行时注入，故需 !important。
   ===================================================================== */

html[data-yz-skin="new"]{
  --c-brand:     #6366f1;
  --c-brand-2:   #8b5cf6;
  --c-accent:    #22d3ee;
  --c-bg:        #0b0d12;
  --c-surface:   #141821;
  --c-surface-2: #1b2030;
  --c-text:      #e6e9f2;
  --c-muted:     #8b93a7;
  --c-line:      rgba(255,255,255,.08);
  --c-radius:    16px;
  --c-radius-sm: 11px;
  --c-shadow:    0 12px 34px rgba(0,0,0,.42);
}

/* ---------- 1. 全局 ---------- */
html[data-yz-skin="new"] body{background:var(--c-bg) !important;}
html[data-yz-skin="new"] body,
html[data-yz-skin="new"] #root{
  font-family:"Segoe UI","PingFang SC","Microsoft YaHei",system-ui,-apple-system,sans-serif !important;
  color:var(--c-text);
}
html[data-yz-skin="new"] *::-webkit-scrollbar{width:10px;height:10px}
html[data-yz-skin="new"] *::-webkit-scrollbar-track{background:transparent}
html[data-yz-skin="new"] *::-webkit-scrollbar-thumb{
  background:rgba(255,255,255,.12);border-radius:99px;
  border:2px solid transparent;background-clip:content-box}
html[data-yz-skin="new"] *::-webkit-scrollbar-thumb:hover{
  background:rgba(255,255,255,.22);background-clip:content-box}

/* 统一背景光晕 */
html[data-yz-skin="new"] body::before{
  content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;
  background:
    radial-gradient(900px 520px at 12% 8%,rgba(99,102,241,.20),transparent 60%),
    radial-gradient(760px 480px at 88% 92%,rgba(139,92,246,.18),transparent 62%),
    linear-gradient(180deg,#0b0d12,#0b0d12);
}

html[data-yz-skin="new"] .MuiPaper-root{
  border-radius:var(--c-radius) !important;
  border:1px solid var(--c-line);
  background-image:none !important;
}
html[data-yz-skin="new"] .MuiDialog-paper{
  border-radius:20px !important;box-shadow:var(--c-shadow) !important}

/* ---------- 2. 顶栏 ---------- */
html[data-yz-skin="new"] .MuiAppBar-root{
  background:rgba(14,17,25,.78) !important;
  backdrop-filter:blur(14px);
  border-bottom:1px solid var(--c-line) !important;
  box-shadow:none !important;
}
html[data-yz-skin="new"] .MuiToolbar-root{min-height:64px}
html[data-yz-skin="new"] .MuiIconButton-root{
  border-radius:12px !important;transition:background .15s,transform .15s}
html[data-yz-skin="new"] .MuiIconButton-root:hover{
  background:rgba(255,255,255,.07) !important;transform:translateY(-1px)}

/* ---------- 3. 左侧导航 ---------- */
html[data-yz-skin="new"] .MuiDrawer-paper{
  background:#0e1119 !important;
  border-right:1px solid var(--c-line) !important;
  background-image:none !important;
}
html[data-yz-skin="new"] .MuiListItem-root.MuiListItem-button{
  border-radius:var(--c-radius-sm) !important;margin:2px 8px !important;
  transition:background .15s,color .15s;
}
html[data-yz-skin="new"] .MuiListItem-root.MuiListItem-button:hover{
  background:rgba(255,255,255,.05) !important}
html[data-yz-skin="new"] .MuiListItem-root.Mui-selected{
  background:linear-gradient(90deg,rgba(99,102,241,.24),rgba(139,92,246,.10)) !important;
  box-shadow:inset 3px 0 0 0 var(--c-brand);color:#fff !important;
}
html[data-yz-skin="new"] .MuiListItem-root.Mui-selected:hover{
  background:linear-gradient(90deg,rgba(99,102,241,.30),rgba(139,92,246,.14)) !important}

/* ---------- 4. 按钮 / FAB ---------- */
html[data-yz-skin="new"] .MuiButton-containedPrimary,
html[data-yz-skin="new"] .MuiFab-primary{
  background:linear-gradient(135deg,var(--c-brand),var(--c-brand-2)) !important;
  color:#fff !important;
  box-shadow:0 10px 24px rgba(99,102,241,.34) !important;
  border-radius:12px !important;
}
html[data-yz-skin="new"] .MuiButton-containedPrimary:hover,
html[data-yz-skin="new"] .MuiFab-primary:hover{filter:brightness(1.08)}
html[data-yz-skin="new"] .MuiButton-root{
  border-radius:11px !important;text-transform:none !important;font-weight:600}
html[data-yz-skin="new"] .MuiFab-root{border-radius:16px !important}

/* ---------- 5. 输入框 ---------- */
html[data-yz-skin="new"] .MuiOutlinedInput-root{
  border-radius:var(--c-radius-sm) !important;background:var(--c-surface-2) !important;
}
html[data-yz-skin="new"] .MuiOutlinedInput-notchedOutline{border-color:var(--c-line) !important}
html[data-yz-skin="new"] .MuiOutlinedInput-root.Mui-focused .MuiOutlinedInput-notchedOutline{
  border-color:rgba(99,102,241,.75) !important;
  box-shadow:0 0 0 4px rgba(99,102,241,.16);
}
html[data-yz-skin="new"] .MuiInputLabel-root{color:var(--c-muted) !important}

/* ---------- 6. 表格 / 文件列表 ---------- */
html[data-yz-skin="new"] .MuiTable-root{background:var(--c-surface)}
html[data-yz-skin="new"] .MuiTableHead-root .MuiTableCell-root{
  background:var(--c-surface-2) !important;color:var(--c-muted) !important;
  font-size:12.5px !important;border-bottom:1px solid var(--c-line) !important;
}
html[data-yz-skin="new"] .MuiTableBody-root .MuiTableRow-root{transition:background .12s}
html[data-yz-skin="new"] .MuiTableBody-root .MuiTableRow-root:hover{
  background:rgba(255,255,255,.035) !important}
html[data-yz-skin="new"] .MuiTableCell-root{border-bottom:1px solid var(--c-line) !important}

/* ---------- 7. 进度条 ---------- */
html[data-yz-skin="new"] .MuiLinearProgress-root{
  background:rgba(255,255,255,.09) !important;border-radius:99px}
html[data-yz-skin="new"] .MuiLinearProgress-bar{
  background:linear-gradient(90deg,var(--c-brand),var(--c-accent)) !important;border-radius:99px}

/* ---------- 8. 标签 ---------- */
html[data-yz-skin="new"] .MuiChip-root{
  border-radius:999px !important;background:rgba(99,102,241,.14) !important;
  color:#a5b4fc !important;border:1px solid rgba(99,102,241,.28);
}

/* ---------- 9. 无障碍 ---------- */
html[data-yz-skin="new"] :focus-visible{
  outline:2px solid var(--c-brand);outline-offset:2px;border-radius:8px}
@media (prefers-reduced-motion:reduce){
  html[data-yz-skin="new"] *{transition:none !important;animation:none !important}
}

/* ---------- 10. 移动端 ---------- */
@media (max-width:900px){
  html[data-yz-skin="new"] .MuiToolbar-root{min-height:56px}
  html[data-yz-skin="new"] #root .MuiTable-root{font-size:13px}
}

/* ============================================================
   补丁：修复"白卡片 + 深色底"混搭（MuiPaper 只改圆角没改背景色）
   只在 html[data-yz-skin="new"] 下生效，默认皮肤零影响
   ============================================================ */
html[data-yz-skin="new"] .MuiPaper-root{
  background-color:var(--c-surface) !important;
  background-image:none !important;
  color:var(--c-text) !important;
}
html[data-yz-skin="new"] .MuiDialog-paper,
html[data-yz-skin="new"] .MuiMenu-paper,
html[data-yz-skin="new"] .MuiPopover-paper,
html[data-yz-skin="new"] .MuiAutocomplete-paper,
html[data-yz-skin="new"] .MuiDrawer-paper{
  background-color:var(--c-surface) !important;
  color:var(--c-text) !important;
  border:1px solid var(--c-line) !important;
}
html[data-yz-skin="new"] .MuiPopover-paper,
html[data-yz-skin="new"] .MuiMenu-paper{ box-shadow:var(--c-shadow) !important }

html[data-yz-skin="new"] .MuiTypography-root,
html[data-yz-skin="new"] .MuiListItemText-primary,
html[data-yz-skin="new"] .MuiTableCell-root,
html[data-yz-skin="new"] .MuiInputBase-input,
html[data-yz-skin="new"] .MuiFormControlLabel-label,
html[data-yz-skin="new"] .MuiMenuItem-root,
html[data-yz-skin="new"] .MuiDialogTitle-root,
html[data-yz-skin="new"] .MuiDialogContent-root,
html[data-yz-skin="new"] .MuiCardHeader-title,
html[data-yz-skin="new"] .MuiTab-root,
html[data-yz-skin="new"] .MuiSelect-root{ color:var(--c-text) !important }
html[data-yz-skin="new"] .MuiTypography-colorTextSecondary,
html[data-yz-skin="new"] .MuiListItemText-secondary,
html[data-yz-skin="new"] .MuiFormHelperText-root,
html[data-yz-skin="new"] .MuiCardHeader-subheader,
html[data-yz-skin="new"] .MuiInputLabel-root{ color:var(--c-muted) !important }
html[data-yz-skin="new"] .MuiSvgIcon-root{ color:inherit }
html[data-yz-skin="new"] .MuiDivider-root{ background-color:var(--c-line) !important }
html[data-yz-skin="new"] .MuiBackdrop-root{ background-color:rgba(4,6,10,.68) !important }
html[data-yz-skin="new"] .MuiTooltip-tooltip{
  background-color:#1b2030 !important;color:var(--c-text) !important;border-radius:10px !important}
html[data-yz-skin="new"] .MuiSkeleton-root{ background-color:rgba(255,255,255,.08) !important }

html[data-yz-skin="new"] .MuiMenuItem-root:hover,
html[data-yz-skin="new"] .MuiListItem-root.MuiListItem-button:hover,
html[data-yz-skin="new"] .MuiAutocomplete-option[data-focus="true"],
html[data-yz-skin="new"] .MuiAutocomplete-option:hover{
  background-color:rgba(255,255,255,.07) !important;
}
html[data-yz-skin="new"] .MuiMenuItem-root.Mui-selected{
  background:linear-gradient(90deg,rgba(99,102,241,.24),rgba(139,92,246,.10)) !important;
  color:#fff !important;
}
html[data-yz-skin="new"] .MuiButton-outlined{ border-color:var(--c-line) !important;color:var(--c-text) !important }
html[data-yz-skin="new"] .MuiButton-textPrimary{ color:#a5b4fc !important }
html[data-yz-skin="new"] .MuiTab-root.Mui-selected{ color:#a5b4fc !important }
html[data-yz-skin="new"] .MuiTabs-indicator{ background:linear-gradient(90deg,var(--c-brand),var(--c-brand-2)) !important }
html[data-yz-skin="new"] .MuiInputBase-input::placeholder{ color:var(--c-muted) !important;opacity:1 }
html[data-yz-skin="new"] .MuiFilledInput-root,
html[data-yz-skin="new"] .MuiInputBase-root{ color:var(--c-text) !important }

/* 补丁2：管理后台侧栏/子菜单浅色底（MuiList / MuiListItem 选中态） */
html[data-yz-skin="new"] .MuiList-root{ background-color:transparent !important }
html[data-yz-skin="new"] .MuiListItem-root{ background-color:transparent !important }
html[data-yz-skin="new"] .MuiListSubheader-root{ background-color:transparent !important;color:var(--c-muted) !important }
html[data-yz-skin="new"] .MuiExpansionPanelDetails-root{ background-color:transparent !important }
html[data-yz-skin="new"] .MuiExpansionPanelSummary-root{ color:var(--c-text) !important }
html[data-yz-skin="new"] .MuiListItem-root.Mui-selected,html[data-yz-skin="new"] .MuiListItem-root.Mui-selected:hover{
  background:linear-gradient(90deg,rgba(99,102,241,.30),rgba(139,92,246,.14)) !important;color:#fff !important }

/* ============================================================
   浅色变体：跟随云盘自带的「浅色/深色」开关
   由 skin-switcher.js 把云盘偏好（localStorage.user_preference.theme_mode）
   同步到 <html data-yz-mode="light|dark">；深色沿用上面的默认值。
   ============================================================ */
html[data-yz-skin="new"][data-yz-mode="light"]{
  --c-bg:        #f4f6fb;
  --c-surface:   #ffffff;
  --c-surface-2: #eff1f8;
  --c-text:      #1c2130;
  --c-muted:     #6b7280;
  --c-line:      rgba(23,28,42,.10);
  --c-shadow:    0 12px 34px rgba(23,28,42,.12);
}
html[data-yz-skin="new"][data-yz-mode="light"] body::before{
  background:
    radial-gradient(900px 520px at 12% 8%,rgba(99,102,241,.10),transparent 60%),
    radial-gradient(760px 480px at 88% 92%,rgba(139,92,246,.10),transparent 62%),
    linear-gradient(180deg,#f4f6fb,#f4f6fb);
}
html[data-yz-skin="new"][data-yz-mode="light"] .MuiAppBar-root{
  background:rgba(255,255,255,.82) !important;
}
html[data-yz-skin="new"][data-yz-mode="light"] .MuiDrawer-paper{
  background:#ffffff !important;
}
html[data-yz-skin="new"][data-yz-mode="light"] .MuiIconButton-root:hover{
  background:rgba(23,28,42,.06) !important;
}
html[data-yz-skin="new"][data-yz-mode="light"] .MuiMenuItem-root:hover,
html[data-yz-skin="new"][data-yz-mode="light"] .MuiListItem-root.MuiListItem-button:hover,
html[data-yz-skin="new"][data-yz-mode="light"] .MuiAutocomplete-option[data-focus="true"],
html[data-yz-skin="new"][data-yz-mode="light"] .MuiAutocomplete-option:hover,
html[data-yz-skin="new"][data-yz-mode="light"] .MuiTableBody-root .MuiTableRow-root:hover{
  background-color:rgba(23,28,42,.05) !important;
}
html[data-yz-skin="new"][data-yz-mode="light"] .MuiListItem-root.Mui-selected,
html[data-yz-skin="new"][data-yz-mode="light"] .MuiListItem-root.Mui-selected:hover,
html[data-yz-skin="new"][data-yz-mode="light"] .MuiMenuItem-root.Mui-selected{
  background:linear-gradient(90deg,rgba(99,102,241,.92),rgba(139,92,246,.82)) !important;
  color:#fff !important;
}
html[data-yz-skin="new"][data-yz-mode="light"] .MuiLinearProgress-root{
  background:rgba(23,28,42,.10) !important;
}
html[data-yz-skin="new"][data-yz-mode="light"] .MuiSkeleton-root{
  background-color:rgba(23,28,42,.08) !important;
}
html[data-yz-skin="new"][data-yz-mode="light"] *::-webkit-scrollbar-thumb{
  background:rgba(23,28,42,.18);border-radius:99px;border:2px solid transparent;background-clip:content-box;
}
html[data-yz-skin="new"][data-yz-mode="light"] *::-webkit-scrollbar-thumb:hover{
  background:rgba(23,28,42,.28);background-clip:content-box;
}
html[data-yz-skin="new"][data-yz-mode="light"] .MuiButton-textPrimary,
html[data-yz-skin="new"][data-yz-mode="light"] .MuiTab-root.Mui-selected{
  color:#4f46e5 !important;
}
html[data-yz-skin="new"][data-yz-mode="light"] .MuiChip-root{
  background:rgba(99,102,241,.12) !important;color:#4f46e5 !important;
  border:1px solid rgba(99,102,241,.28) !important;
}
html[data-yz-skin="new"][data-yz-mode="light"] .MuiBackdrop-root{
  background-color:rgba(17,20,28,.45) !important;
}
/* 提示气泡（按钮 hover 的停顿文字）：浅色模式下底色仍是深色，但 .MuiTypography-root
   的 color:var(--c-text) 在浅色下变成深色 -> 深底深字看不见。强制「深底 + 白字」。 */
html[data-yz-skin="new"] .MuiTooltip-arrow{ color:var(--c-surface-2) !important }
html[data-yz-skin="new"][data-yz-mode="light"] .MuiTooltip-tooltip{
  background-color:#1c2130 !important;
  box-shadow:0 10px 26px rgba(23,28,42,.28) !important;
}
html[data-yz-skin="new"][data-yz-mode="light"] .MuiTooltip-arrow{ color:#1c2130 !important }
html[data-yz-skin="new"][data-yz-mode="light"] .MuiTooltip-tooltip,
html[data-yz-skin="new"][data-yz-mode="light"] .MuiTooltip-tooltip *{ color:#fff !important }