/* =========================================================
    像素字体声明（Fusion Pixel Font · 开源泛中日韩像素字体）
    支持中英文，像素黑体风格，与 MC 主题完美搭配
    Source: https://github.com/TakWolf/fusion-pixel-font
    License: SIL Open Font License 1.1
    ========================================================= */
@font-face {
  font-family: "Fusion Pixel";
  font-style: normal;
  font-weight: 400;
  src: url("/fonts/fusion-pixel-12px-proportional-zh_hans.ttf.woff2") format("woff2");
}

/* =========================================================
    自定义前台/后台美化主题  custom-theme.css  (v3 · 深墨绿)
   适用：Blessing Skin Server (AdminLTE3 / Bootstrap4)
   风格：对齐官网首页 home.twig —— 深墨绿底 · 绿色渐变 · 玻璃拟态
        浅绿文字 · 圆角卡片 · 微动效；全站消除白色底
   说明：纯 CSS 叠加皮肤，不改框架结构与 JS，可随时替换回滚
   ========================================================= */

:root {
  /* —— 与首页一致的品牌绿 —— */
  --mc-green:        #43a047;
  --mc-green-dark:   #2e7d32;
  --mc-green-deep:   #1b5e20;
  --mc-green-light:  #66bb6a;
  --mc-accent:       #a5d6a7;
  --brand-grad:      linear-gradient(135deg, #66bb6a 0%, #43a047 50%, #2e7d32 100%);
  --brand-grad-h:    linear-gradient(90deg, #66bb6a 0%, #43a047 100%);

  /* —— 深色系面板/文字（对齐首页深色覆盖段） —— */
  --ink:             #eaf5ec;
  --ink-soft:        #b7d4b9;
  --ink-mute:        #9fbfa2;
  --surface:         rgba(30, 44, 34, .78);
  --surface-2:       rgba(18, 28, 21, .90);
  --ring:            rgba(120, 200, 120, .20);

  --card-radius:     18px;
  --btn-radius:      12px;
  --soft-shadow:       0 14px 44px rgba(0, 0, 0, .38);
  --soft-shadow-hover: 0 26px 70px rgba(0, 0, 0, .55);
}

/* ---------- 全局字体与深色背景 ---------- */
body,
button, input, optgroup, select, textarea,
.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6,
p, label, .form-control, .tooltip, .popover,
.login-logo a, .brand-link, .navbar-brand {
  font-family: "Fusion Pixel", "PingFang SC", "Microsoft YaHei", system-ui, -apple-system, "Segoe UI", sans-serif;
  -webkit-font-smoothing: antialiased;
}
body {
  background: #0d140f !important;
  color: var(--ink) !important;
}
.wrapper,
.content-wrapper {
  background:
    radial-gradient(1200px 600px at 15% -10%, rgba(76, 175, 80, .28), transparent 60%),
    radial-gradient(1000px 700px at 90% 10%, rgba(38, 166, 154, .18), transparent 55%),
    linear-gradient(180deg, #0d140f 0%, #101a12 40%, #0b120d 100%) !important;
  color: var(--ink);
}
::selection { background: rgba(102, 187, 106, .35); color: #fff; }

/* ---------- 顶部导航栏 ---------- */
.main-header.navbar {
  background: linear-gradient(180deg, rgba(35,48,38,.96) 0%, rgba(22,32,26,.98) 60%, rgba(14,22,18,1) 100%) !important;
  border-bottom: 1px solid rgba(100, 200, 100, .15);
  box-shadow: 0 12px 60px rgba(0, 0, 0, .45);
  backdrop-filter: saturate(1.2) blur(6px);
}
.main-header .nav-link,
.main-header .navbar-nav .nav-link,
.navbar-light .navbar-nav .nav-link {
  color: #dcedc8 !important;
  transition: opacity .2s ease, transform .2s ease;
}
.main-header .nav-link:hover { color: #fff !important; opacity: .9; transform: translateY(-1px); }
.navbar-light .navbar-nav .nav-link:hover { color: #fff !important; }

/* ---------- 侧边栏 ---------- */
.main-sidebar {
  background: linear-gradient(180deg, #16221a 0%, #0d140f 100%) !important;
  box-shadow: 2px 0 16px rgba(0, 0, 0, .35);
}
.main-sidebar .brand-link {
  background: rgba(0, 0, 0, .22);
  border-bottom: 1px solid rgba(255, 255, 255, .06);
  color: var(--mc-accent) !important;
  font-weight: 800;
  letter-spacing: .5px;
}
.sidebar .nav-sidebar .nav-link {
  color: #cfe6d0;
  border-radius: 12px;
  margin: 4px 10px;
  transition: background .2s ease, transform .15s ease, box-shadow .2s ease;
}
.sidebar .nav-sidebar .nav-link p,
.sidebar .nav-sidebar .nav-link i { color: #cfe6d0; }
.sidebar .nav-sidebar .nav-link:hover {
  background: rgba(102, 187, 106, .16);
  transform: translateX(3px);
  color: #fff;
}
.sidebar .nav-sidebar .nav-link.active {
  background: var(--brand-grad-h) !important;
  color: #fff !important;
  box-shadow: 0 6px 16px rgba(67, 160, 71, .45);
}
.nav-sidebar .nav-treeview .nav-link.active {
  background: rgba(102, 187, 106, .28) !important;
  color: #fff !important;
}

/* ---------- 卡片 / 面板（消除白底，改深色玻璃） ---------- */
.card {
  border: 1px solid var(--ring);
  border-radius: var(--card-radius);
  background: linear-gradient(160deg, rgba(30, 44, 34, .90), rgba(18, 28, 21, .90)) !important;
  color: var(--ink);
  box-shadow: var(--soft-shadow);
  transition: box-shadow .25s ease, transform .2s ease;
  overflow: hidden;
}
.card:hover { box-shadow: var(--soft-shadow-hover); transform: translateY(-2px); }
.card-body { background: transparent !important; color: var(--ink); }
.card-footer {
  background: rgba(0, 0, 0, .18) !important;
  border-top: 1px solid rgba(255, 255, 255, .06);
  color: var(--ink-soft);
}
.card-header {
  border-bottom: 1px solid rgba(255, 255, 255, .06);
  background: transparent;
  color: var(--ink);
  font-weight: 700;
}
/* 带主色头部的卡片保持品牌绿渐变头 */
.card.card-primary > .card-header,
.card-primary:not(.card-outline) > .card-header,
.card.card-success > .card-header,
.card.card-info > .card-header {
  background: var(--brand-grad-h) !important;
  color: #fff;
  border-bottom: none;
}
.card.card-primary, .card.card-success, .card.card-info,
.card.card-primary.card-outline { border-top: none; }

/* ---------- 通用文本颜色，防止深底黑字 ---------- */
h1, h2, h3, h4, h5, h6,
.content-header h1, p, label,
.text-dark, .text-muted, .description-block {
  color: var(--ink) !important;
}
.text-muted, small.text-muted { color: var(--ink-mute) !important; }

/* ---------- 按钮 ---------- */
.btn {
  border-radius: var(--btn-radius);
  font-weight: 600;
  transition: transform .12s ease, box-shadow .2s ease, filter .2s ease;
}
.btn:active { transform: translateY(1px); }
.btn-primary {
  background: var(--brand-grad-h);
  border: none;
  color: #fff;
  box-shadow: 0 6px 16px rgba(67, 160, 71, .35);
}
.btn-primary:hover, .btn-primary:focus {
  filter: brightness(1.06);
  box-shadow: 0 8px 22px rgba(67, 160, 71, .48);
}
.btn-success { background: var(--mc-green-dark); border: none; color: #fff; }
.btn-default, .btn-secondary {
  background: rgba(255, 255, 255, .06);
  border: 1px solid var(--ring);
  color: var(--ink);
}
.btn-default:hover, .btn-secondary:hover {
  background: rgba(255, 255, 255, .12);
  color: #fff;
}
.btn-outline-primary { color: var(--mc-accent); border-color: var(--mc-green); }
.btn-outline-primary:hover { background: var(--brand-grad-h); border-color: transparent; color: #fff; }

/* ---------- 表单控件 ---------- */
.form-control, .custom-select, textarea.form-control {
  background: rgba(13, 20, 15, .55) !important;
  border-radius: var(--btn-radius);
  border: 1px solid rgba(120, 200, 120, .25);
  color: var(--ink) !important;
  transition: border-color .2s ease, box-shadow .2s ease;
}
.form-control::placeholder { color: var(--ink-mute); }
.form-control:focus, .custom-select:focus {
  background: rgba(13, 20, 15, .70) !important;
  border-color: var(--mc-green-light);
  box-shadow: 0 0 0 .2rem rgba(102, 187, 106, .25);
  color: var(--ink) !important;
}
.input-group-text {
  background: rgba(255, 255, 255, .05);
  border: 1px solid rgba(120, 200, 120, .25);
  color: var(--ink-soft);
}

/* ---------- 数据小组件（info-box / small-box 保留彩色，圆角阴影统一） ---------- */
.info-box, .small-box {
  border-radius: var(--card-radius);
  box-shadow: var(--soft-shadow);
  overflow: hidden;
}
.info-box { background: linear-gradient(160deg, rgba(30, 44, 34, .90), rgba(18, 28, 21, .90)) !important; color: var(--ink); }
.small-box:hover { box-shadow: var(--soft-shadow-hover); transform: translateY(-2px); }
.small-box .icon > i { transition: transform .3s ease; }
.small-box:hover .icon > i { transform: scale(1.08) rotate(-4deg); }

/* ---------- 登录 / 注册卡片（玻璃拟态·深色） ---------- */
.login-page, .register-page {
  background:
    radial-gradient(900px 500px at 20% 10%, rgba(76, 175, 80, .22), transparent 60%),
    linear-gradient(160deg, #0d140f 0%, #101a12 100%) !important;
}
.login-page .card, .register-page .card {
  border-radius: 20px;
  background: var(--surface) !important;
  border: 1px solid var(--ring);
  backdrop-filter: blur(14px) saturate(1.15);
  box-shadow: 0 18px 50px rgba(0, 0, 0, .5);
}
.login-box-msg, .register-box-msg { color: var(--ink-soft); }
.login-logo, .register-logo, .login-logo a, .register-logo a { font-weight: 800; color: var(--mc-accent) !important; }

/* ---------- 链接主色 ---------- */
a { color: var(--mc-accent); }
a:hover { color: var(--mc-green-light); }

/* ---------- 表格 ---------- */
.table { color: var(--ink); }
.table thead th {
  border-top: none;
  background: rgba(67, 160, 71, .16);
  color: var(--ink);
  font-weight: 700;
}
.table td, .table th { border-color: rgba(255, 255, 255, .08); }
.table-hover tbody tr:hover { background: rgba(102, 187, 106, .10); }

/* ---------- 徽章 / 标签 ---------- */
.badge-primary { background: var(--mc-green); }
.badge-success { background: var(--mc-green-dark); }

/* ---------- 皮肤库卡片（前台） ---------- */
.player, .texture-preview, .card.arrow-shadow {
  border-radius: var(--card-radius);
  transition: transform .2s ease, box-shadow .25s ease;
}
.player:hover, .card.arrow-shadow:hover {
  transform: translateY(-4px);
  box-shadow: var(--soft-shadow-hover);
}

/* ---------- 页脚 / 版权条（消除白底） ---------- */
.main-footer {
  background: linear-gradient(180deg, #16221a 0%, #0d140f 100%) !important;
  border-top: 1px solid rgba(120, 200, 120, .15);
  color: var(--ink-soft) !important;
}
.main-footer a, .main-footer strong { color: var(--mc-accent) !important; }

/* ---------- 弹窗 / 下拉 ---------- */
.modal-content, .dropdown-menu, .swal2-popup {
  background: linear-gradient(160deg, rgba(30, 44, 34, .98), rgba(16, 26, 19, .99)) !important;
  color: var(--ink) !important;
  border: 1px solid var(--ring);
}
.modal-header, .modal-footer { border-color: rgba(255, 255, 255, .08); }
.dropdown-item { color: var(--ink-soft); }
.dropdown-item:hover { background: rgba(102, 187, 106, .16); color: #fff; }
.swal2-title, .swal2-html-container { color: var(--ink) !important; }

/* ---------- 滚动条 ---------- */
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, var(--mc-green-light), var(--mc-green-dark));
  border-radius: 10px;
}
::-webkit-scrollbar-track { background: rgba(0, 0, 0, .18); }

/* ---------- 表格行（角色列表等：消除白底、文字反白） ---------- */
.table tbody tr,
.table tbody td,
.table tbody th {
  background: transparent !important;
  color: var(--ink) !important;
  border-color: rgba(255, 255, 255, .08) !important;
}
.table-striped tbody tr:nth-of-type(odd),
.table-striped tbody tr:nth-of-type(odd) > td {
  background: rgba(255, 255, 255, .04) !important;
}
.table-hover tbody tr:hover,
.table-hover tbody tr:hover > td {
  background: rgba(102, 187, 106, .12) !important;
  color: #fff !important;
}
/* 角色名等单元格链接/文本 */
.table td a, .table td span { color: var(--ink) !important; }

/* ---------- 材质预览 / 皮肤渲染区（消除白底） ---------- */
#previewer .card-body,
.card #previewer,
#previewer canvas,
canvas.skinview3d-canvas,
.skin-preview,
.texture-preview,
#preview {
  background: transparent !important;
}
/* 预览容器整体深色，避免 canvas 周围留白 */
#previewer > div,
.preview-container {
  background: linear-gradient(160deg, rgba(20, 30, 23, .85), rgba(12, 20, 15, .9)) !important;
  border-radius: 12px;
}

/* ---------- 兜底：内容区内联白底元素 ---------- */
.content-wrapper [style*="background:#fff"],
.content-wrapper [style*="background: #fff"],
.content-wrapper [style*="background-color:#fff"],
.content-wrapper [style*="background-color: #fff"],
.content-wrapper [style*="background:white"],
.content-wrapper [style*="background-color:white"] {
  background: linear-gradient(160deg, rgba(30, 44, 34, .90), rgba(18, 28, 21, .90)) !important;
  color: var(--ink) !important;
}
/* 白底 bg 工具类 */
.content-wrapper .bg-white,
.content-wrapper .bg-light {
  background: linear-gradient(160deg, rgba(30, 44, 34, .90), rgba(18, 28, 21, .90)) !important;
  color: var(--ink) !important;
}

/* =========================================================
   追加：消除剩余白底（我的衣柜 tabs / 表格边线 / alert 提示）
   v4 · 20260803
   ========================================================= */

/* ---------- 标签页（我的衣柜 皮肤/披风/上传 页签） ---------- */
.card-tabs > .card-header,
.card.card-tabs .card-header {
  background: rgba(0, 0, 0, .18) !important;
  border-bottom: 1px solid rgba(255, 255, 255, .06) !important;
}
.nav-tabs {
  border-bottom-color: rgba(255, 255, 255, .08) !important;
}
.nav-tabs .nav-link {
  background: rgba(255, 255, 255, .04) !important;
  border: 1px solid rgba(255, 255, 255, .08) !important;
  border-radius: var(--btn-radius) var(--btn-radius) 0 0;
  color: var(--ink-soft) !important;
  margin-right: 4px;
  transition: background .2s ease, color .2s ease;
}
.nav-tabs .nav-link:hover {
  background: rgba(102, 187, 106, .16) !important;
  color: #fff !important;
}
.nav-tabs .nav-link.active,
.nav-tabs .nav-link.active:hover {
  background: var(--brand-grad-h) !important;
  border-color: transparent !important;
  color: #fff !important;
  box-shadow: 0 4px 12px rgba(67, 160, 71, .35);
}

/* ---------- 表格边线（披风站等所有表格，消除白边） ---------- */
.table-bordered,
.table-bordered td,
.table-bordered th {
  border-color: rgba(255, 255, 255, .08) !important;
}
.table-bordered thead th,
.table thead th {
  border-bottom-color: rgba(255, 255, 255, .12) !important;
}
.table .table-bordered { border: 1px solid rgba(255, 255, 255, .08) !important; }

/* ---------- Alert / 提示框（上传披风积分奖励提示等） ---------- */
.alert {
  background: linear-gradient(160deg, rgba(30, 44, 34, .92), rgba(18, 28, 21, .92)) !important;
  color: var(--ink) !important;
  border: 1px solid var(--ring) !important;
  border-radius: var(--card-radius);
  box-shadow: var(--soft-shadow);
}
.alert .icon { color: var(--mc-accent); }
.alert-info   { border-left: 4px solid var(--cyan); }
.alert-success{ border-left: 4px solid var(--mc-green-light); }
.alert-warning{ border-left: 4px solid #ffd54f; }
.alert-danger { border-left: 4px solid #e57373; }
.alert .close { color: var(--ink-soft); text-shadow: none; opacity: .7; }
.alert .close:hover { color: #fff; opacity: 1; }

/* ---------- Callout 提示（后台/上传页通用） ---------- */
.callout {
  background: linear-gradient(160deg, rgba(30, 44, 34, .92), rgba(18, 28, 21, .92)) !important;
  color: var(--ink) !important;
  border-left-width: 4px;
  border-radius: var(--card-radius);
  box-shadow: var(--soft-shadow);
}
.callout-info    { border-left-color: var(--cyan) !important; }
.callout-success { border-left-color: var(--mc-green-light) !important; }
.callout-warning { border-left-color: #ffd54f !important; }
.callout-danger  { border-left-color: #e57373 !important; }
.callout h5, .callout h4, .callout p { color: var(--ink) !important; }

/* =========================================================
   追加：分页组件深色统一（个人中心表格底/上下页/页码）
   v5 · 20260804
   ========================================================= */

/* 分页容器 */
.pagination {
  margin: 0;
}

/* 分页按钮通用 */
.page-item .page-link {
  background: rgba(255, 255, 255, .06) !important;
  border: 1px solid rgba(255, 255, 255, .10) !important;
  color: var(--ink-soft) !important;
  border-radius: var(--btn-radius) !important;
  margin: 0 3px;
  transition: all .2s ease;
}

/* 悬停 */
.page-item .page-link:hover {
  background: rgba(102, 187, 106, .18) !important;
  color: #fff !important;
  border-color: rgba(102, 187, 106, .45) !important;
}

/* 当前激活页（原蓝色底 → 品牌绿渐变） */
.page-item.active .page-link {
  background: var(--brand-grad-h) !important;
  border-color: transparent !important;
  color: #fff !important;
  box-shadow: 0 4px 12px rgba(67, 160, 71, .4);
  font-weight: 700;
}

/* 禁用状态 */
.page-item.disabled .page-link {
  background: rgba(255, 255, 255, .02) !important;
  border-color: rgba(255, 255, 255, .05) !important;
  color: rgba(255, 255, 255, .25) !important;
}

/* 上一页/下一页文字按钮 */
.page-link[rel="prev"],
.page-link[rel="next"] {
  padding-left: 14px;
  padding-right: 14px;
}

/* ---------- 修复管理后台弹窗闪烁 ---------- */
.modal.fade .modal-dialog {
  transition: none !important;
  transform: none !important;
}
.modal.fade {
  transition: none !important;
}
.modal-backdrop {
  z-index: 1040 !important;
}
.modal {
  z-index: 1050 !important;
}