/* ============================================================
   柚麓云主题 · 会员中心皮肤层
   纯视觉覆盖，不改动官方 DOM 结构与任何交互逻辑
   ============================================================ */

:root {
  --ylc-brand: #0b46c8;
  --ylc-brand-hover: #0a3aab;
  --ylc-brand-soft: #eef3ff;
  --ylc-ink: #0c1a2b;
  --ylc-text-2: #50607a;
  --ylc-text-3: #8492a6;
  --ylc-line: #e3e8f0;
  --ylc-line-soft: #eef1f6;
  --ylc-bg: #f6f8fb;
  --ylc-radius: 4px;
}

body {
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC",
    "Hiragino Sans GB", "Microsoft YaHei", Arial, sans-serif;
  color: var(--ylc-ink);
  background: var(--ylc-bg);
  -webkit-font-smoothing: antialiased;
}

a { color: var(--ylc-brand); }
a:hover { color: var(--ylc-brand-hover); text-decoration: none; }

/* ---------------- 顶栏 ---------------- */
#page-topbar {
  background: #fff;
  border-bottom: 1px solid var(--ylc-line);
  box-shadow: none;
}
.navbar-header { background: transparent; }
.navbar-brand-box {
  background: #fff;
  border-right: 1px solid var(--ylc-line);
}
.logo-lg img { height: 24px !important; width: auto; }
.logo-sm img { height: 28px !important; width: auto; }
.header-item { color: var(--ylc-text-2); box-shadow: none; }
.header-item:hover { color: var(--ylc-brand); background: var(--ylc-brand-soft); }
#vertical-menu-btn { color: var(--ylc-text-2); }
.user-center_header {
  background: var(--ylc-brand-soft);
  color: var(--ylc-brand);
  border-radius: 50%;
  font-weight: 600;
}

/* ---------------- 侧边菜单 ---------------- */
body[data-sidebar="dark"] .vertical-menu,
.vertical-menu {
  background: #fff;
  border-right: 1px solid var(--ylc-line);
  box-shadow: none;
}
body[data-sidebar="dark"] #sidebar-menu ul li a,
#sidebar-menu ul li a {
  color: var(--ylc-text-2);
  font-size: 14px;
  border-radius: var(--ylc-radius);
  margin: 2px 10px;
  padding: 9px 12px;
  transition: background .15s ease, color .15s ease;
}
body[data-sidebar="dark"] #sidebar-menu ul li a i,
#sidebar-menu ul li a i {
  color: var(--ylc-text-3);
  font-size: 16px;
}
body[data-sidebar="dark"] #sidebar-menu ul li a:hover,
#sidebar-menu ul li a:hover {
  color: var(--ylc-brand);
  background: var(--ylc-brand-soft);
}
body[data-sidebar="dark"] #sidebar-menu ul li a:hover i,
#sidebar-menu ul li a:hover i { color: var(--ylc-brand); }

body[data-sidebar="dark"] #sidebar-menu ul li.mm-active > a,
#sidebar-menu ul li.mm-active > a,
#sidebar-menu ul li a.active {
  color: var(--ylc-brand);
  background: var(--ylc-brand-soft);
  font-weight: 600;
}
body[data-sidebar="dark"] #sidebar-menu ul li.mm-active > a i,
#sidebar-menu ul li.mm-active > a i { color: var(--ylc-brand); }

#sidebar-menu ul li ul.sub-menu li a {
  position: relative;
  padding-left: 34px;
  font-size: 13px;
  margin: 2px 10px 2px 18px;
}
#sidebar-menu ul li ul.sub-menu li a::before {
  content: "";
  position: absolute;
  left: 14px;
  top: 50%;
  width: 4px;
  height: 4px;
  margin-top: -2px;
  border-radius: 50%;
  background: currentColor;
  opacity: .35;
}
#sidebar-menu ul.metismenu > li + li { margin-top: 2px; }

/* ---------------- 主体 ---------------- */
.main-content { background: var(--ylc-bg); }
.page-content { padding: 20px 0 32px; }
.container-fluid { padding: 0 24px; }

.page-title-box { padding-bottom: 8px; }
.page-title-box h4 {
  font-size: 18px;
  font-weight: 600;
  color: var(--ylc-ink);
  letter-spacing: 0;
}
.page-title-box .page-title-right { margin-top: 0; }
.breadcrumb { background: transparent; margin: 0; }
.breadcrumb-item a { color: var(--ylc-text-3); }
.breadcrumb-item.active { color: var(--ylc-text-2); }

/* ---------------- 卡片 ---------------- */
.card {
  background: #fff;
  border: 1px solid var(--ylc-line);
  border-radius: var(--ylc-radius);
  box-shadow: none;
}
.card-body { padding: 20px; }
.card-header, .card-footer {
  background: #fff;
  border-color: var(--ylc-line-soft);
  padding: 14px 20px;
}
.card-title { font-size: 15px; font-weight: 600; color: var(--ylc-ink); }
.card-header:first-child { border-radius: var(--ylc-radius) var(--ylc-radius) 0 0; }

/* ---------------- 按钮 ---------------- */
.btn {
  border-radius: var(--ylc-radius);
  font-size: 14px;
  padding: 6px 16px;
  box-shadow: none !important;
  transition: background .15s ease, border-color .15s ease, color .15s ease;
}
.btn-primary, .btn-info {
  background: var(--ylc-brand);
  border-color: var(--ylc-brand);
  color: #fff;
}
.btn-primary:hover, .btn-primary:focus, .btn-primary:active,
.btn-info:hover, .btn-info:focus, .btn-info:active {
  background: var(--ylc-brand-hover);
  border-color: var(--ylc-brand-hover);
  color: #fff;
}
.btn-outline-primary { color: var(--ylc-brand); border-color: var(--ylc-brand); }
.btn-outline-primary:hover, .btn-outline-primary:focus {
  background: var(--ylc-brand);
  border-color: var(--ylc-brand);
  color: #fff;
}
.btn-light, .btn-secondary {
  background: #fff;
  border: 1px solid var(--ylc-line);
  color: var(--ylc-text-2);
}
.btn-light:hover, .btn-secondary:hover {
  background: var(--ylc-brand-soft);
  border-color: var(--ylc-brand);
  color: var(--ylc-brand);
}
.btn-link { color: var(--ylc-brand); }
.btn-lg { padding: 9px 22px; font-size: 15px; }
.btn-sm { padding: 4px 12px; font-size: 13px; }

/* ---------------- 表单 ---------------- */
.form-control, .custom-select {
  border: 1px solid var(--ylc-line);
  border-radius: var(--ylc-radius);
  height: 36px;
  font-size: 14px;
  color: var(--ylc-ink);
  box-shadow: none;
}
.form-control:focus, .custom-select:focus {
  border-color: var(--ylc-brand);
  box-shadow: 0 0 0 3px rgba(11, 70, 200, .1);
}
.form-control::placeholder { color: var(--ylc-text-3); }
textarea.form-control { height: auto; padding: 10px 12px; }
label { color: var(--ylc-text-2); font-size: 13px; font-weight: 500; }
.custom-control-label::before { border-color: var(--ylc-line); }
.custom-control-input:checked ~ .custom-control-label::before {
  background-color: var(--ylc-brand);
  border-color: var(--ylc-brand);
}

/* ---------------- 表格 ---------------- */
.table { border-collapse: separate; border-spacing: 0; margin-bottom: 0; }
.table thead th {
  background: #f7f8fa;
  color: var(--ylc-text-2);
  font-size: 13px;
  font-weight: 500;
  border-bottom: 1px solid var(--ylc-line);
  border-top: 0;
  padding: 12px 16px;
  white-space: nowrap;
}
.table tbody td {
  border-top: 1px solid var(--ylc-line-soft);
  padding: 14px 16px;
  font-size: 14px;
  color: var(--ylc-ink);
  vertical-align: middle;
}
.table-hover tbody tr:hover { background: #fafbfd; }
.table-bordered { border-color: var(--ylc-line); }
.table-bordered td, .table-bordered th { border-color: var(--ylc-line-soft); }

/* ---------------- 标签页 ---------------- */
.nav-tabs { border-bottom: 1px solid var(--ylc-line); }
.nav-tabs .nav-link {
  border: 0;
  border-bottom: 2px solid transparent;
  border-radius: 0;
  color: var(--ylc-text-2);
  font-size: 14px;
  padding: 10px 16px;
  background: transparent;
}
.nav-tabs .nav-link.active {
  color: var(--ylc-brand);
  border-bottom-color: var(--ylc-brand);
  background: transparent;
  font-weight: 600;
}
.nav-pills .nav-link { border-radius: var(--ylc-radius); color: var(--ylc-text-2); }
.nav-pills .nav-link.active { background: var(--ylc-brand); color: #fff; }

/* ---------------- 徽标 / 状态 ---------------- */
.badge { border-radius: 2px; font-weight: 400; font-size: 12px; padding: 2px 8px; }
.badge-success, .badge-soft-success { background: #e8f5ed; color: #1a7f43; }
.badge-danger, .badge-soft-danger { background: #fdecec; color: #c0392b; }
.badge-warning, .badge-soft-warning { background: #fff4e5; color: #a86400; }
.badge-info, .badge-soft-info { background: var(--ylc-brand-soft); color: var(--ylc-brand); }
.badge-secondary, .badge-soft-secondary { background: #f1f3f7; color: var(--ylc-text-2); }

/* ---------------- 下拉 ---------------- */
.dropdown-menu {
  border: 1px solid var(--ylc-line);
  border-radius: var(--ylc-radius);
  box-shadow: 0 6px 16px rgba(12, 26, 43, .08);
  padding: 6px;
  font-size: 14px;
}
.dropdown-item { border-radius: 2px; padding: 8px 12px; color: var(--ylc-text-2); }
.dropdown-item:hover, .dropdown-item:focus {
  background: var(--ylc-brand-soft);
  color: var(--ylc-brand);
}

/* ---------------- 弹窗 ---------------- */
.modal-content {
  border: 0;
  border-radius: var(--ylc-radius);
  box-shadow: 0 12px 32px rgba(12, 26, 43, .16);
}
.modal-header, .modal-footer { border-color: var(--ylc-line-soft); }
.modal-title { font-size: 16px; font-weight: 600; }

/* ---------------- 分页 ---------------- */
.page-link {
  color: var(--ylc-text-2);
  border-color: var(--ylc-line);
  border-radius: 2px !important;
  margin: 0 2px;
}
.page-item.active .page-link {
  background: var(--ylc-brand);
  border-color: var(--ylc-brand);
}
.page-link:hover { color: var(--ylc-brand); background: var(--ylc-brand-soft); }

/* ---------------- 页脚 ---------------- */
.footer {
  background: #fff;
  border-top: 1px solid var(--ylc-line);
  color: var(--ylc-text-3);
  font-size: 13px;
  padding: 16px 24px;
  text-align: left;
}

/* ---------------- 提示条 ---------------- */
.alert { border-radius: var(--ylc-radius); border: 1px solid var(--ylc-line); font-size: 14px; }
.alert-success { background: #e8f5ed; border-color: #cfe9da; color: #1a7f43; }
.alert-danger { background: #fdecec; border-color: #f7d4d4; color: #c0392b; }
.alert-warning { background: #fff4e5; border-color: #f6e2c4; color: #a86400; }
.alert-info { background: var(--ylc-brand-soft); border-color: #d8e2fb; color: var(--ylc-brand); }

/* ---------------- 滚动条 ---------------- */
::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-thumb { background: #d6dce6; border-radius: 4px; }
::-webkit-scrollbar-thumb:hover { background: #c2cad8; }
::-webkit-scrollbar-track { background: transparent; }

/* ---------------- 响应式 ---------------- */
@media (max-width: 767px) {
  .container-fluid { padding: 0 12px; }
  .page-content { padding: 12px 0 24px; }
  .card-body { padding: 16px; }
}
