/* ========================================
   light.css - 浅色主题（柔和玻璃拟态风格）
   降低眩光 · 低饱和蓝紫 · 清爽耐看
   ======================================== */
::root,
[data-theme="light"] {
    --bg-color: #F6F8FF;
    --bg-secondary: #EEF2FF;
    --bg-gradient: linear-gradient(135deg, #dbeafe 0%, #e0e7ff 40%, #ede9fe 70%, #fce7f3 100%);

    --text-color: #172033;
    --text-secondary: #334155;
    --text-muted: #64748B;

    /* Surface 层级系统 */
    --surface-1: rgba(255, 255, 255, 0.72);
    --surface-2: rgba(255, 255, 255, 0.55);
    --surface-3: rgba(255, 255, 255, 0.38);

    --card-bg: rgba(255, 255, 255, 0.72);
    --card-border: rgba(148, 163, 184, 0.2);
    --card-shadow: 0 4px 24px rgba(100, 116, 139, 0.08), inset 0 1px 0 rgba(255, 255, 255, 0.9);
    --card-hover-shadow: 0 8px 36px rgba(100, 116, 139, 0.12), inset 0 1px 0 rgba(255, 255, 255, 0.95);

    --primary-color: #4F63D7;
    --primary-hover: #3B4FC7;
    --primary-light: rgba(79, 99, 215, 0.08);
    --primary-glow: rgba(79, 99, 215, 0.2);

    --success-color: #16A34A;
    --danger-color: #DC2626;
    --warning-color: #D97706;
    --info-color: #2563EB;
    --cta-color: #10B981;

    /* 语义 Surface */
    --success-surface: rgba(22, 163, 74, 0.08);
    --danger-surface: rgba(220, 38, 38, 0.08);
    --warning-surface: rgba(217, 119, 6, 0.08);
    --info-surface: rgba(37, 99, 235, 0.08);

    --input-bg: rgba(255, 255, 255, 0.8);
    --input-border: rgba(148, 163, 184, 0.3);
    --input-focus: #4F63D7;
    --nav-bg: rgba(255, 255, 255, 0.65);
    --sidebar-bg: rgba(255, 255, 255, 0.72);

    /* Shadow Scale (浅色) */
    --shadow-sm: 0 2px 8px rgba(100, 116, 139, 0.04);
    --shadow-md: 0 4px 24px rgba(100, 116, 139, 0.08);
    --shadow-lg: 0 8px 36px rgba(100, 116, 139, 0.12);
    --shadow-xl: 0 16px 48px rgba(100, 116, 139, 0.16);
}

/* 浅色特殊样式覆盖 */
[data-theme="light"] body {
    background: var(--bg-gradient);
}

/* 浅色模式装饰光球 - 更柔和 */
[data-theme="light"] body::before {
    background: radial-gradient(circle, rgba(79, 99, 215, 0.18) 0%, transparent 70%);
    opacity: 0.9;
}
[data-theme="light"] body::after {
    background: radial-gradient(circle, rgba(168, 85, 247, 0.12) 0%, transparent 70%);
    opacity: 0.8;
}

[data-theme="light"] .card {
    background: rgba(255, 255, 255, 0.72);
    backdrop-filter: blur(24px) saturate(180%);
    -webkit-backdrop-filter: blur(24px) saturate(180%);
    border: 1px solid rgba(148, 163, 184, 0.18);
}
[data-theme="light"] .card:hover {
    background: rgba(255, 255, 255, 0.82);
}

[data-theme="light"] .navbar {
    background: rgba(255, 255, 255, 0.68);
    backdrop-filter: blur(30px) saturate(180%);
    -webkit-backdrop-filter: blur(30px) saturate(180%);
    border-bottom: 1px solid rgba(148, 163, 184, 0.15);
}

[data-theme="light"] .mobile-tab {
    background: rgba(255, 255, 255, 0.72);
    backdrop-filter: blur(30px) saturate(180%);
    -webkit-backdrop-filter: blur(30px) saturate(180%);
    border-top: 1px solid rgba(148, 163, 184, 0.15);
}

/* 浅色输入框 */
[data-theme="light"] input,
[data-theme="light"] select,
[data-theme="light"] textarea {
    background: rgba(255, 255, 255, 0.85);
    border-color: rgba(148, 163, 184, 0.3);
    color: #172033;
}
[data-theme="light"] input::placeholder,
[data-theme="light"] textarea::placeholder {
    color: #94A3B8;
}
[data-theme="light"] input:focus,
[data-theme="light"] select:focus,
[data-theme="light"] textarea:focus {
    background: #fff;
    border-color: #4F63D7;
    box-shadow: 0 0 0 3px rgba(79, 99, 215, 0.12);
}

/* 浅色按钮 */
[data-theme="light"] .btn {
    background: linear-gradient(135deg, #4F63D7, #6674E8);
    color: #fff;
    box-shadow: 0 4px 14px rgba(79, 99, 215, 0.25);
}
[data-theme="light"] .btn:hover {
    box-shadow: 0 6px 20px rgba(79, 99, 215, 0.35);
}
[data-theme="light"] .btn-outline {
    background: transparent !important;
    border: 2px solid rgba(79, 99, 215, 0.4) !important;
    color: #4F63D7 !important;
    box-shadow: none;
}
[data-theme="light"] .btn-outline:hover {
    background: rgba(79, 99, 215, 0.06) !important;
    border-color: #4F63D7 !important;
}

/* 浅色统计卡片和快捷入口 */
[data-theme="light"] .stat-card,
[data-theme="light"] .quick-item {
    background: rgba(255, 255, 255, 0.68);
    border-color: rgba(148, 163, 184, 0.18);
    box-shadow: 0 2px 12px rgba(100, 116, 139, 0.06);
}
[data-theme="light"] .stat-card:hover,
[data-theme="light"] .quick-item:hover {
    background: rgba(255, 255, 255, 0.82);
}
/* 浅色统计值文字 */
[data-theme="light"] .stat-card .stat-value {
    color: #172033;
    text-shadow: none;
}
[data-theme="light"] .stat-card .stat-label {
    color: #64748B;
}

/* 浅色Hero区域 - 更柔和 */
[data-theme="light"] .hero-section {
    background: linear-gradient(135deg, rgba(79, 99, 215, 0.75) 0%, rgba(99, 102, 241, 0.65) 50%, rgba(139, 92, 246, 0.6) 100%);
    box-shadow: 0 12px 40px rgba(79, 99, 215, 0.2);
}

/* 浅色素材卡片 */
[data-theme="light"] .mat-card {
    background: rgba(255, 255, 255, 0.68);
    border-color: rgba(148, 163, 184, 0.18);
}
[data-theme="light"] .mat-card:hover {
    background: rgba(255, 255, 255, 0.82);
}
/* 浅色素材标题/描述文字 */
[data-theme="light"] .mat-card .mat-title {
    color: #172033;
    text-shadow: none;
}
[data-theme="light"] .mat-card .mat-desc {
    color: #64748B;
}
/* 浅色素材时间标识 */
[data-theme="light"] .mat-card .mat-time {
    color: #64748B;
}
[data-theme="light"] .mat-card .mat-footer {
    border-top-color: rgba(148, 163, 184, 0.15);
}
/* 浅色缩略图占位 */
[data-theme="light"] .mat-thumb {
    background: linear-gradient(135deg, rgba(79, 99, 215, 0.06), rgba(139, 92, 246, 0.06));
    border-color: rgba(148, 163, 184, 0.12);
    color: #94A3B8;
}

/* 浅色徽标 - 使用饱和度适中的深色文字 */
[data-theme="light"] .badge-success {
    background: rgba(22, 163, 74, 0.1);
    color: #16A34A;
    border-color: rgba(22, 163, 74, 0.2);
}
[data-theme="light"] .badge-danger {
    background: rgba(220, 38, 38, 0.1);
    color: #DC2626;
    border-color: rgba(220, 38, 38, 0.2);
}
[data-theme="light"] .badge-warning {
    background: rgba(217, 119, 6, 0.1);
    color: #D97706;
    border-color: rgba(217, 119, 6, 0.2);
}
[data-theme="light"] .badge-info,
[data-theme="light"] .badge-secondary {
    background: rgba(37, 99, 235, 0.1);
    color: #2563EB;
    border-color: rgba(37, 99, 235, 0.2);
}

/* 浅色统计标签 */
[data-theme="light"] .stats-pill {
    background: rgba(79, 99, 215, 0.08);
    color: #4F63D7;
    border-color: rgba(79, 99, 215, 0.15);
}

/* 浅色公告 */
[data-theme="light"] .announcement-card {
    border-left-color: rgba(79, 99, 215, 0.5);
}
[data-theme="light"] .announcement-card:hover {
    border-left-color: rgba(139, 92, 246, 0.7);
}
[data-theme="light"] .announcement-card .ann-title {
    color: #172033;
}
[data-theme="light"] .announcement-card .ann-content {
    color: #64748B;
}
[data-theme="light"] .announcement-card .ann-time {
    color: #94A3B8;
}

/* 浅色认证卡片 */
[data-theme="light"] .auth-card {
    background: rgba(255, 255, 255, 0.72);
    border-color: rgba(148, 163, 184, 0.2);
}
[data-theme="light"] .auth-tabs {
    background: rgba(79, 99, 215, 0.06);
    border-color: rgba(148, 163, 184, 0.15);
}
[data-theme="light"] .auth-tab {
    color: #64748B;
}
[data-theme="light"] .auth-tab.active {
    color: #fff;
    background: linear-gradient(135deg, #4F63D7, #6674E8);
}

/* 浅色主题切换按钮 */
[data-theme="light"] .theme-toggle {
    background: rgba(255, 255, 255, 0.6);
    border-color: rgba(148, 163, 184, 0.2);
    color: #4F63D7;
}
[data-theme="light"] .theme-toggle:hover {
    background: rgba(255, 255, 255, 0.8);
}

/* 浅色导航链接 */
[data-theme="light"] .navbar-links a {
    color: #475569;
}
[data-theme="light"] .navbar-links a:hover {
    color: #4F63D7;
    background: rgba(79, 99, 215, 0.06);
}
[data-theme="light"] .navbar-links a.active {
    color: #4F63D7;
    background: rgba(79, 99, 215, 0.1);
}
/* 浅色品牌名 */
[data-theme="light"] .navbar-brand {
    color: #172033;
    text-shadow: none;
}
[data-theme="light"] .navbar-brand i {
    background: linear-gradient(135deg, #4F63D7, #6674E8);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
[data-theme="light"] .navbar-brand span {
    background: linear-gradient(135deg, #172033, #334155);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
/* 浅色用户信息 */
[data-theme="light"] .navbar-user {
    color: #334155;
    background: rgba(79, 99, 215, 0.06);
    border-color: rgba(79, 99, 215, 0.12);
}
[data-theme="light"] .navbar-user a {
    color: #4F63D7;
}
/* 浅色主题切换(导航栏) */
[data-theme="light"] .theme-toggle-nav {
    background: rgba(79, 99, 215, 0.06);
    border-color: rgba(79, 99, 215, 0.12);
    color: #4F63D7;
}
[data-theme="light"] .theme-toggle-nav:hover {
    background: rgba(79, 99, 215, 0.12);
}

/* 浅色移动端Tab */
[data-theme="light"] .mobile-tab a {
    color: #94A3B8;
}
[data-theme="light"] .mobile-tab a.active,
[data-theme="light"] .mobile-tab a:hover {
    color: #4F63D7;
}
[data-theme="light"] .mobile-tab a.active::before {
    background: #4F63D7;
    box-shadow: 0 2px 8px rgba(79, 99, 215, 0.3);
}

/* 浅色页头标题 */
[data-theme="light"] .page-header h2 {
    color: #172033;
    text-shadow: none;
}
[data-theme="light"] .page-header h2 i {
    background: linear-gradient(135deg, #4F63D7, #6674E8);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
[data-theme="light"] .page-header {
    border-bottom-color: rgba(148, 163, 184, 0.15);
}

/* 浅色信息网格 */
[data-theme="light"] .info-item {
    background: rgba(255, 255, 255, 0.6);
    border-color: rgba(148, 163, 184, 0.12);
}
[data-theme="light"] .info-label {
    color: #94A3B8;
}
[data-theme="light"] .info-value {
    color: #172033;
}

/* 浅色快捷入口图标 */
[data-theme="light"] .quick-item i {
    background: linear-gradient(135deg, #4F63D7, #6674E8);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

/* 浅色分割线 */
[data-theme="light"] .divider {
    background: linear-gradient(90deg, transparent, rgba(148, 163, 184, 0.2), transparent);
}

/* 浅色空状态 */
[data-theme="light"] .empty-state i {
    background: linear-gradient(135deg, #94A3B8, #CBD5E1);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
[data-theme="light"] .empty-state p {
    color: #94A3B8;
}

/* 浅色消息提示 */
[data-theme="light"] .msg-success {
    background: rgba(22, 163, 74, 0.08);
    color: #16A34A;
    border-color: rgba(22, 163, 74, 0.15);
}
[data-theme="light"] .msg-error {
    background: rgba(220, 38, 38, 0.08);
    color: #DC2626;
    border-color: rgba(220, 38, 38, 0.15);
}

/* 浅色标签 */
[data-theme="light"] label {
    color: #334155;
    text-shadow: none;
}

/* 浅色历史记录 */
[data-theme="light"] .history-item .his-title {
    color: #172033;
}
[data-theme="light"] .history-item .his-meta {
    color: #64748B;
}

/* 浅色提现记录 */
[data-theme="light"] .wd-record .wd-amount {
    background: linear-gradient(135deg, #172033, #334155);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
[data-theme="light"] .wd-record .wd-meta {
    color: #64748B;
}

/* 浅色分页 */
[data-theme="light"] .pagination button {
    background: rgba(255, 255, 255, 0.6);
    border-color: rgba(148, 163, 184, 0.2);
    color: #475569;
}
[data-theme="light"] .pagination button:hover:not(:disabled) {
    background: rgba(79, 99, 215, 0.06);
    color: #4F63D7;
}
[data-theme="light"] .pagination .page-info {
    color: #64748B;
}

/* 浅色表单输入图标 */
[data-theme="light"] .input-icon-wrap i {
    color: #94A3B8;
}
[data-theme="light"] .input-icon-wrap:focus-within i {
    color: #4F63D7;
}

/* 浅色Toast通知 */
[data-theme="light"] .toast-fixed {
    background: rgba(255, 255, 255, 0.85);
    border-color: rgba(148, 163, 184, 0.15);
    color: #172033;
}

/* 浅色骨架屏 */
[data-theme="light"] .skeleton-card {
    background: rgba(255, 255, 255, 0.4);
    border-color: rgba(148, 163, 184, 0.1);
}
[data-theme="light"] .skeleton-img,
[data-theme="light"] .skeleton-line {
    background: linear-gradient(90deg, rgba(148, 163, 184, 0.06) 25%, rgba(148, 163, 184, 0.12) 50%, rgba(148, 163, 184, 0.06) 75%);
    background-size: 200% 100%;
}

/* 浅色错误状态 */
[data-theme="light"] .error-state {
    background: rgba(255, 255, 255, 0.5);
    border-color: rgba(148, 163, 184, 0.15);
}
[data-theme="light"] .error-state h3 {
    color: #172033;
}
[data-theme="light"] .error-state p {
    color: #64748B;
}

/* 浅色模态框 */
[data-theme="light"] .modal-overlay {
    background: rgba(148, 163, 184, 0.3);
}
[data-theme="light"] .modal-content {
    background: rgba(255, 255, 255, 0.9);
    border-color: rgba(148, 163, 184, 0.15);
    color: #172033;
}

/* 浅色链接 */
[data-theme="light"] a {
    color: #4F63D7;
}
[data-theme="light"] a:hover {
    color: #3B4FC7;
}

/* ===== 后台浅色主题覆盖 ===== */

/* 浅色侧边栏 */
[data-theme="light"] .admin-sidebar {
    background: rgba(255, 255, 255, 0.8);
    border-right-color: rgba(148, 163, 184, 0.12);
}
[data-theme="light"] .admin-sidebar .sidebar-logo {
    color: #4F63D7;
    border-bottom-color: rgba(148, 163, 184, 0.1);
}
[data-theme="light"] .admin-sidebar .nav-item {
    color: #475569;
}
[data-theme="light"] .admin-sidebar .nav-item:hover {
    color: #4F63D7;
    background: rgba(79, 99, 215, 0.06);
}
[data-theme="light"] .admin-sidebar .nav-item.active {
    background: linear-gradient(135deg, #4F63D7, #6674E8);
    color: #fff;
}

/* 浅色顶栏 */
[data-theme="light"] .admin-topbar {
    background: rgba(255, 255, 255, 0.75);
    border-bottom-color: rgba(148, 163, 184, 0.1);
}
[data-theme="light"] .admin-topbar .topbar-title {
    color: #172033;
}
[data-theme="light"] .admin-topbar .admin-info {
    background: rgba(79, 99, 215, 0.04);
    color: #475569;
}
[data-theme="light"] .admin-topbar .admin-avatar {
    color: #4F63D7;
    background: rgba(79, 99, 215, 0.08);
}

/* 浅色表格 */
[data-theme="light"] .table-wrap {
    background: rgba(255, 255, 255, 0.72);
    border-color: rgba(148, 163, 184, 0.15);
}
[data-theme="light"] .table-wrap th {
    background: rgba(79, 99, 215, 0.06);
    color: #475569;
}
[data-theme="light"] .table-wrap td {
    border-bottom-color: rgba(148, 163, 184, 0.1);
}
[data-theme="light"] .table-wrap tr:nth-child(even) td {
    background: rgba(79, 99, 215, 0.02);
}
[data-theme="light"] .table-wrap tr:hover td {
    background: rgba(79, 99, 215, 0.05);
}

/* 浅色后台表单输入 */
[data-theme="light"] .admin-main input[type="text"],
[data-theme="light"] .admin-main input[type="password"],
[data-theme="light"] .admin-main input[type="email"],
[data-theme="light"] .admin-main input[type="number"],
[data-theme="light"] .admin-main input[type="url"],
[data-theme="light"] .admin-main select,
[data-theme="light"] .admin-main textarea {
    background: rgba(255, 255, 255, 0.9) !important;
    border-color: rgba(148, 163, 184, 0.25) !important;
    color: #172033;
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.6);
}
[data-theme="light"] .admin-main input:focus,
[data-theme="light"] .admin-main select:focus,
[data-theme="light"] .admin-main textarea:focus {
    background: #fff !important;
    border-color: #4F63D7 !important;
    box-shadow: 0 0 0 3px rgba(79, 99, 215, 0.1) !important;
}

/* 浅色仪表盘统计图标 */
[data-theme="light"] .dash-stat .stat-number {
    color: #172033;
}
[data-theme="light"] .dash-stat .stat-label {
    color: #64748B;
}

/* 浅色section标题 */
[data-theme="light"] .section-title,
[data-theme="light"] .edit-container .section-title {
    color: #4F63D7;
}

/* 浅色提示框 */
[data-theme="light"] .alert-danger {
    background: rgba(220, 38, 38, 0.06);
    border-color: rgba(220, 38, 38, 0.12);
}
[data-theme="light"] .alert-success {
    background: rgba(22, 163, 74, 0.06);
    border-color: rgba(22, 163, 74, 0.12);
}

/* 浅色简单表格 */
[data-theme="light"] .data-table thead th {
    background: #4F63D7;
}
[data-theme="light"] .data-table tbody tr:nth-child(even) td {
    background: rgba(79, 99, 215, 0.02);
}
[data-theme="light"] .data-table tbody tr:hover td {
    background: rgba(79, 99, 215, 0.05);
}

/* 浅色滚动条 */
[data-theme="light"] ::-webkit-scrollbar { width: 8px; height: 8px; }
[data-theme="light"] ::-webkit-scrollbar-track { background: rgba(148, 163, 184, 0.04); border-radius: 4px; }
[data-theme="light"] ::-webkit-scrollbar-thumb { background: rgba(148, 163, 184, 0.2); border-radius: 4px; }
[data-theme="light"] ::-webkit-scrollbar-thumb:hover { background: rgba(148, 163, 184, 0.35); }

/* ---------- 浅色 Surface 层级组件 ---------- */
[data-theme="light"] .card { background: var(--surface-1); }
[data-theme="light"] .stat-card { background: var(--surface-1); }
[data-theme="light"] .mat-card { background: var(--surface-1); }
[data-theme="light"] .quick-item { background: var(--surface-2); }
[data-theme="light"] .info-item { background: var(--surface-2); }
[data-theme="light"] .badge { background: var(--surface-2); }

/* 浅色 CTA 按钮 */
[data-theme="light"] .btn-cta {
    background: linear-gradient(135deg, #10B981, #059669) !important;
    color: #fff !important;
    box-shadow: 0 6px 20px rgba(16, 185, 129, 0.25);
}

/* 浅色 Ripple 涟漪 */
[data-theme="light"] .ripple {
    background: rgba(79, 99, 215, 0.2);
}

/* 浅色 focus-visible */
[data-theme="light"] :focus-visible {
    outline-color: #4F63D7;
}
[data-theme="light"] .btn:focus-visible,
[data-theme="light"] button:focus-visible {
    box-shadow: 0 0 0 4px rgba(79, 99, 215, 0.15);
}
