/*========================================================== Binarylogin dark-theme.css ==========================================================*/ /* ============================================================ Dark Theme Add class="dark-theme" to or toggle with JavaScript ============================================================ */ .dark-theme{ --primary:#4DA3FF; --secondary:#26D7FF; --dark:#0B1220; --dark2:#121C2F; --light:#161F2D; --white:#F5F7FA; --gray:#B8C2CC; background:#0B1220; color:#F5F7FA; } /*========================= Added Extra =========================*/ html{ transition:background .35s ease,color .35s ease; } body{ transition:background .35s ease,color .35s ease; } section, .navbar, .footer, .feature-card, .service-card, .product-card, .process-box, .testimonial-card, .form-control, .btn{ transition:all .35s ease; } /*========================= Body =========================*/ .dark-theme body, body.dark-theme{ background:#0B1220; color:#F5F7FA; } /*========================= Typography =========================*/ body.dark-theme h1, body.dark-theme h2, body.dark-theme h3, body.dark-theme h4, body.dark-theme h5, body.dark-theme h6{ color:#FFFFFF; } body.dark-theme p{ color:#C8D0D8; } body.dark-theme a{ color:#F5F7FA; } body.dark-theme a:hover{ color:#26D7FF; } /*========================= Navbar =========================*/ body.dark-theme .navbar{ background:#111827; } body.dark-theme .navbar-scrolled{ background:#08111F; } body.dark-theme .nav-link{ color:#FFFFFF!important; } body.dark-theme .nav-link.active{ color:#26D7FF!important; } /*========================= Hero =========================*/ body.dark-theme .hero{ background:linear-gradient(135deg,#0F172A,#1E293B); } body.dark-theme .hero p{ color:#E2E8F0; } /*========================= Cards =========================*/ body.dark-theme .feature-card, body.dark-theme .service-card, body.dark-theme .product-card, body.dark-theme .testimonial-card, body.dark-theme .process-box{ background:#172235; color:#FFFFFF; border:1px solid rgba(255,255,255,.05); box-shadow:0 10px 30px rgba(0,0,0,.40); } body.dark-theme .feature-card p, body.dark-theme .service-card p, body.dark-theme .product-card p, body.dark-theme .testimonial-card p{ color:#C9D4DD; } /*========================= Sections =========================*/ body.dark-theme section{ background:#0B1220; } body.dark-theme .bg-light{ background:#111827!important; } /*========================= Buttons =========================*/ body.dark-theme .btn-light{ background:#FFFFFF; color:#111827; } body.dark-theme .btn-info{ color:#FFFFFF; } /*========================= Forms =========================*/ body.dark-theme .form-control{ background:#1A2638; border:1px solid #2E3D55; color:#FFFFFF; } body.dark-theme .form-control:focus{ background:#1A2638; color:#FFFFFF; border-color:#4DA3FF; box-shadow:none; } body.dark-theme .form-control::placeholder{ color:#98A6B5; } /*========================= Tables =========================*/ body.dark-theme table{ color:#FFFFFF; } body.dark-theme .table{ color:#FFFFFF; } body.dark-theme .table td, body.dark-theme .table th{ border-color:#29384D; } /*========================= Footer =========================*/ body.dark-theme .footer{ background:#050A13; } body.dark-theme .footer p{ color:#AAB6C3; } body.dark-theme .footer a{ color:#D8E2EC; } body.dark-theme .footer a:hover{ color:#26D7FF; } /*========================= Process =========================*/ body.dark-theme .process{ background:#111827; } /*========================= CTA =========================*/ body.dark-theme .cta{ background:linear-gradient(135deg,#0D47A1,#1565C0); } /*========================= Technology Box =========================*/ body.dark-theme .tech-box{ background:#172235; color:#FFFFFF; border:1px solid rgba(255,255,255,.05); } /*========================= Feature Icons =========================*/ body.dark-theme .feature-card i, body.dark-theme .service-card i, body.dark-theme .process-box i{ color:#4DA3FF; } /*========================= Scrollbar =========================*/ body.dark-theme ::-webkit-scrollbar{ width:10px; } body.dark-theme ::-webkit-scrollbar-track{ background:#101826; } body.dark-theme ::-webkit-scrollbar-thumb{ background:#4DA3FF; border-radius:50px; } /*========================= Selection =========================*/ body.dark-theme ::selection{ background:#4DA3FF; color:#FFFFFF; } /*========================= Back To Top =========================*/ body.dark-theme .back-to-top{ background:#4DA3FF; color:#FFFFFF; } /*========================= Images =========================*/ body.dark-theme img{ opacity:.97; } /*========================= Borders =========================*/ body.dark-theme hr{ border-color:#2D3C4F; } /*========================= Utility Classes =========================*/ body.dark-theme .shadow-custom{ box-shadow:0 12px 35px rgba(0,0,0,.45); } body.dark-theme .rounded-xl{ border-radius:20px; } /*========================= Transition =========================*/ body, .navbar, section, .feature-card, .service-card, .product-card, .process-box, .footer, .btn, .form-control{ transition:all .35s ease; }