/* ================================================ LIGHT MODE OVERRIDES ================================================ */ /* Body & Background */ [data-mode="light"] body { background-color: #ffffff; color: #1a1a1a; } /* Navigation */ [data-mode="light"] nav { background: rgba(255, 255, 255, 0.95); border-bottom: 1px solid rgba(0, 0, 0, 0.1); } [data-mode="light"] .logo a { color: #1a1a1a; text-shadow: none; } [data-mode="light"] .nav-menu a { color: rgba(0, 0, 0, 0.7); } [data-mode="light"] .nav-menu a:hover { color: #1a1a1a; } [data-mode="light"] .nav-menu .book-btn { border-color: #1a1a1a; color: #1a1a1a; } [data-mode="light"] .nav-menu .book-btn:hover { background: #1a1a1a; color: #ffffff; } /* Profile Header */ [data-mode="light"] .profile-header { background: #ffffff; border-bottom: 1px solid rgba(0, 0, 0, 0.1); } [data-mode="light"] .profile-username { color: #1a1a1a; } [data-mode="light"] .profile-name { color: #1a1a1a; } [data-mode="light"] .profile-description { color: rgba(0, 0, 0, 0.7); } /* Profile Stats */ [data-mode="light"] .stat-number { color: #1a1a1a; } [data-mode="light"] .stat-label { color: rgba(0, 0, 0, 0.6); } /* Profile Action Buttons */ [data-mode="light"] .profile-actions .book-btn { border-color: #1a1a1a; color: #1a1a1a; } [data-mode="light"] .profile-actions .book-btn:hover { background: #1a1a1a; color: #ffffff; } [data-mode="light"] .follow-btn { border-color: #1a1a1a; color: #1a1a1a; } [data-mode="light"] .follow-btn:hover { background: #1a1a1a; color: #ffffff; } /* Profile Tabs */ [data-mode="light"] .profile-tabs { background: #f8f8f8; border-bottom: 1px solid rgba(0, 0, 0, 0.1); } [data-mode="light"] .profile-tabs.stuck { background: rgba(255, 255, 255, 0.95); } [data-mode="light"] .tab-btn { color: rgba(0, 0, 0, 0.6); } [data-mode="light"] .tab-btn.active { color: var(--accent-purple); } /* About Section */ [data-mode="light"] .about-bio h3, [data-mode="light"] .about-qa h3 { color: var(--accent-purple); } [data-mode="light"] .bio-text { color: rgba(0, 0, 0, 0.7); } /* QA Accordion */ [data-mode="light"] .qa-accordion { border-color: rgba(0, 0, 0, 0.15); } [data-mode="light"] .qa-item { border-bottom-color: rgba(0, 0, 0, 0.1); } [data-mode="light"] .qa-toggle { color: #1a1a1a; } [data-mode="light"] .qa-toggle:hover { background: rgba(0, 0, 0, 0.05); } [data-mode="light"] .qa-question { color: #1a1a1a; } [data-mode="light"] .qa-answer { color: rgba(0, 0, 0, 0.7); } /* Artist QA Section */ [data-mode="light"] .artist-qa { background: rgba(139, 92, 246, 0.05); border-color: var(--accent-purple); } [data-mode="light"] .artist-qa h4 { color: var(--accent-purple); } [data-mode="light"] .artist-qa p { color: rgba(0, 0, 0, 0.7); } [data-mode="light"] .artist-bio { color: rgba(0, 0, 0, 0.7); } /* Reviews */ [data-mode="light"] .review-post { background: #ffffff; border-color: rgba(0, 0, 0, 0.1); } [data-mode="light"] .review-author { color: #1a1a1a; } [data-mode="light"] .review-content { color: rgba(0, 0, 0, 0.7); } [data-mode="light"] .review-time { color: rgba(0, 0, 0, 0.5); } [data-mode="light"] .action-btn { color: rgba(0, 0, 0, 0.5); } [data-mode="light"] .review-item { background: rgba(139, 92, 246, 0.05); color: rgba(0, 0, 0, 0.7); } [data-mode="light"] .artist-reviews { background: rgba(139, 92, 246, 0.05); border-color: var(--accent-purple); } /* Specialty Tags */ [data-mode="light"] .specialty-tag { background: rgba(139, 92, 246, 0.1); } /* Portfolio Section */ [data-mode="light"] .portfolio-section { background: #f5f5f5; } [data-mode="light"] .section-heading { color: #1a1a1a; } [data-mode="light"] .portfolio-item { border-color: rgba(0, 0, 0, 0.1); } /* Book Section */ [data-mode="light"] .book-section { background: #ffffff; } [data-mode="light"] .book-btn-large { border-color: #1a1a1a; color: #1a1a1a; } [data-mode="light"] .book-btn-large:hover { background: #1a1a1a; color: #ffffff; } /* Footer */ [data-mode="light"] footer { background: #f5f5f5; border-top: 1px solid rgba(0, 0, 0, 0.1); } [data-mode="light"] .footer-links a { color: rgba(0, 0, 0, 0.7); } [data-mode="light"] .footer-links a:hover { color: #1a1a1a; } [data-mode="light"] .footer-copyright { color: rgba(0, 0, 0, 0.5); }