/* ============================================================= Light theme overrides — only active when has .light (dark is the default). Higher specificity + !important so these win over dark-theme.css. Accent stays #F5A623. ============================================================= */ html.light body { background: #f4f5f7 !important; color: #41464f; } /* softer light-mode glow + grid */ html.light body::before { background: radial-gradient(circle at 18% 12%, rgba(245,166,35,.12), transparent 34%), radial-gradient(circle at 85% 42%, rgba(245,166,35,.08), transparent 36%), radial-gradient(circle at 55% 88%, rgba(120,90,255,.06), transparent 38%); } html.light body::after { background-image: linear-gradient(rgba(0,0,0,.04) 1px, transparent 1px), linear-gradient(90deg, rgba(0,0,0,.04) 1px, transparent 1px); } /* navbar */ html.light #ftco-navbar .navbar-brand, html.light #ftco-navbar .nav-link span { color: #1f2430 !important; } html.light #ftco-navbar.scrolled { background: rgba(255,255,255,.9) !important; box-shadow: 0 6px 24px rgba(0,0,0,.12); } html.light #ftco-navbar .nav-item.active .nav-link span { color: var(--accent) !important; } /* hero text */ html.light #home-section .slider-text h1 { color: #1f2430 !important; } html.light #home-section .slider-text h2 { color: #2d2d2d !important; } html.light #home-section .slider-text p { color: rgba(0,0,0,.7) !important; } /* section headings + body copy */ html.light .heading-section h2 { color: #1f2430 !important; } html.light .heading-section .big, html.light .heading-section .big-2 { color: rgba(0,0,0,.05) !important; } html.light .heading-section p, html.light .ftco-section p { color: #5b6270 !important; } html.light h2, html.light h3, html.light h4 { color: #1f2430; } /* about */ html.light .ftco-about p { color: #5b6270 !important; } html.light .about-info li span { color: #41464f !important; } html.light .counter-wrap .text span { color: #5b6270 !important; } /* services cards */ html.light .services-1 { background: #ffffff !important; border: 1px solid rgba(0,0,0,.06); box-shadow: 0 6px 20px rgba(0,0,0,.06); } html.light .services-1 h3 { color: #1f2430 !important; } /* resume cards */ html.light .resume-wrap { background: #ffffff !important; border: 1px solid rgba(0,0,0,.06); box-shadow: 0 6px 20px rgba(0,0,0,.05); } html.light .resume-wrap h2 { color: #1f2430 !important; } html.light .resume-wrap .position { color: #6b7280 !important; } html.light .resume-wrap p { color: #5b6270 !important; } /* skills cards + pills */ html.light #skills-section .skill-card { background: #ffffff !important; border: 1px solid rgba(0,0,0,.06) !important; box-shadow: 0 6px 20px rgba(0,0,0,.06) !important; } html.light #skills-section .skill-card h3 { color: #1f2430 !important; } html.light #skills-section .skill-pill { background: rgba(245,166,35,.12); border-color: rgba(245,166,35,.5); color: #7a5a12; } html.light #skills-section .skill-pill:hover { background: var(--accent); color: #fff; } /* enterprise project cards */ html.light #projects-section .ent-card { background: #ffffff; border: 1px solid rgba(0,0,0,.06); box-shadow: 0 8px 24px rgba(0,0,0,.08); } html.light #projects-section .ent-title { color: #1f2430 !important; } html.light #projects-section .ent-desc { color: #5b6270 !important; } /* contact */ html.light .contact-info .box .icon { background: rgba(0,0,0,.05) !important; border: 1px solid rgba(0,0,0,.06); } html.light .contact-info .box:hover .icon { background: rgba(245,166,35,.18) !important; } html.light .contact-info .box h3 { color: #1f2430 !important; } html.light .contact-info .box p, html.light .contact-info .box a { color: #5b6270 !important; } html.light .contact-form.bg-light, html.light form.contact-form { background: #ffffff !important; } html.light .contact-form .form-control { background: #fff; border: 1px solid rgba(0,0,0,.12); color: #1f2430; } html.light .contact-form .form-control::placeholder { color: #9aa0a8; } /* footer */ html.light .ftco-footer { border-top: 1px solid rgba(0,0,0,.08); } html.light .ftco-footer .ftco-heading-2 { color: #1f2430; } html.light .ftco-footer a, html.light .ftco-footer p, html.light .ftco-footer .text, html.light .ftco-footer li { color: #5b6270 !important; } /* hire-me banner */ html.light .ftco-hireme h2 { color: #1f2430 !important; } /* outline button */ html.light .btn.btn-white.btn-outline-white { color: #1f2430 !important; border-color: rgba(0,0,0,.4) !important; } html.light .btn.btn-white.btn-outline-white:hover { background: rgba(0,0,0,.06) !important; } /* loader + cursor glow */ html.light #ftco-loader { background: #f4f5f7 !important; } html.light #cursor-glow { background: radial-gradient(circle, rgba(245,166,35,.12), rgba(245,166,35,.04) 40%, transparent 66%); } /* LeetCode icon: keep its dark part dark in light mode */ html.light #leetcode path[fill="#070706"] { fill: #1a1a1a; } /* theme toggle icon button */ #theme-toggle { cursor: pointer; } #theme-toggle #theme-ico { font-size: 18px; }