/**
 * Oncex 用户模块样式（P3）
 *
 * 基于 Bootstrap 5.3 的少量定制：登录卡片 / 用户中心布局 / 验证码 / 消息。
 */

/* ---------- 顶栏登录入口 ---------- */
.top_r_user img {
	width: 30px;
	height: 30px;
	border-radius: 50%;
	object-fit: cover;
	display: block;
}

.top_r .oncex-login-btn {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	font-size: 13px;
}

/* ---------- 登录页 ---------- */
.oncex-auth-card {
	border-radius: 12px;
	overflow: hidden;
}

.oncex-auth-tabs .nav-link {
	color: var(--text-secondary, #64748b);
	border-radius: 8px;
}

.oncex-auth-tabs .nav-link.active {
	background: var(--primary-color, #4a90d9);
	color: #fff;
}

.oncex-auth-divider {
	position: relative;
	text-align: center;
	color: var(--text-muted, #94a3b8);
}

.oncex-qq-login {
	display: inline-flex;
	align-items: center;
}

.oncex-captcha-img {
	cursor: pointer;
	height: 38px;
	object-fit: cover;
}

.oncex-form-msg {
	min-height: 20px;
	word-break: break-all;
}

/* ---------- 用户中心 ---------- */
.oncex-user-side .card-body img {
	border-radius: 50%;
	object-fit: cover;
	width: 96px;
	height: 96px;
}

.oncex-user-menu .list-group-item {
	border: 0;
	border-bottom: 1px solid var(--border-color, #e2e8f0);
	color: var(--text-primary, #334155);
	cursor: pointer;
	background: transparent;
	text-align: left;
}

.oncex-user-menu .list-group-item:last-child {
	border-bottom: 0;
}

.oncex-user-menu .list-group-item.active {
	background: var(--primary-light, #f0f6ff);
	color: var(--primary-color, #4a90d9);
	border-left: 3px solid var(--primary-color, #4a90d9);
	font-weight: 600;
}

.oncex-user-panel {
	border-radius: 12px;
	min-height: 420px;
}

.oncex-user-panel .oncex-tab-pane[data-pane="avatar"] img {
	border-radius: 50%;
	object-fit: cover;
	width: 128px;
	height: 128px;
}

.oncex-list .list-group-item {
	border-left: 0;
	border-right: 0;
}

/* 暗色适配 */
.dark .oncex-user-menu .list-group-item {
	color: var(--text-primary, #e2e8f0);
	border-color: rgba(255, 255, 255, 0.08);
}

.dark .oncex-user-menu .list-group-item.active {
	background: rgba(74, 144, 217, 0.15);
}

/* ---------- 响应式 ---------- */
@media (max-width: 991.98px) {
	.oncex-user-side {
		margin-bottom: 1rem;
	}
}