@charset "UTF-8";
/* 
*版本: v1.2
*说明: 
    1. 优化暗色主题配色，提升视觉层次感和可读性。
    2. 增强按钮和交互元素的暗色样式，提供更一致的用户体验。
    3. 修复暗色模式下部分文本颜色过浅的问题，确保内容清晰可见。
    4. 调整暗黑模式下的使用场景和特性模块的背景色，使其更具层次感和视觉吸引力。
*时间: 2026-01-16 14:37
*/

/* 响应式断点规范：移动端 <= 767px；桌面端 >= 768px */

/* =========================
    暗色主题（按功能模块覆盖）
    ========================= */
@media (prefers-color-scheme: dark) {
     /* =========================
         01. 全局与基础
         ========================= */
     /* 全局变量 */
    :root {
        --primary-color: #1890ff;
        --primary-hover: #40a9ff;
        --text-color: #e0e0e0;
        --text-muted: #a0a0a0;
        --shadow-light: rgba(0, 0, 0, 0.3);
        --shadow-primary: rgba(24, 144, 255, 0.2);
    }

    /* 基础样式 */
    body {
        background-color: #1a1a1a;
        color: var(--text-color);
    }

    /* SVG 图标样式 */
    .icon, .pricing-icon {
        fill: currentColor;
    }

     /* =========================
         02. 导航栏
         ========================= */
     /* 导航栏 */
    .navbar {
        background-color: #242424;
        border-bottom: 1px solid rgba(255, 255, 255, 0.1);
    }

    .nav-link {
        color: var(--text-color);
    }

    .nav-link:hover {
        color: var(--primary-hover);
    }

    .nav-toggle-bar {
        background-color: var(--text-color);
    }

     /* =========================
         03. Banner 与按钮
         ========================= */
     /* Banner */
    .banner {
        background-color: #1a1a1a;
    }

    .banner-text {
        color: #a0a0a0;
    }

    /* 按钮样式 */
    .banner-buttons .btn.btn-outline-primary,
    .home-register .btn.btn-outline-primary,
    .pricing .card-body .btn.btn-outline-primary {
        border-color: var(--primary-color);
        color: var(--primary-color);
    }

    .banner-buttons .btn.btn-outline-primary:hover,
    .home-register .btn.btn-outline-primary:hover,
    .pricing .card-body .btn.btn-outline-primary:hover {
        background-color: var(--primary-hover);
        color: #fff;
        border-color: var(--primary-hover);
    }

    @media (max-width: 767px) {
        .nav {
            background-color: #242424;
            border-top: 1px solid rgba(255, 255, 255, 0.08);
            box-shadow: 0 14px 26px rgba(0, 0, 0, 0.45);
        }

        .nav-link:hover {
            background: rgba(24, 144, 255, 0.2);
        }
    }

     /* =========================
         04. 特性模块
         ========================= */
     /* 特性部分 */
    .features {
        background-color: #1a1a1a;
    }

    .feature-icon {
        background: #242424;
    }

    .feature-item p {
        color: var(--text-muted);
    }

    /* 特性图标阴影 */
    .feature-icon[data-theme="red"] { box-shadow: 0 6px 12px rgba(245, 34, 45, 0.1); }
    .feature-icon[data-theme="green"] { box-shadow: 0 6px 12px rgba(26, 196, 77, 0.1); }
    .feature-icon[data-theme="purple"] { box-shadow: 0 6px 12px rgba(114, 46, 209, 0.1); }
    .feature-icon[data-theme="orange"] { box-shadow: 0 6px 12px rgba(250, 140, 22, 0.1); }
    .feature-icon[data-theme="pink"] { box-shadow: 0 6px 12px rgba(235, 45, 150, 0.1); }
    .feature-icon[data-theme="blue"] { box-shadow: 0 6px 12px rgba(24, 144, 255, 0.1); }

     /* =========================
         05. 定价模块
         ========================= */
     /* 定价部分 */
    .pricing {
        background-color: #1a1a1a;
    }

    .card {
        background: #242424;
        box-shadow: 0 2px 8px var(--shadow-light);
    }

    .card-header {
        background: linear-gradient(45deg, #096dd9, #1890ff);
    }

    .card-body {
        background-color: #242424;
    }

    .card-body li {
        color: var(--text-color);
    }

    .card-body b {
        color: var(--primary-color);
    }

     /* =========================
         06. Home Register / 用户评价
         ========================= */
     /* home-register */
    .home-register {
        background-color: #1a1a1a;
    }

    .testimonial-card {
        background: #1f1f1f;
        box-shadow: 0 12px 30px rgba(0, 0, 0, 0.4);
    }

    .testimonial-quote {
        color: var(--text-color);
    }

     /* =========================
         07. 公共样式与页脚
         ========================= */
     /* 标题线条 */
    .title-line {
        background: linear-gradient(90deg, rgba(24, 144, 255, 0), var(--primary-color));
    }

    /* 页脚 */
    footer {
        background-color: #1a1a1a;
        color: var(--text-muted);
    }

    /* 滚动条样式 */
    ::-webkit-scrollbar {
        width: 8px;
        height: 8px;
    }

    ::-webkit-scrollbar-track {
        background: #1a1a1a;
    }

    ::-webkit-scrollbar-thumb {
        background: #333;
        border-radius: 4px;
    }

    ::-webkit-scrollbar-thumb:hover {
        background: #444;
    }

    /* 文本选中样式 */
    ::selection {
        background: var(--primary-color);
        color: #fff;
    }
}

/* 动画保持不变 */
@keyframes slide {
    0%, 25% { transform: translateX(-60px); }
    75%, 100% { transform: translateX(360px); }
}
