/**
 * 灵点上新 - 蓝色主题
 * 现代专业的蓝色配色方案
 */

:root {
    /* 主色调 - 蓝色系 */
    --ld-primary: #3B82F6;
    --ld-primary-dark: #2563EB;
    --ld-primary-light: #60A5FA;
    --ld-primary-bg: rgba(59, 130, 246, 0.1);

    /* 渐变色 */
    --ld-gradient: linear-gradient(135deg, #3B82F6 0%, #2563EB 100%);
    --ld-gradient-hover: linear-gradient(135deg, #2563EB 0%, #1D4ED8 100%);

    /* 侧边栏深色 */
    --ld-sidebar-bg: linear-gradient(180deg, #1E293B 0%, #0F172A 100%);
    --ld-sidebar-text: rgba(255, 255, 255, 0.7);
    --ld-sidebar-active: rgba(255, 255, 255, 0.15);

    /* 状态色 */
    --ld-success: #22C55E;
    --ld-success-bg: rgba(34, 197, 94, 0.1);
    --ld-warning: #F59E0B;
    --ld-warning-bg: rgba(245, 158, 11, 0.1);
    --ld-danger: #EF4444;
    --ld-danger-bg: rgba(239, 68, 68, 0.1);
    --ld-info: #0EA5E9;
    --ld-info-bg: rgba(14, 165, 233, 0.1);

    /* 中性色 */
    --ld-gray-50: #F8FAFC;
    --ld-gray-100: #F1F5F9;
    --ld-gray-200: #E2E8F0;
    --ld-gray-300: #CBD5E1;
    --ld-gray-400: #94A3B8;
    --ld-gray-500: #64748B;
    --ld-gray-600: #475569;
    --ld-gray-700: #334155;
    --ld-gray-800: #1E293B;
    --ld-gray-900: #0F172A;

    /* 文字色 */
    --ld-text-primary: #1E293B;
    --ld-text-secondary: #64748B;
    --ld-text-muted: #94A3B8;

    /* 边框和阴影 */
    --ld-border: #E2E8F0;
    --ld-shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.05);
    --ld-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
    --ld-shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);

    /* 圆角 */
    --ld-radius-sm: 6px;
    --ld-radius: 8px;
    --ld-radius-lg: 12px;
    --ld-radius-xl: 16px;
}

/* ===== 主题覆盖样式 ===== */

/* 登录页面 */
.login-page {
    background: linear-gradient(135deg, #1E293B 0%, #0F172A 50%, #1E3A5F 100%);
}

.submit-btn {
    background: var(--ld-gradient);
}

.submit-btn:hover:not(:disabled) {
    background: var(--ld-gradient-hover);
    box-shadow: 0 8px 20px rgba(59, 130, 246, 0.3);
}

/* 侧边栏 */
.sidebar {
    background: var(--ld-sidebar-bg);
}

.nav-item.active {
    background: var(--ld-sidebar-active);
    border-left-color: var(--ld-primary);
}

.nav-item .badge {
    background: var(--ld-primary);
}

/* 管理员头像 */
.admin-avatar {
    background: var(--ld-gradient);
}

/* 按钮 */
.btn-primary {
    background: var(--ld-gradient);
}

.btn-primary:hover {
    background: var(--ld-gradient-hover);
    box-shadow: 0 4px 12px rgba(59, 130, 246, 0.3);
}

/* 表格用户头像 */
.data-table .user-avatar,
.shop-avatar {
    background: var(--ld-gradient);
}

/* 状态标签 */
.status-badge.premium {
    background: var(--ld-primary-bg);
    color: var(--ld-primary);
}

/* 表单焦点 */
.form-group input:focus,
.form-input:focus,
.search-input:focus,
textarea:focus,
select:focus {
    border-color: var(--ld-primary);
    box-shadow: 0 0 0 3px var(--ld-primary-bg);
}

/* 分页 */
.page-btn:hover:not(:disabled) {
    border-color: var(--ld-primary);
    color: var(--ld-primary);
}

.page-btn.active {
    background: var(--ld-primary);
    border-color: var(--ld-primary);
}

/* 加载动画 */
.loading-spinner {
    border-top-color: var(--ld-primary);
}

/* 开关 */
.switch input:checked + .switch-slider {
    background-color: var(--ld-primary);
}

/* 配置组标题 */
.config-group-title {
    color: var(--ld-primary);
}

/* 套餐图标 */
.package-icon {
    background: var(--ld-gradient);
}

.package-icon.basic {
    background: var(--ld-gradient);
}

.package-icon.pro {
    background: var(--ld-gradient);
}

/* 角色信息卡片 */
.role-info-card {
    border-left-color: var(--ld-primary);
}

/* 各种primary相关 */
.primary--text,
.accent--text {
    color: var(--ld-primary);
    caret-color: var(--ld-primary);
}

.primary {
    background-color: var(--ld-primary);
    border-color: var(--ld-primary);
}

/* 会员卡片 */
.membership-card {
    background: var(--ld-gradient);
}

/* 链接和交互色 */
a:hover {
    color: var(--ld-primary);
}

/* 选中状态 */
.platform-card.active,
.auth-platform.selected {
    border-color: var(--ld-primary);
}

.auth-platform:hover {
    border-color: var(--ld-primary);
}

/* 结果区域 */
.result-section {
    background: var(--ld-gradient);
}

/* 费用总计 */
.fee-total .fee-value {
    color: var(--ld-primary);
}

/* 收益值 */
.profit-card .value.neutral {
    color: var(--ld-primary);
}

/* 分类下拉 */
.category-dropdown {
    border-color: var(--ld-primary);
}

/* 选项卡 */
.tab.active {
    color: var(--ld-primary);
    border-bottom-color: var(--ld-primary);
}

.tab:hover {
    color: var(--ld-primary);
}

/* Tab按钮 */
.tab-btn.active {
    background: var(--ld-gradient);
}

/* 按钮渐变背景 */
.btn {
    background: var(--ld-gradient);
}

.btn:hover {
    box-shadow: 0 8px 25px rgba(59, 130, 246, 0.4);
}

.btn.secondary {
    background: var(--ld-primary-bg);
    color: var(--ld-primary);
    border-color: rgba(59, 130, 246, 0.3);
}

/* 输入框后缀 */
.input-suffix::after {
    color: var(--ld-text-muted);
}

/* Header */
.header {
    /*background: var(--ld-gradient);*/
}

/* 侧边锚点导航 */
.anchors .anchors__item {
    background: var(--ld-gradient);
    box-shadow: 0 2px 8px rgba(59, 130, 246, 0.3);
}

.anchors .anchors__item:hover {
    box-shadow: 0 6px 16px rgba(59, 130, 246, 0.5);
}

/* 数据卡片 */
.data-card h3 {
    color: var(--ld-primary);
}

/* 图片类型标签 */
.image-type-badge {
    background: rgba(59, 130, 246, 0.9);
}

/* JSON查看器 */
.json-key {
    color: #F59E0B;
}

.json-string {
    color: #22C55E;
}

.json-number {
    color: #3B82F6;
}

/* 按钮轮廓 */
.btn-outline:hover {
    border-color: var(--ld-primary);
    color: var(--ld-primary);
}

/* 表单提示链接 */
.form-tip a {
    color: var(--ld-primary);
}

/* 后台登录 */
.login-header h1 {
    color: var(--ld-gray-800);
}

.login-tips strong {
    color: var(--ld-gray-800);
}

/* 操作徽章颜色 */
.action-badge.auth { background: var(--ld-primary-bg); color: var(--ld-primary); }
.action-badge.membership { background: rgba(59, 130, 246, 0.1); color: #3b82f6; }

.status-badge.basic { background: var(--ld-primary-bg); color: var(--ld-primary); }
.status-badge.pro { background: var(--ld-primary-bg); color: var(--ld-primary); }
.status-badge.operator { background: var(--ld-primary-bg); color: var(--ld-primary); }
.status-badge.audience { background: var(--ld-primary-bg); color: var(--ld-primary); }
.status-badge.notice { background: var(--ld-primary-bg); color: var(--ld-primary); }