/* DARK MODE */
body.dark-mode {
  background-color: var(--bg-dark);
  color: var(--light);
}

body.dark-mode {
  --primary: #a400fc;
  --secondary: #ffc600;
  --light: #eae6f2;
  --dark: #08000d;
  --bg-dark: #0e0016;
  --bg-darker: #100914;
}

body.dark-mode h1,
body.dark-mode h2,
body.dark-mode h3,
body.dark-mode h4,
body.dark-mode .h4,
body.dark-mode h5,
body.dark-mode h6 {
  color: var(--light);
}

body.dark-mode .bg-light {
  background-color: var(--dark) !important;
}
body.dark-mode .fa-bars,
body.dark-mode p.text-primary {
  color: var(--primary) !important;
}
body.dark-mode .navbar-toggler {
  border-color: var(--primary) !important;
}
body.dark-mode .accordion-button {
  background-color: var(--dark) !important;
}
body.dark-mode.accordion-button:not(.collapsed) {
  color: var(--primary) !important;
}

body.dark-mode .faq-text {
  color: var(--light) !important;
}

/*** Forms ***/
body.dark-mode .form-control {
  color: var(--light) !important;
  background-color: var(--bg-darker) !important;
  border-color: rgba(234, 230, 242, 0.2) !important;
}

body.dark-mode .form-control::placeholder {
  color: rgba(234, 230, 242, 0.6) !important;
}

body.dark-mode .form-control:focus {
  color: var(--light) !important;
  background-color: var(--bg-darker) !important;
  border-color: var(--primary) !important;
  box-shadow: 0 0 0 0.2rem rgba(164, 0, 252, 0.25) !important;
  outline: 0;
}

/*** Navbar ***/
body.dark-mode .navbar-light {
  background-color: var(--bg-dark) !important;
}
body.dark-mode .sticky-top.navbar-light {
  background-color: var(--bg-darker) !important;
}
body.dark-mode .navbar-light .navbar-nav .nav-link:not(.active) {
  color: var(--light) !important;
}
body.dark-mode .navbar-light .navbar-brand h1 {
  color: var(--light);
}
body.dark-mode .navbar-light .btn {
  background-color: var(--secondary);
  color: var(--dark);
}
/*** Hero Header ***/
body.dark-mode .hero-header {
  background-color: var(--bg-darker);
  color: var(--light);
}

/*** Service Item ***/
body.dark-mode .service-item {
  background: var(--bg-darker);
  border: 1px solid rgba(255, 255, 255, 0.08);
  color: var(--light);
}
body.dark-mode .service-item p {
  color: #bbb;
}

body.dark-mode .service body.dark-mode .service-item:hover {
  background: var(--primary);
}
body.dark-mode .service-item:hover p,
body.dark-mode .service-item:hover h5 {
  color: var(--light);
}
body.dark-mode .text-dark {
  color: var(--light) !important;
}
body.dark-mode .service-item a.btn {
  color: var(--dark);
  background: var(--secondary);
}
body.dark-mode .service-card {
  background: var(--dark);
}

/*** Portfolio ***/
body.dark-mode #portfolio-flters li {
  color: var(--light);
}
body.dark-mode #portfolio-flters li:hover,
body.dark-mode #portfolio-flters li.active {
  color: var(--secondary);
  border-color: var(--secondary);
}
body.dark-mode .portfolio-item .portfolio-overlay {
  background: rgba(50, 20, 90, 0.85);
}

/*** Sekcje z blobami ***/
body.dark-mode .fact,
body.dark-mode .newsletter {
  background-color: var(--bg-darker);
  color: var(--light);
}

/*** Kroki procesu ***/
body.dark-mode .step {
  background: var(--bg-darker);
  border: 1px solid rgba(255, 255, 255, 0.08);
}
body.dark-mode .step p {
  color: #bbb;
}

/*** Testimonial ***/
body.dark-mode .testimonial-carousel .owl-nav .owl-prev,
body.dark-mode .testimonial-carousel .owl-nav .owl-next {
  color: var(--light);
  background: var(--bg-darker);
  border: 1px solid rgba(255, 255, 255, 0.1);
}
body.dark-mode .testimonial-carousel .owl-nav .owl-prev:hover,
body.dark-mode .testimonial-carousel .owl-nav .owl-next:hover {
  background: var(--primary);
  color: var(--dark);
}

/*** Footer ***/
body.dark-mode .footer {
  background-color: var(--bg-darker);
  color: var(--light);
}
body.dark-mode .footer .btn.btn-social {
  border: 1px solid rgba(255, 255, 255, 0.1);
  color: var(--light);
}
body.dark-mode .footer .btn.btn-link {
  color: var(--light);
}
body.dark-mode .footer .btn.btn-link:hover {
  color: var(--secondary);
}
body.dark-mode .footer .copyright {
  border-top: 1px solid rgba(255, 255, 255, 0.1);
}
