/* Theme Toggle Styles */
.theme-toggle {
    position: relative;
    width: 48px;
    height: 24px;
    background-color: rgba(234, 234, 234, 0.15);
    border-radius: 12px;
    cursor: pointer;
    transition: background-color 0.3s ease;
    border: 1px solid rgba(234, 234, 234, 0.2);
}

.theme-toggle:hover {
    background-color: rgba(234, 234, 234, 0.2);
}

.theme-toggle-slider {
    position: absolute;
    top: 2px;
    left: 2px;
    width: 18px;
    height: 18px;
    background-color: var(--accent-color);
    border-radius: 50%;
    transition: transform 0.3s ease;
}

.theme-toggle.light .theme-toggle-slider {
    transform: translateX(24px);
}

/* Light mode icon (sun) */
.theme-toggle::before {
    content: '☀';
    position: absolute;
    left: 6px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 12px;
    opacity: 0.5;
    transition: opacity 0.3s ease;
}

/* Dark mode icon (moon) */
.theme-toggle::after {
    content: '☾';
    position: absolute;
    right: 6px;
    top: 50%;
    transform: translateY(-50%);
    font-size: 12px;
    opacity: 0.5;
    transition: opacity 0.3s ease;
}

.theme-toggle.light::before {
    opacity: 1;
}

.theme-toggle:not(.light)::after {
    opacity: 1;
}

/* Light theme styles */
body.light-theme {
    --bg-color: #fafafa;
    --text-color: #333333;
    --accent-color: #1a1a1a;
    background-color: var(--bg-color);
    color: var(--text-color);
}

body.light-theme::before {
    display: none;
}

body.light-theme .main-header {
    background-color: rgba(250, 250, 250, 0.95);
    border-bottom: 1px solid #e0e0e0;
}

body.light-theme .logo,
body.light-theme .nav-link {
    color: #333333;
}

body.light-theme .nav-link:hover {
    color: #1a1a1a;
}

body.light-theme .hero-background {
    background: var(--bg-color);
}

body.light-theme .hero-background::after {
    display: none;
}

body.light-theme .hero-content h1 {
    color: #1a1a1a;
}

body.light-theme .hero-content p {
    color: #555;
}

body.light-theme .content-section,
body.light-theme .engagement-section,
body.light-theme .notes-section {
    color: #333333;
}

body.light-theme #thesis h2,
body.light-theme #lab h2,
body.light-theme #people h2,
body.light-theme .notes-section h2 {
    color: #1a1a1a;
}

body.light-theme .project-description h3,
body.light-theme .note-preview-title {
    color: #1a1a1a;
}

body.light-theme .project-description strong {
    color: #1a1a1a;
}

body.light-theme .note-preview {
    border-top-color: #e0e0e0;
}

body.light-theme .note-preview:hover {
    border-top-color: #ccc;
}

body.light-theme .note-preview-date {
    color: #888;
}

body.light-theme .note-preview-excerpt {
    color: #555;
}

body.light-theme .section-separator {
    opacity: 0.3;
}

body.light-theme .chevron-down::before,
body.light-theme .chevron-down::after {
    background-color: #333;
}

body.light-theme .main-footer-bottom hr {
    background-color: #e0e0e0;
}

body.light-theme .main-footer-bottom p {
    color: #888;
}

body.light-theme .theme-toggle {
    background-color: rgba(51, 51, 51, 0.15);
    border-color: rgba(51, 51, 51, 0.2);
}

body.light-theme .theme-toggle:hover {
    background-color: rgba(51, 51, 51, 0.2);
}

body.light-theme .theme-toggle-slider {
    background-color: #1a1a1a;
}

/* Adjust icon colors */
body.light-theme .icon-funnel div,
body.light-theme .icon-synthesis-engine,
body.light-theme .icon-synthesis-engine::before,
body.light-theme .icon-synthesis-engine::after,
body.light-theme .k-dot,
body.light-theme .k-dash {
    background-color: #1a1a1a;
}

body.light-theme .icon-gpt4-sheets div {
    border-color: #1a1a1a;
}

body.light-theme .in-view .icon-gpt4-sheets div {
    background-color: #1a1a1a;
}

@media (max-width: 768px) {
    .theme-toggle {
        width: 42px;
        height: 22px;
    }
    
    .theme-toggle-slider {
        width: 16px;
        height: 16px;
    }
    
    .theme-toggle.light .theme-toggle-slider {
        transform: translateX(20px);
    }
    
    .theme-toggle::before,
    .theme-toggle::after {
        font-size: 11px;
    }
}