/* ========================================
   light.css - 浅色主题（Glassmorphism风格）
   ======================================== */
:root,
[data-theme="light"] {
    --bg-color: #E8E4FF;
    --bg-secondary: #D4D0F0;
    --bg-gradient: linear-gradient(135deg, #a5b4fc 0%, #c4b5fd 50%, #fbcfe8 100%);

    --text-color: #1e1b4b;
    --text-secondary: #312e81;
    --text-muted: #6366f1;

    --card-bg: rgba(255, 255, 255, 0.4);
    --card-border: rgba(255, 255, 255, 0.6);
    --card-shadow: 0 8px 32px rgba(99, 102, 241, 0.15), inset 0 1px 0 rgba(255, 255, 255, 0.7);
    --card-hover-shadow: 0 16px 48px rgba(99, 102, 241, 0.25), inset 0 1px 0 rgba(255, 255, 255, 0.8);

    --primary-color: #6366f1;
    --primary-hover: #4f46e5;
    --primary-light: rgba(99, 102, 241, 0.15);
    --primary-glow: rgba(99, 102, 241, 0.35);

    --success-color: #22c55e;
    --danger-color: #ef4444;
    --warning-color: #f59e0b;
    --info-color: #3b82f6;

    --input-bg: rgba(255, 255, 255, 0.5);
    --input-border: rgba(99, 102, 241, 0.3);
    --input-focus: #6366f1;
    --nav-bg: rgba(255, 255, 255, 0.35);
    --sidebar-bg: rgba(255, 255, 255, 0.4);
}

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

/* 浅色模式装饰光球 */
[data-theme="light"] body::before {
    background: radial-gradient(circle, rgba(167, 139, 250, 0.4) 0%, transparent 70%);
    opacity: 0.7;
}
[data-theme="light"] body::after {
    background: radial-gradient(circle, rgba(251, 207, 232, 0.35) 0%, transparent 70%);
    opacity: 0.6;
}

[data-theme="light"] .card {
    background: rgba(255, 255, 255, 0.45);
    backdrop-filter: blur(24px) saturate(200%);
    -webkit-backdrop-filter: blur(24px) saturate(200%);
    border: 1px solid rgba(255, 255, 255, 0.6);
}

[data-theme="light"] .navbar {
    background: rgba(255, 255, 255, 0.4);
    backdrop-filter: blur(30px) saturate(200%);
    -webkit-backdrop-filter: blur(30px) saturate(200%);
    border-bottom: 1px solid rgba(255, 255, 255, 0.5);
}

[data-theme="light"] .mobile-tab {
    background: rgba(255, 255, 255, 0.4);
    backdrop-filter: blur(30px) saturate(200%);
    -webkit-backdrop-filter: blur(30px) saturate(200%);
    border-top: 1px solid rgba(255, 255, 255, 0.5);
}

[data-theme="light"] input,
[data-theme="light"] select,
[data-theme="light"] textarea {
    background: rgba(255, 255, 255, 0.5);
    border-color: rgba(99, 102, 241, 0.25);
    color: #1e1b4b;
}

[data-theme="light"] input:focus,
[data-theme="light"] select:focus,
[data-theme="light"] textarea:focus {
    background: rgba(255, 255, 255, 0.7);
    border-color: #6366f1;
    box-shadow: 0 0 0 4px rgba(99, 102, 241, 0.2);
}

[data-theme="light"] .btn {
    background: linear-gradient(135deg, rgba(99, 102, 241, 0.95), rgba(79, 70, 229, 0.95));
    color: #fff;
}

[data-theme="light"] .btn-outline {
    background: transparent !important;
    border: 2px solid rgba(99, 102, 241, 0.5) !important;
    color: #4f46e5 !important;
}

[data-theme="light"] .btn-outline:hover {
    background: rgba(99, 102, 241, 0.1) !important;
    border-color: #6366f1 !important;
}

[data-theme="light"] .stat-card,
[data-theme="light"] .quick-item {
    background: rgba(255, 255, 255, 0.4);
    border-color: rgba(255, 255, 255, 0.6);
}

[data-theme="light"] .hero-section {
    background: linear-gradient(135deg, rgba(99, 102, 241, 0.85) 0%, rgba(139, 92, 246, 0.85) 50%, rgba(236, 72, 153, 0.85) 100%);
}

[data-theme="light"] .mat-card {
    background: rgba(255, 255, 255, 0.4);
    border-color: rgba(255, 255, 255, 0.6);
}

[data-theme="light"] .mat-card:hover {
    background: rgba(255, 255, 255, 0.55);
}

[data-theme="light"] .auth-card {
    background: rgba(255, 255, 255, 0.45);
    border-color: rgba(255, 255, 255, 0.6);
}

[data-theme="light"] .auth-tabs {
    background: rgba(255, 255, 255, 0.35);
    border-color: rgba(255, 255, 255, 0.5);
}

[data-theme="light"] .theme-toggle {
    background: rgba(255, 255, 255, 0.4);
    border-color: rgba(255, 255, 255, 0.5);
}

[data-theme="light"] .theme-toggle:hover {
    background: rgba(255, 255, 255, 0.6);
}

/* 浅色滚动条 */
[data-theme="light"] ::-webkit-scrollbar { width: 8px; height: 8px; }
[data-theme="light"] ::-webkit-scrollbar-track { background: rgba(99, 102, 241, 0.05); border-radius: 4px; }
[data-theme="light"] ::-webkit-scrollbar-thumb { background: rgba(99, 102, 241, 0.25); border-radius: 4px; }
[data-theme="light"] ::-webkit-scrollbar-thumb:hover { background: rgba(99, 102, 241, 0.4); }
