/* ==========================================================
   用户端内页 · 暗色主题覆盖层
   作用于：用户中心(usercenter/*)、会员中心、登录/注册
   引入顺序必须在本页内联 <style> 之后（覆盖式，不改原文件结构）
   ========================================================== */

:root {
    --dk-bg: #07080d;
    --dk-card: rgba(255, 255, 255, 0.045);
    --dk-line: rgba(255, 255, 255, 0.09);
    --dk-text: #e6ebf7;
    --dk-muted: #93a0bd;
    --dk-muted2: #6b7899;
    --dk-brand1: #4f7cff;
    --dk-brand2: #a855f7;
    --dk-accent: #22d3ee;
}

body {
    background: var(--dk-bg);
    color: var(--dk-text);
}

/* ---------- 用户中心顶部条 ---------- */
.nav {
    background: rgba(11, 14, 23, .92) !important;
    border-bottom: 1px solid var(--dk-line) !important;
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
}

.nav .logo {
    background: linear-gradient(120deg, var(--dk-brand1), var(--dk-brand2));
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
}

.nav a {
    color: var(--dk-muted) !important;
}

.nav a:hover,
.nav a.active {
    color: #fff !important;
}

.nav a.logout {
    color: var(--dk-muted2) !important;
}

/* ---------- 卡片 / 表格 / 表单 ---------- */
.panel {
    background: var(--dk-card) !important;
    border: 1px solid var(--dk-line) !important;
    box-shadow: none !important;
    color: var(--dk-text);
}

.panel h3 {
    color: #fff;
}

label {
    color: var(--dk-muted) !important;
}

input,
select,
textarea {
    background: rgba(255, 255, 255, .05) !important;
    border: 1px solid rgba(255, 255, 255, .12) !important;
    color: var(--dk-text) !important;
}

input:focus,
select:focus,
textarea:focus {
    border-color: var(--dk-brand1) !important;
    outline: none;
    box-shadow: 0 0 0 3px rgba(79, 124, 255, .18);
}

input::placeholder,
textarea::placeholder {
    color: var(--dk-muted2);
}

table th {
    color: var(--dk-muted2) !important;
    border-bottom-color: rgba(255, 255, 255, .08) !important;
}

table td {
    color: #c9d3ea;
    border-bottom-color: rgba(255, 255, 255, .07) !important;
}

.tag {
    background: rgba(79, 124, 255, .16) !important;
    color: #8fb4ff !important;
}

.empty {
    color: var(--dk-muted2) !important;
}

a.link,
a {
    color: #8fb4ff;
}

a.link:hover {
    color: var(--dk-accent);
}

/* ---------- 主按钮统一为渐变 ---------- */
.btn {
    background: linear-gradient(120deg, var(--dk-brand1), var(--dk-brand2)) !important;
    border: none !important;
    color: #fff !important;
    box-shadow: 0 8px 22px rgba(79, 124, 255, .28);
    transition: filter .25s ease, transform .25s ease;
}

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

/* ---------- FastAdmin 默认布局（登录/注册/会员中心） ---------- */
.navbar-white,
.navbar-default {
    background: rgba(7, 8, 13, .88) !important;
    border-color: rgba(255, 255, 255, .08) !important;
}

.navbar-white .navbar-brand,
.navbar-default .navbar-brand,
.navbar-nav > li > a {
    color: #c9d3ea !important;
}

.navbar-nav > li > a:hover {
    color: #fff !important;
}

.content {
    background: transparent;
}

.form-control {
    background: rgba(255, 255, 255, .05) !important;
    border-color: rgba(255, 255, 255, .12) !important;
    color: var(--dk-text) !important;
}

.panel-default {
    background: var(--dk-card) !important;
    border-color: var(--dk-line) !important;
    color: var(--dk-text);
}

.panel-default > .panel-heading {
    background: rgba(255, 255, 255, .05) !important;
    border-color: rgba(255, 255, 255, .08) !important;
    color: #fff !important;
}

.footer {
    background: #05060a !important;
    border-top: 1px solid var(--dk-line);
    color: var(--dk-muted2) !important;
}

.footer p,
.footer .copyright,
.footer a {
    color: var(--dk-muted2) !important;
}

.user-section .logon-tab a {
    color: var(--dk-muted) !important;
}

.user-section .logon-tab a.active {
    color: #fff !important;
    border-bottom-color: var(--dk-brand1) !important;
}

/* ---------- 登录 / 注册卡片 ---------- */
.user-section,
.login-section,
.register-section {
    background: var(--dk-card) !important;
    border: 1px solid var(--dk-line) !important;
}

.login-section .logon-tab > a {
    background-color: rgba(255, 255, 255, .04) !important;
    color: var(--dk-muted) !important;
    border-bottom: 2px solid transparent;
}

.login-section .logon-tab > a:hover {
    background-color: rgba(255, 255, 255, .07) !important;
}

.login-section .logon-tab > a.active {
    background-color: rgba(255, 255, 255, .08) !important;
    color: #fff !important;
    border-bottom-color: var(--dk-brand1);
}

.login-section .login-main,
.login-section form,
.register-section form {
    background: transparent;
}

.control-label,
label {
    color: var(--dk-muted) !important;
}

input::placeholder,
.form-control::placeholder,
textarea::placeholder {
    color: #5b678a !important;
    opacity: 1;
}

.help-block,
.text-muted {
    color: var(--dk-muted2) !important;
}

/* 复选框、单选可读性 */
input[type="checkbox"],
input[type="radio"] {
    accent-color: var(--dk-brand1);
}

/* 验证码图片行 */
.input-group-addon {
    background: rgba(255, 255, 255, .06) !important;
    border-color: rgba(255, 255, 255, .12) !important;
    color: var(--dk-muted) !important;
}

/* ---------- 用户中心首页：统计卡 / 快捷菜单 ---------- */
.hello {
    color: var(--dk-muted) !important;
}

.card {
    background: var(--dk-card) !important;
    border: 1px solid var(--dk-line) !important;
    box-shadow: none !important;
}

.card .num {
    background: linear-gradient(100deg, #8fb4ff, #c99bff);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}

.card .label {
    color: var(--dk-muted2) !important;
}

.menu a {
    background: var(--dk-card) !important;
    border: 1px solid var(--dk-line) !important;
    color: var(--dk-text) !important;
    box-shadow: none !important;
}

.menu a:hover {
    color: #8fb4ff !important;
    border-color: rgba(79, 124, 255, .5) !important;
}

.menu .t {
    color: var(--dk-text) !important;
}

.menu .d {
    color: var(--dk-muted2) !important;
}

/* ---------- 案例展示 ---------- */
.item {
    background: var(--dk-card) !important;
    border: 1px solid var(--dk-line) !important;
    box-shadow: none !important;
}

.item .t {
    color: var(--dk-text) !important;
}

.item .d {
    color: var(--dk-muted2) !important;
}

.cover {
    background: rgba(255, 255, 255, .06) !important;
}

/* ---------- 充值套餐 ---------- */
.plan,
.plans .plan {
    background: var(--dk-card) !important;
    border: 1px solid var(--dk-line) !important;
    box-shadow: none !important;
    color: var(--dk-text) !important;
}

.plan .p,
.pts {
    color: #fff !important;
}

.tip {
    color: var(--dk-muted2) !important;
}

/* ---------- 抖音账号 ---------- */
.bind {
    background: var(--dk-card) !important;
    border: 1px solid var(--dk-line) !important;
    color: var(--dk-text) !important;
}

/* ---------- 顶部「会员中心」下拉 · 暗色适配 ----------
   Bootstrap 默认 .nav .open>a / .nav>li>a:hover 为 #eee 浅灰底、
   .dropdown-menu 为白底黑字，在暗色页面上形成刺眼的浅色块 */
.nav > li > a:hover,
.nav > li > a:focus,
.nav .open > a,
.nav .open > a:hover,
.nav .open > a:focus,
.navbar-nav > .open > a,
.navbar-nav > .open > a:hover,
.navbar-nav > .open > a:focus {
    background-color: rgba(255, 255, 255, .08) !important;
    border-color: transparent !important;
    color: #fff !important;
}

/* 下拉面板：深色卡片 + 暗投影（替代白底） */
.nav .dropdown-menu,
.navbar-nav .dropdown-menu,
.navbar-white .dropdown-menu,
.navbar-default .dropdown-menu,
#header-navbar li.dropdown ul.dropdown-menu {
    background-color: #12151f !important;
    border: 1px solid var(--dk-line) !important;
    box-shadow: 0 16px 40px rgba(0, 0, 0, .55) !important;
}

/* 下拉项：浅灰字，悬停品牌蓝底白字 */
.nav .dropdown-menu > li > a,
.navbar-nav .dropdown-menu > li > a,
.navbar-white .dropdown-menu > li > a,
.navbar-default .dropdown-menu > li > a {
    color: var(--dk-muted) !important;
}

.nav .dropdown-menu > li > a:hover,
.nav .dropdown-menu > li > a:focus,
.navbar-nav .dropdown-menu > li > a:hover,
.navbar-nav .dropdown-menu > li > a:focus,
.navbar-white .dropdown-menu > li > a:hover,
.navbar-white .dropdown-menu > li > a:focus {
    color: #fff !important;
    background-color: rgba(79, 124, 255, .18) !important;
}

/* 下拉项图标 / 分割线 */
.nav .dropdown-menu > li > a > i,
.navbar-nav .dropdown-menu > li > a > i {
    color: var(--dk-brand1) !important;
}

.nav .dropdown-menu .divider,
.navbar-nav .dropdown-menu .divider {
    background-color: var(--dk-line) !important;
}

/* 移动端展开态（frontend.css 默认 #eee 底） */
@media (max-width: 767px) {
    .navbar-white .navbar-nav .open .dropdown-menu,
    .navbar-default .navbar-nav .open .dropdown-menu {
        background-color: #12151f !important;
        border: 1px solid var(--dk-line) !important;
        box-shadow: none !important;
    }

    .navbar-white .navbar-nav .open .dropdown-menu > li > a,
    .navbar-default .navbar-nav .open .dropdown-menu > li > a {
        color: var(--dk-muted) !important;
    }
}
