/* darkmode.css - 深色模式样式 (修改版) */
/* 深色模式切换器 - 基于你提供的index.css修改 */
.darkmode-toggle {
    width: 60px;
    height: 30px;
    background: rgba(255, 255, 255, 0.1);
    border-radius: 15px;
    position: relative;
    cursor: pointer;
    border: 1px solid rgba(255, 255, 255, 0.5);
    transition: all 0.3s ease;
}

body.light .darkmode-toggle {
    background: rgba(0, 0, 0, 0.1);
    border: 1px solid rgba(0, 0, 0, 0.3);
}

.darkmode-toggle::before {
    content: '';
    position: absolute;
    width: 26px;
    height: 26px;
    background: rgba(255, 255, 255, 0.9);
    border-radius: 50%;
    top: 2px;
    left: 2px;
    transition: transform 0.3s cubic-bezier(0.68, -0.55, 0.265, 1.55);
    background-image: url('../images/icons/moon.png');
    background-size: 70%;
    background-position: center;
    background-repeat: no-repeat;
}

body.light .darkmode-toggle::before {
    transform: translateX(30px);
    background-image: url('../images/icons/sun.png');
    background-color: rgba(255, 255, 255, 0.9);
}

.darkmode-toggle:hover {
    transform: scale(1.05);
}

/* 浅色模式下的文字颜色增强 */
body.light {
    color: var(--text-dark);
}

body.light .glass-container {
    background: rgba(255, 255, 255, 0.3);
    color: var(--text-dark);
}

body.light .section-title {
    color: var(--text-dark);
}

body.light .feature-card h3,
body.light .feature-card p,
body.light .about-text h3,
body.light .about-text p {
    color: var(--text-dark);
}

/* 浅色模式下链接颜色 */
body.light a:not(.btn):not(.contact-item a) {
    color: var(--text-dark);
}

body.light a:not(.btn):not(.contact-item a):hover {
    color: var(--primary-color);
}