/* ============================================================
   Verse 皮肤站全站主题 v2（Blessing Skin 6 前端适配）
   设计体系：daisyUI 官方 light/dark token（Tailwind 最热门组件库）
   字体/圆角/阴影/焦点环：Tailwind 官方规范
   覆盖范围：Spectre + AdminLTE 3 全组件 + BS 专页 + React 组件
   布局 DOM 不变，功能不受影响
   ============================================================ */

/* ---------- 1. 设计 token（daisyUI light） ---------- */
:root {
  --v-primary: #570df8;
  --v-primary-hover: #4a0ddb;
  --v-primary-soft: rgba(87, 13, 248, .08);
  --v-primary-content: #ffffff;
  --v-secondary: #f000b8;
  --v-secondary-soft: rgba(240, 0, 184, .10);
  --v-accent: #0d9488;
  --v-accent-soft: rgba(13, 148, 136, .12);
  --v-neutral: #3d4451;
  --v-neutral-content: #ffffff;
  --v-base-100: #ffffff;
  --v-base-200: #f4f5f7;
  --v-base-300: #e5e6e6;
  --v-base-content: #1d2939;
  --v-base-content-secondary: #667085;
  --v-info: #0284c7;
  --v-info-soft: rgba(2, 132, 199, .12);
  --v-success: #059669;
  --v-success-soft: rgba(5, 150, 105, .12);
  --v-warning: #d97706;
  --v-warning-soft: rgba(217, 119, 6, .12);
  --v-error: #dc2626;
  --v-error-soft: rgba(220, 38, 38, .12);
  --v-ring: rgba(87, 13, 248, .35);

  --v-radius-btn: .5rem;
  --v-radius-card: .875rem;
  --v-radius-input: .5rem;
  --v-radius-badge: .375rem;
  --v-shadow-card: 0 1px 3px rgba(16, 24, 40, .08), 0 1px 2px rgba(16, 24, 40, .04);
  --v-shadow-card-hover: 0 10px 24px rgba(16, 24, 40, .12), 0 2px 6px rgba(16, 24, 40, .06);
  --v-shadow-nav: 0 1px 0 rgba(16, 24, 40, .06), 0 2px 8px rgba(16, 24, 40, .05);
  --v-border: rgba(16, 24, 40, .10);
  --v-border-strong: rgba(16, 24, 40, .18);
  --v-font: ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto,
    "Helvetica Neue", "Noto Sans", "PingFang SC", "Microsoft YaHei", sans-serif;
  --v-mono: ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace;
  --v-ease: cubic-bezier(.4, 0, .2, 1);
}

/* ---------- 2. 设计 token（daisyUI dark） ---------- */
html.dark-mode, body.dark-mode {
  --v-primary: #7480ff;
  --v-primary-hover: #8b95ff;
  --v-primary-soft: rgba(116, 128, 255, .14);
  --v-primary-content: #ffffff;
  --v-secondary: #ff62ce;
  --v-secondary-soft: rgba(255, 98, 206, .14);
  --v-accent: #2dd4bf;
  --v-accent-soft: rgba(45, 212, 191, .14);
  --v-neutral: #2a2e37;
  --v-neutral-content: #ffffff;
  --v-base-100: #1d232a;
  --v-base-200: #161b21;
  --v-base-300: #2a2e37;
  --v-base-content: #e5e7eb;
  --v-base-content-secondary: #9ca3af;
  --v-info: #38bdf8;
  --v-info-soft: rgba(56, 189, 248, .14);
  --v-success: #34d399;
  --v-success-soft: rgba(52, 211, 153, .14);
  --v-warning: #fbbf24;
  --v-warning-soft: rgba(251, 191, 36, .14);
  --v-error: #f87171;
  --v-error-soft: rgba(248, 113, 113, .14);
  --v-ring: rgba(116, 128, 255, .45);

  --v-shadow-card: 0 1px 3px rgba(0, 0, 0, .45), 0 1px 2px rgba(0, 0, 0, .35);
  --v-shadow-card-hover: 0 10px 28px rgba(0, 0, 0, .55), 0 2px 6px rgba(0, 0, 0, .4);
  --v-shadow-nav: 0 1px 0 rgba(0, 0, 0, .35), 0 2px 10px rgba(0, 0, 0, .3);
  --v-border: rgba(255, 255, 255, .09);
  --v-border-strong: rgba(255, 255, 255, .16);
  color-scheme: dark;
}

/* ---------- 3. 基础 ---------- */
html {
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
body {
  font-family: var(--v-font);
  background-color: var(--v-base-200);
  color: var(--v-base-content);
  transition: background-color .25s var(--v-ease), color .25s var(--v-ease);
}
a { color: var(--v-primary); transition: color .15s var(--v-ease); }
a:hover { color: var(--v-primary-hover); }
h1, h2, h3, h4, h5, h6 { color: var(--v-base-content); font-weight: 700; letter-spacing: -.01em; }
code, pre { font-family: var(--v-mono); }
pre { background: var(--v-base-100); border: 1px solid var(--v-border); border-radius: .5rem; }
hr, .divider { border-color: var(--v-border); }
::selection { background: var(--v-primary); color: var(--v-primary-content); }

/* ---------- 4. 按钮（Spectre + AdminLTE/Bootstrap 统一覆盖） ---------- */
.btn,
button.btn,
input[type="submit"].btn,
.btn-default {
  font-family: var(--v-font);
  font-weight: 500;
  border-radius: var(--v-radius-btn);
  border: 1px solid var(--v-border-strong);
  background-color: var(--v-base-100);
  color: var(--v-base-content);
  box-shadow: none;
  transition: background-color .15s var(--v-ease), color .15s var(--v-ease),
    box-shadow .15s var(--v-ease), transform .1s var(--v-ease), border-color .15s var(--v-ease);
}
.btn:hover, .btn-default:hover {
  background-color: var(--v-base-200);
  color: var(--v-base-content);
  border-color: var(--v-border-strong);
}
.btn:active { transform: translateY(1px); }
.btn:focus, .btn:focus-visible, .btn-default:focus {
  outline: none;
  box-shadow: 0 0 0 3px var(--v-ring);
}
.btn.btn-primary, .btn-primary, .btn-primary:not(:disabled):not(.disabled):active {
  background-color: var(--v-primary);
  border-color: var(--v-primary);
  color: var(--v-primary-content);
  box-shadow: 0 2px 6px rgba(87, 13, 248, .25);
}
.btn.btn-primary:hover, .btn-primary:hover {
  background-color: var(--v-primary-hover);
  border-color: var(--v-primary-hover);
  color: var(--v-primary-content);
  box-shadow: 0 4px 12px rgba(87, 13, 248, .35);
}
body.dark-mode .btn.btn-primary, html.dark-mode .btn.btn-primary { box-shadow: 0 2px 6px rgba(116, 128, 255, .3); }
.btn.btn-success, .btn-success {
  background-color: var(--v-success); border-color: var(--v-success); color: #fff;
}
.btn.btn-error, .btn-error, .btn-danger, .btn-danger:not(:disabled):not(.disabled):active {
  background-color: var(--v-error); border-color: var(--v-error); color: #fff;
}
.btn.btn-warning { background-color: var(--v-warning); border-color: var(--v-warning); color: #1d2939; }
.btn.btn-link { background: transparent; color: var(--v-primary); border-color: transparent; }
.btn.btn-link:hover { color: var(--v-primary-hover); background: var(--v-primary-soft); border-color: transparent; }
.btn.btn-block { width: 100%; }
.btn:disabled, .btn.disabled { opacity: .5; cursor: not-allowed; }
.btn-group .btn, .btn-group-vertical .btn { border-radius: 0; }
.btn-group .btn:first-child { border-radius: var(--v-radius-btn) 0 0 var(--v-radius-btn); }
.btn-group .btn:last-child { border-radius: 0 var(--v-radius-btn) var(--v-radius-btn) 0; }

/* ---------- 5. 卡片（Spectre + AdminLTE 3 双套） ---------- */
.card, .card-outline {
  background-color: var(--v-base-100);
  border: 1px solid var(--v-border);
  border-radius: var(--v-radius-card);
  box-shadow: var(--v-shadow-card);
  color: var(--v-base-content);
  transition: box-shadow .2s var(--v-ease), border-color .2s var(--v-ease),
    background-color .25s var(--v-ease);
}
.card:hover { box-shadow: var(--v-shadow-card-hover); }
.card .card-header, .card .card-footer {
  background: transparent;
  border-color: var(--v-border);
  color: var(--v-base-content);
}
.card .card-header { font-weight: 600; border-top-left-radius: var(--v-radius-card); border-top-right-radius: var(--v-radius-card); }
.card .card-title { color: var(--v-base-content); font-weight: 600; }
.card .card-body { color: var(--v-base-content); }
/* AdminLTE 色彩变体卡片：去掉顶部粗条，改为标题上色 */
.card.card-primary { border-top: 0; }
.card.card-primary .card-header { color: var(--v-primary); }
.card.card-warning .card-header { color: var(--v-warning); }
.card.card-danger .card-header { color: var(--v-error); }
.card.card-success .card-header { color: var(--v-success); }
.card.card-info .card-header { color: var(--v-info); }
/* 皮肤项卡片 hover 浮起 */
.skinlib .card, .texture-card {
  overflow: hidden;
}
.skinlib .card:hover, .texture-card:hover {
  transform: translateY(-3px);
  box-shadow: var(--v-shadow-card-hover);
}
.card-img-top { background: var(--v-base-200); }

/* ---------- 6. 表单 ---------- */
.form-input, .form-select, .form-control, .custom-select,
input[type="text"]:not(.btn):not([class*="btn-"]),
input[type="email"], input[type="password"], input[type="search"],
input[type="number"], input[type="url"], textarea {
  background-color: var(--v-base-100);
  border: 1px solid var(--v-border-strong);
  border-radius: var(--v-radius-input);
  color: var(--v-base-content);
  font-family: var(--v-font);
  transition: border-color .15s var(--v-ease), box-shadow .15s var(--v-ease),
    background-color .25s var(--v-ease);
}
.form-input:focus, .form-select:focus, .form-control:focus, .custom-select:focus,
input:focus, textarea:focus {
  outline: none;
  border-color: var(--v-primary);
  box-shadow: 0 0 0 3px var(--v-ring);
  background-color: var(--v-base-100);
  color: var(--v-base-content);
}
.form-input::placeholder, .form-control::placeholder, textarea::placeholder {
  color: var(--v-base-content-secondary);
  opacity: .8;
}
.form-label, label { color: var(--v-base-content); font-weight: 500; }
.form-hint, .help-block, .form-text { color: var(--v-base-content-secondary); }
.form-checkbox input, .form-radio input,
.custom-control-input:checked ~ .custom-control-label::before {
  background-color: var(--v-primary);
  border-color: var(--v-primary);
}
.custom-control-input:focus ~ .custom-control-label::before {
  box-shadow: 0 0 0 3px var(--v-ring);
}
.form-input.is-invalid, .form-control.is-invalid { border-color: var(--v-error); }
/* input-group 拼接圆角 */
.input-group { border-radius: var(--v-radius-input); }
.input-group .form-control:first-child, .input-group-prepend .input-group-text {
  border-radius: var(--v-radius-input) 0 0 var(--v-radius-input);
}
.input-group-append .input-group-text, .input-group .btn:last-child {
  border-radius: 0 var(--v-radius-input) var(--v-radius-input) 0;
}
.input-group-text {
  background: var(--v-base-200);
  border-color: var(--v-border-strong);
  color: var(--v-base-content-secondary);
}
.input-group-append .btn { border-radius: 0 var(--v-radius-input) var(--v-radius-input) 0; }

/* ---------- 7. 导航（Spectre navbar + AdminLTE main-header） ---------- */
.navbar, .main-header.navbar {
  background-color: var(--v-base-100);
  border-bottom: 1px solid var(--v-border);
  box-shadow: var(--v-shadow-nav);
  color: var(--v-base-content);
  transition: background-color .25s var(--v-ease);
}
.navbar .nav-link, .navbar a, .navbar-section a, .navbar-brand {
  color: var(--v-base-content);
  font-weight: 500;
  border-radius: .375rem;
  transition: background-color .15s var(--v-ease), color .15s var(--v-ease);
}
.navbar .nav-link:hover, .navbar a:hover {
  color: var(--v-primary);
  background: var(--v-primary-soft);
}
.main-header .brand-link, .main-header .nav-link { color: var(--v-base-content); }
.main-header .nav-link:hover { color: var(--v-primary); background: var(--v-primary-soft); }
/* 首页 fixed 透明导航在浅色下保持玻璃感 */
.hp-wrapper .navbar.fixed-top {
  background: rgba(255, 255, 255, .82);
  backdrop-filter: blur(10px);
}
body.dark-mode .hp-wrapper .navbar.fixed-top, html.dark-mode .hp-wrapper .navbar.fixed-top {
  background: rgba(22, 27, 33, .82);
}
/* 强压 AdminLTE 彩色导航类（navbar-cyan/navbar-dark 等旧配色） */
.navbar[class*="navbar-"],
.main-header.navbar[class*="navbar-"] {
  background-color: var(--v-base-100) !important;
  border-bottom: 1px solid var(--v-border) !important;
  color: var(--v-base-content) !important;
}
.navbar[class*="navbar-"] .nav-link,
.navbar[class*="navbar-"] a,
.navbar[class*="navbar-"] .navbar-brand,
.navbar[class*="navbar-"] .brand-link,
.main-header[class*="navbar-"] .nav-link,
.main-header[class*="navbar-"] a {
  color: var(--v-base-content) !important;
}
.navbar[class*="navbar-"] .nav-link:hover,
.navbar[class*="navbar-"] a:hover,
.main-header[class*="navbar-"] .nav-link:hover {
  color: var(--v-primary) !important;
  background: var(--v-primary-soft) !important;
}
/* 强压 AdminLTE 侧栏暗色类 */
body:not(.dark-mode) .main-sidebar[class*="sidebar-dark-"],
html:not(.dark-mode) .main-sidebar[class*="sidebar-dark-"] {
  background-color: var(--v-base-100) !important;
  border-right: 1px solid var(--v-border) !important;
}
.main-sidebar[class*="sidebar-"] .nav-sidebar .nav-link,
.sidebar[class*="sidebar-"] .nav-sidebar .nav-link {
  color: var(--v-base-content-secondary) !important;
}
.main-sidebar[class*="sidebar-"] .brand-link {
  color: var(--v-base-content) !important;
}

/* AdminLTE 侧栏 */
.main-sidebar, .sidebar {
  background-color: var(--v-base-100);
  border-right: 1px solid var(--v-border);
  transition: background-color .25s var(--v-ease), width .2s var(--v-ease);
}
.main-sidebar .brand-link {
  color: var(--v-base-content);
  border-color: var(--v-border);
  font-weight: 700;
}
.nav-sidebar .nav-link {
  color: var(--v-base-content-secondary);
  border-radius: .5rem;
  margin: .125rem .5rem;
  transition: background-color .15s var(--v-ease), color .15s var(--v-ease);
}
.nav-sidebar .nav-link:hover {
  color: var(--v-primary);
  background: var(--v-primary-soft);
}
.nav-sidebar .nav-item.active > .nav-link,
.nav-sidebar .nav-link.active,
.nav-pills .nav-link.active {
  color: var(--v-primary-content);
  background: var(--v-primary);
  box-shadow: 0 4px 12px rgba(87, 13, 248, .3);
}
.nav-sidebar .nav-header {
  color: var(--v-base-content-secondary);
  font-size: .7rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .05em;
}
.user-panel { border-bottom: 1px solid var(--v-border); color: var(--v-base-content); }
.user-panel .info a { color: var(--v-base-content); }
.main-footer {
  background: transparent;
  border-color: var(--v-border);
  color: var(--v-base-content-secondary);
}
.content-wrapper { background-color: var(--v-base-200); }
/* content-header 页面标题 */
.content-header h1 { font-weight: 700; color: var(--v-base-content); }
.content-header .breadcrumb { background: transparent; color: var(--v-base-content-secondary); }
.content-header .breadcrumb-item a { color: var(--v-base-content-secondary); }
.content-header .breadcrumb-item.active { color: var(--v-base-content); }

/* ---------- 8. 菜单 / 列表 / 下拉 ---------- */
.menu .menu-item > a, .menu .menu-item > span {
  color: var(--v-base-content);
  border-radius: .375rem;
  transition: background-color .15s var(--v-ease);
}
.menu .menu-item > a:hover { background: var(--v-primary-soft); color: var(--v-primary); }
.menu .menu-item.active > a, .menu .menu-item > a.active {
  background: var(--v-primary); color: var(--v-primary-content);
}
.tile { border-radius: .5rem; }
.dropdown-menu, .dropdown-menu.show {
  background-color: var(--v-base-100);
  border: 1px solid var(--v-border);
  border-radius: .625rem;
  box-shadow: var(--v-shadow-card-hover);
  color: var(--v-base-content);
  overflow: hidden;
  padding: .375rem;
}
.dropdown-item, .dropdown .menu-item a { color: var(--v-base-content); border-radius: .375rem; }
.dropdown-item:hover, .dropdown-item:focus {
  background: var(--v-primary-soft);
  color: var(--v-primary);
}
.dropdown-divider { border-color: var(--v-border); }
.dropdown-item .text-muted { color: var(--v-base-content-secondary) !important; }

/* ---------- 9. 徽章 / chip / 表格 ---------- */
.badge, .chip, .label {
  border-radius: var(--v-radius-badge);
  font-weight: 600;
}
.badge-primary, .label-primary, .bg-primary { background: var(--v-primary) !important; color: var(--v-primary-content); }
.badge-success, .label-success, .bg-success { background: var(--v-success) !important; color: #fff; }
.badge-error, .label-error, .badge-danger, .label-danger, .bg-danger { background: var(--v-error) !important; color: #fff; }
.badge-warning, .label-warning, .bg-warning { background: var(--v-warning) !important; color: #1d2939; }
.bg-info { background: var(--v-info) !important; color: #fff; }
.bg-teal { background: var(--v-accent) !important; color: #fff; }
.bg-indigo { background: var(--v-secondary) !important; color: #fff; }
.bg-secondary, .bg-gray, .bg-gray-dark { background: var(--v-neutral) !important; color: var(--v-neutral-content); }
.text-primary { color: var(--v-primary) !important; }
.text-success { color: var(--v-success) !important; }
.text-danger { color: var(--v-error) !important; }
.text-warning { color: var(--v-warning) !important; }
.text-info { color: var(--v-info) !important; }
.text-muted { color: var(--v-base-content-secondary) !important; }
.chip { background: var(--v-base-300); color: var(--v-base-content); border: 1px solid var(--v-border); }
.table { color: var(--v-base-content); }
.table th, .table td { border-color: var(--v-border); }
.table thead th { color: var(--v-base-content-secondary); font-weight: 600; }
.table-striped tbody tr:nth-of-type(odd) { background: rgba(16, 24, 40, .03); }
body.dark-mode .table-striped tbody tr:nth-of-type(odd), html.dark-mode .table-striped tbody tr:nth-of-type(odd) {
  background: rgba(255, 255, 255, .035);
}
.table-hover tbody tr:hover { background: var(--v-primary-soft); color: var(--v-base-content); }

/* ---------- 10. tabs / 分页 / 面板 ---------- */
.nav-tabs { border-color: var(--v-border); }
.nav-tabs .nav-link { color: var(--v-base-content-secondary); border: none; }
.nav-tabs .nav-link:hover { color: var(--v-primary); }
.nav-tabs .nav-link.active {
  color: var(--v-primary);
  background: transparent;
  border-bottom: 2px solid var(--v-primary);
  font-weight: 600;
}
.tab .tab-item a { color: var(--v-base-content-secondary); }
.tab .tab-item.active a { color: var(--v-primary); border-color: var(--v-primary); }
.pagination .page-item .page-link, .page-item .page-link {
  background-color: var(--v-base-100);
  border-color: var(--v-border-strong);
  color: var(--v-base-content);
  border-radius: .375rem !important;
  margin: 0 .15rem;
  transition: background-color .15s var(--v-ease), color .15s var(--v-ease);
}
.pagination .page-item.active .page-link, .page-item.active .page-link {
  background: var(--v-primary);
  border-color: var(--v-primary);
  color: var(--v-primary-content);
}
.pagination .page-item.disabled .page-link { background: var(--v-base-200); color: var(--v-base-content-secondary); }
.panel { border: 1px solid var(--v-border); border-radius: var(--v-radius-card); box-shadow: var(--v-shadow-card); background: var(--v-base-100); color: var(--v-base-content); }
.panel-header, .panel-footer { border-color: var(--v-border); }

/* ---------- 11. info-box（AdminLTE 统计块现代化） ---------- */
.info-box {
  background: var(--v-base-100);
  border: 1px solid var(--v-border);
  border-radius: var(--v-radius-card);
  box-shadow: var(--v-shadow-card);
  transition: box-shadow .2s var(--v-ease), transform .2s var(--v-ease);
}
.info-box:hover { box-shadow: var(--v-shadow-card-hover); transform: translateY(-2px); }
.info-box .info-box-icon {
  border-radius: .75rem !important;
  margin: .75rem !important;
  width: 3.25rem; height: 3.25rem;
  display: flex; align-items: center; justify-content: center;
  font-size: 1.35rem;
}
.info-box .info-box-icon.bg-primary { background: var(--v-primary) !important; }
.info-box .info-box-icon.bg-info { background: var(--v-info) !important; }
.info-box .info-box-icon.bg-success { background: var(--v-success) !important; }
.info-box .info-box-icon.bg-warning { background: var(--v-warning) !important; }
.info-box .info-box-icon.bg-danger { background: var(--v-error) !important; }
.info-box .info-box-content { justify-content: center; }
.info-box .info-box-text { color: var(--v-base-content-secondary); font-weight: 500; }
.info-box .info-box-number { color: var(--v-base-content); font-weight: 700; font-size: 1.35rem; }

/* ---------- 12. 弹窗 / toast / 提示 / 加载 ---------- */
.modal-overlay, .modal-backdrop { background: rgba(15, 23, 42, .55); backdrop-filter: blur(4px); }
.modal-container, .modal-content, .modal-dialog .modal-content {
  border-radius: var(--v-radius-card);
  box-shadow: 0 24px 60px rgba(0, 0, 0, .3);
  border: 1px solid var(--v-border);
  background: var(--v-base-100);
  color: var(--v-base-content);
}
.modal-header, .modal-footer { border-color: var(--v-border); }
.modal-title { color: var(--v-base-content); }
.toast { border-radius: .625rem; border: 1px solid var(--v-border); box-shadow: var(--v-shadow-card-hover); }
.toast.toast-success { background: var(--v-success); color: #fff; }
.toast.toast-error { background: var(--v-error); color: #fff; }
.toast.toast-primary { background: var(--v-primary); color: var(--v-primary-content); }
.alert { border-radius: .625rem; border: 1px solid var(--v-border); }
.alert-info { background: var(--v-info-soft); color: var(--v-info); border-color: transparent; }
.alert-success { background: var(--v-success-soft); color: var(--v-success); border-color: transparent; }
.alert-danger, .alert-error { background: var(--v-error-soft); color: var(--v-error); border-color: transparent; }
.alert-warning { background: var(--v-warning-soft); color: var(--v-warning); border-color: transparent; }
.overlay, .card .overlay, .overlay-wrapper .overlay {
  background: rgba(244, 245, 247, .7);
}
body.dark-mode .overlay, body.dark-mode .card .overlay,
html.dark-mode .overlay, html.dark-mode .card .overlay {
  background: rgba(22, 27, 33, .7);
}
/* react-toastify */
.Toastify__toast {
  background: var(--v-base-100) !important;
  color: var(--v-base-content) !important;
  border-radius: .625rem !important;
  border: 1px solid var(--v-border);
  box-shadow: var(--v-shadow-card-hover) !important;
  font-family: var(--v-font);
}
.Toastify__progress-bar { background: var(--v-primary) !important; }
.Toastify__close-button { color: var(--v-base-content-secondary) !important; }
/* sweetalert2 */
.swal2-popup, .swal2-modal {
  background: var(--v-base-100) !important;
  color: var(--v-base-content) !important;
  border-radius: 1rem !important;
}
.swal2-title { color: var(--v-base-content) !important; }
.swal2-content { color: var(--v-base-content-secondary) !important; }
.swal2-confirm.swal2-styled {
  background: var(--v-primary) !important;
  border-radius: var(--v-radius-btn) !important;
  box-shadow: none !important;
}
.swal2-cancel.swal2-styled { background: var(--v-base-300) !important; color: var(--v-base-content) !important; }
.swal2-deny.swal2-styled { background: var(--v-error) !important; }

/* ---------- 13. 登录 / 注册页 ---------- */
.login-page, .register-page {
  background:
    radial-gradient(1200px 600px at 10% -10%, var(--v-primary-soft), transparent 60%),
    radial-gradient(1000px 500px at 110% 110%, var(--v-secondary-soft), transparent 55%),
    var(--v-base-200);
  min-height: 100vh;
}
.login-page .login-logo a, .register-page .register-logo a {
  color: var(--v-base-content);
  font-weight: 800;
  letter-spacing: .02em;
  font-size: 1.75rem;
}
.login-box .card, .register-box .card {
  border-radius: 1rem;
  border: 1px solid var(--v-border);
  box-shadow: 0 10px 40px rgba(16, 24, 40, .14);
  backdrop-filter: blur(6px);
}
.login-card-body, .register-card-body { color: var(--v-base-content); }
.login-card-body .input-group .form-control,
.register-card-body .input-group .form-control { background: var(--v-base-100); }
.login-card-body .input-group-text, .register-card-body .input-group-text {
  background: var(--v-base-200);
  border-color: var(--v-border-strong);
  color: var(--v-base-content-secondary);
}
.login-box-msg, .register-box-msg { color: var(--v-base-content-secondary); }

/* ---------- 14. 首页（hp-wrapper / splash） ---------- */
.hp-wrapper .splash {
  background: rgba(255, 255, 255, .78);
  backdrop-filter: blur(12px);
  border: 1px solid rgba(255, 255, 255, .5);
  border-radius: 1.25rem;
  padding: 2.5rem 3rem;
  box-shadow: 0 20px 60px rgba(16, 24, 40, .18);
}
body.dark-mode .hp-wrapper .splash, html.dark-mode .hp-wrapper .splash {
  background: rgba(23, 28, 35, .72);
  border-color: rgba(255, 255, 255, .08);
  box-shadow: 0 20px 60px rgba(0, 0, 0, .55);
}
.hp-wrapper .splash .splash-head {
  color: var(--v-base-content);
  font-weight: 800;
  letter-spacing: -.02em;
  background: linear-gradient(120deg, var(--v-primary), var(--v-secondary));
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}
body.dark-mode .hp-wrapper .splash .splash-head, html.dark-mode .hp-wrapper .splash .splash-head {
  background: linear-gradient(120deg, #a5a8ff, #ff8ade);
  -webkit-background-clip: text;
  background-clip: text;
}
.hp-wrapper .splash .splash-subhead { color: var(--v-base-content-secondary); }
.hp-wrapper .main-button {
  background: var(--v-primary);
  color: var(--v-primary-content);
  border-radius: .625rem;
  font-weight: 600;
  padding: .75rem 2rem;
  border: none;
  box-shadow: 0 8px 20px rgba(87, 13, 248, .35);
  transition: transform .15s var(--v-ease), box-shadow .15s var(--v-ease), background-color .15s var(--v-ease);
}
.hp-wrapper .main-button:hover {
  background: var(--v-primary-hover);
  transform: translateY(-2px);
  box-shadow: 0 12px 26px rgba(87, 13, 248, .45);
  color: var(--v-primary-content);
}
body.dark-mode .hp-wrapper .main-button, html.dark-mode .hp-wrapper .main-button {
  box-shadow: 0 8px 20px rgba(116, 128, 255, .35);
}
#copyright { color: var(--v-base-content-secondary); }
#copyright a { color: var(--v-base-content); }

/* ---------- 15. 皮肤库 ---------- */
.skinlib .card-img-top { background: transparent; }
.skinlib .card-footer .badge { font-size: .7rem; }
/* 上传页拖拽区 */
.dropzone, .dz-message {
  background: var(--v-base-200);
  border: 2px dashed var(--v-border-strong);
  border-radius: var(--v-radius-card);
  color: var(--v-base-content-secondary);
}
.dropzone:hover, .dz-message:hover { border-color: var(--v-primary); color: var(--v-primary); }

/* ---------- 16. 通用细节 ---------- */
.empty { color: var(--v-base-content-secondary); }
.loading::after { border-color: var(--v-primary); border-bottom-color: transparent; }
.progress-bar { background: var(--v-primary); }
.list-group-item { background: var(--v-base-100); border-color: var(--v-border); color: var(--v-base-content); }
.list-group-item:hover { background: var(--v-primary-soft); }
.callout { border-radius: .625rem; background: var(--v-base-100); border: 1px solid var(--v-border); }
img.avatar { border-radius: .5rem; }
.tooltip::after { background: var(--v-neutral); color: var(--v-neutral-content); }

/* ---------- 17. 浮动主题切换按钮 ---------- */
#verse-theme-toggle {
  position: fixed;
  right: 1.25rem;
  bottom: 1.25rem;
  z-index: 9000;
  width: 2.75rem;
  height: 2.75rem;
  border-radius: 9999px;
  border: 1px solid var(--v-border);
  background: var(--v-base-100);
  color: var(--v-base-content);
  box-shadow: var(--v-shadow-card-hover);
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.05rem;
  transition: transform .18s var(--v-ease), background-color .2s var(--v-ease), color .2s var(--v-ease);
}
#verse-theme-toggle:hover { transform: scale(1.08); color: var(--v-primary); }
#verse-theme-toggle:active { transform: scale(.95); }

/* ---------- 18. 滚动条 ---------- */
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb {
  background: var(--v-base-300);
  border-radius: 8px;
  border: 2px solid var(--v-base-200);
}
::-webkit-scrollbar-thumb:hover { background: var(--v-border-strong); }

/* ---------- 19. 响应式 ---------- */
@media (max-width: 640px) {
  .hp-wrapper .splash { padding: 1.75rem 1.5rem; margin: 0 .75rem; }
  .info-box .info-box-icon { width: 2.75rem; height: 2.75rem; }
}

/* ---------- 20. 品牌化：隐藏 BS 预置页脚行，只保留 Verse 版权与开源致谢 ---------- */
#copyright-text {
  display: none !important;
}
#copyright {
  font-size: .85rem;
}
#copyright a { color: var(--v-primary); }

/* ---------- 21. AdminLTE small-box 统计块现代化（admin 仪表盘） ---------- */
.small-box {
  background: var(--v-base-100) !important;
  border: 1px solid var(--v-border);
  border-radius: var(--v-radius-card);
  box-shadow: var(--v-shadow-card);
  color: var(--v-base-content);
  overflow: hidden;
  transition: box-shadow .2s var(--v-ease), transform .2s var(--v-ease);
}
.small-box:hover { box-shadow: var(--v-shadow-card-hover); transform: translateY(-2px); }
.small-box .inner { padding: 1.1rem 1.25rem; }
.small-box .inner h3 {
  color: var(--v-base-content);
  font-weight: 800;
  font-size: 1.9rem;
}
.small-box .inner p { color: var(--v-base-content-secondary); font-weight: 500; }
.small-box .icon {
  color: var(--v-primary);
  opacity: .14;
  font-size: 4.5rem;
  transition: opacity .2s var(--v-ease);
}
.small-box:hover .icon { opacity: .28; }
.small-box.bg-info .icon, .small-box.bg-aqua .icon { color: var(--v-info); }
.small-box.bg-success .icon { color: var(--v-success); }
.small-box.bg-warning .icon { color: var(--v-warning); }
.small-box.bg-danger .icon { color: var(--v-error); }
.small-box.bg-primary .icon { color: var(--v-primary); }
.small-box.bg-teal .icon { color: var(--v-accent); }
.small-box-footer {
  background: rgba(16, 24, 40, .04) !important;
  color: var(--v-base-content-secondary) !important;
  border-top: 1px solid var(--v-border);
  transition: background-color .15s var(--v-ease), color .15s var(--v-ease);
}
.small-box-footer:hover {
  background: var(--v-primary-soft) !important;
  color: var(--v-primary) !important;
}
body.dark-mode .small-box-footer, html.dark-mode .small-box-footer {
  background: rgba(255, 255, 255, .04) !important;
}

/* ---------- 22. callout / admin widget 细节 ---------- */
.callout {
  border-left: 4px solid var(--v-primary);
}
.callout.callout-danger { border-left-color: var(--v-error); }
.callout.callout-success { border-left-color: var(--v-success); }
.callout.callout-info { border-left-color: var(--v-info); }
.callout.callout-warning { border-left-color: var(--v-warning); }
.chart { border-radius: .5rem; }
/* admin 表格包裹层 */
.card-body.table-responsive, .table-responsive { color: var(--v-base-content); }
/* 后台 radio/checkbox 行 */
.radio label, .checkbox label { color: var(--v-base-content); }

/* ---------- 23. 仪表盘统计卡（v-stat，daisyUI stats 风格） ---------- */
.v-stat-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
}
@media (max-width: 768px) {
  .v-stat-grid { grid-template-columns: 1fr; }
}
.v-stat {
  display: flex;
  align-items: center;
  gap: 1rem;
  padding: 1.1rem 1.25rem;
  background: var(--v-base-100);
  border: 1px solid var(--v-border);
  border-radius: var(--v-radius-card);
  box-shadow: var(--v-shadow-card);
  color: var(--v-base-content);
  text-decoration: none;
  transition: box-shadow .2s var(--v-ease), transform .2s var(--v-ease),
    border-color .2s var(--v-ease);
}
a.v-stat:hover {
  text-decoration: none;
  transform: translateY(-2px);
  box-shadow: var(--v-shadow-card-hover);
  border-color: var(--v-primary);
  color: var(--v-base-content);
}
.v-stat-icon {
  flex: none;
  width: 3rem;
  height: 3rem;
  border-radius: .75rem;
  background: var(--v-scs, var(--v-primary-soft));
  color: var(--v-sc, var(--v-primary));
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.25rem;
}
.v-stat-body { flex: 1; min-width: 0; }
.v-stat-label {
  color: var(--v-base-content-secondary);
  font-size: .8rem;
  font-weight: 500;
  margin-bottom: .15rem;
}
.v-stat-value {
  color: var(--v-base-content);
  font-size: 1.55rem;
  font-weight: 800;
  line-height: 1.1;
  letter-spacing: -.01em;
}
.v-stat-value small {
  font-size: .85rem;
  font-weight: 600;
  color: var(--v-base-content-secondary);
  margin-left: .15rem;
}
.v-stat-arrow {
  color: var(--v-base-content-secondary);
  opacity: 0;
  transform: translateX(-4px);
  transition: opacity .18s var(--v-ease), transform .18s var(--v-ease);
}
a.v-stat:hover .v-stat-arrow {
  opacity: 1;
  transform: translateX(0);
  color: var(--v-primary);
}
