/* Custom Dark Mode Colors */

.dark-body {
  /* Override dark mode to use brand colors */
  --base-color: #44bae9;
  --primary-color: #44bae9;
  --secondary-color: #0045AB;
  --hover-color: #0045AB;
}

/* Dark Mode - Header - Keep darker but not blue */
.dark-body .header,
.dark-body .header .main-header__menu-box {
  background-color: #1a1a1a !important;
}

.dark-body .header .main-menu__list > li > a {
  color: #ffffff !important;
}

.dark-body .header .main-menu__list > li > a:hover {
  color: var(--base-color) !important;
}

/* Dark Mode - TopBar - Use secondary color (#0045AB) */
.dark-body .topbar,
.dark-body .topbar--secondary,
.dark-body .topbar--tertiary,
.dark-body .topbar--quaternary {
  background-color: #0045AB !important;
}

.dark-body .topbar .topbar__inner {
  background-color: #0045AB !important;
}

.dark-body .topbar a,
.dark-body .topbar p,
.dark-body .topbar i,
.dark-body .topbar span {
  color: #ffffff !important;
}

.dark-body .topbar .social a:hover {
  color: var(--base-color) !important;
}

/* Dark Mode - Footer - Dark gradient like banner */
.dark-body .footer {
  background: linear-gradient(-104deg, rgba(0, 26, 77, 0) 1.9%, rgba(0, 26, 77, 0.08) 37.31%, rgba(0, 26, 77, 0.17) 40.18%, rgba(0, 26, 77, 0.37) 47.05%, rgba(0, 26, 77, 0.67) 56.36%, #001a4d 73.4%, #000000 95.2%, rgba(0, 26, 77, 0.91) 103.44%) !important;
}

.dark-body .footer h4,
.dark-body .footer h5,
.dark-body .footer h6,
.dark-body .footer p,
.dark-body .footer a,
.dark-body .footer li,
.dark-body .footer span {
  color: #ffffff !important;
}

.dark-body .footer a:hover {
  color: var(--base-color) !important;
}

.dark-body .footer .footer__widget-title {
  color: #ffffff !important;
}

.dark-body .footer-two {
  background: linear-gradient(-104deg, rgba(12, 26, 23, 0) 1.9%, rgba(9, 31, 27, 0.08) 37.31%, rgba(9, 31, 27, 0.17) 40.18% 40.18%, rgba(9, 31, 27, 0.37) 47.05%, rgb(9 9 31 / 67%) 56.36%, #09111f 73.4%, #010306 95.2%, rgb(9 11 31 / 91%) 103.44%) !important;
}

/* Dark Mode - Buttons - All buttons use primary color (#44bae9) */
.dark-body .btn,
.dark-body .btn--primary,
.dark-body .btn--secondary,
.dark-body .btn--tertiary,
.dark-body button[type="submit"],
.dark-body input[type="submit"] {
  background-color: #44bae9 !important;
  border-color: #44bae9 !important;
  color: #ffffff !important;
}

.dark-body .btn:hover,
.dark-body .btn--primary:hover,
.dark-body .btn--secondary:hover,
.dark-body .btn--tertiary:hover,
.dark-body button[type="submit"]:hover,
.dark-body input[type="submit"]:hover {
  background-color: #3aa8d4 !important;
  border-color: #3aa8d4 !important;
  color: #ffffff !important;
}

/* Dark Mode - Links */
.dark-body a:hover {
  color: var(--base-color) !important;
}

/* Dark Mode - Sections with brand colors */
.dark-body .section__header span,
.dark-body .section__header h2 span {
  color: var(--base-color) !important;
}

/* Dark Mode - Tags and Badges */
.dark-body .tag a,
.dark-body .badge {
  background-color: var(--base-color) !important;
  color: #ffffff !important;
}

/* Dark Mode - Progress bars */
.dark-body .progress-bar {
  background-color: var(--base-color) !important;
}

/* Dark Mode - Donation elements */
.dark-body .donation-amount:hover,
.dark-body .donation-amount.active {
  background-color: var(--base-color) !important;
  border-color: var(--base-color) !important;
  color: #ffffff !important;
}

/* Dark Mode - Icons */
.dark-body .icon,
.dark-body [class*="icon-"] {
  color: var(--base-color) !important;
}

/* Dark Mode - Navigation */
.dark-body .main-menu__list > li.active > a {
  color: var(--base-color) !important;
}

/* Dark Mode - Pagination */
.dark-body .pagination .page-link {
  color: #ffffff !important;
  background-color: #242424 !important;
}

.dark-body .pagination .page-link:hover,
.dark-body .pagination .page-item.active .page-link {
  background-color: var(--base-color) !important;
  border-color: var(--base-color) !important;
  color: #ffffff !important;
}

/* Dark Mode - Content boxes with blue backgrounds */
.dark-body .bg-primary,
.dark-body .bg-secondary,
.dark-body .bg-base {
  background-color: var(--secondary-color) !important;
  color: #ffffff !important;
}

.dark-body .bg-primary *,
.dark-body .bg-secondary *,
.dark-body .bg-base * {
  color: #ffffff !important;
}

/* Dark Mode - Testimonials */
.dark-body .testimonial__slider-single,
.dark-body .testimonial-two__inner,
.dark-body .testimonial-three__single {
  background-color: #1a1a1a !important;
  border-left: 4px solid var(--base-color) !important;
}

.dark-body .testimonial__slider-single *,
.dark-body .testimonial-two__inner *,
.dark-body .testimonial-three__single * {
  color: #ffffff !important;
}

/* Dark Mode - Counter section */
.dark-body .counter {
  background-color: var(--secondary-color) !important;
  color: #ffffff !important;
}

.dark-body .counter * {
  color: #ffffff !important;
}

/* Dark Mode - CTA sections */
.dark-body .cta-section,
.dark-body .cta-section-two {
  background-color: var(--base-color) !important;
  color: #ffffff !important;
}

.dark-body .cta-section *,
.dark-body .cta-section-two * {
  color: #ffffff !important;
}

/* Dark Mode - Cards and boxes */
.dark-body .card,
.dark-body .content-box,
.dark-body .cause__slider-single,
.dark-body .blog__single,
.dark-body .event__single {
  background-color: #242424 !important;
  border-color: var(--base-color) !important;
}

.dark-body .card:hover,
.dark-body .content-box:hover,
.dark-body .cause__slider-single:hover,
.dark-body .blog__single:hover,
.dark-body .event__single:hover {
  border-color: var(--base-color) !important;
  box-shadow: 0 0 20px rgba(68, 186, 233, 0.3) !important;
}

/* Dark Mode - Team cards */
.dark-body .team__single-content {
  background-color: #242424 !important;
}

.dark-body .team__single:hover {
  border-color: var(--base-color) !important;
}

/* Dark Mode - Forms */
.dark-body input,
.dark-body textarea,
.dark-body select {
  background-color: #242424 !important;
  color: #ffffff !important;
  border-color: #444 !important;
}

.dark-body input:focus,
.dark-body textarea:focus,
.dark-body select:focus {
  border-color: var(--base-color) !important;
  box-shadow: 0 0 10px rgba(68, 186, 233, 0.3) !important;
}

/* Dark Mode - Breadcrumb */
.dark-body .breadcrumb {
  background-color: var(--secondary-color) !important;
}

.dark-body .breadcrumb-item a {
  color: #ffffff !important;
}

.dark-body .breadcrumb-item.active {
  color: var(--base-color) !important;
}

/* Dark Mode - Social icons */
.dark-body .social a {
  color: #ffffff !important;
}

.dark-body .social a:hover {
  color: var(--base-color) !important;
}

/* Dark Mode - Help/Info sections */
.dark-body .help,
.dark-body .help-two,
.dark-body .help-three {
  background-color: #1a1a1a !important;
}

.dark-body .help *,
.dark-body .help-two *,
.dark-body .help-three * {
  color: #ffffff !important;
}

/* Dark Mode - Partner section */
.dark-body .partner {
  background-color: #1e1e1e !important;
}

/* Remove filter from partner images in dark mode */
.dark-body .partner img {
  filter: none !important;
  -webkit-filter: none !important;
}

/* Dark Mode - Ensure white text on brand colored elements */
.dark-body [style*="background-color: rgb(68, 186, 233)"] *,
.dark-body [style*="background-color: #44bae9"] *,
.dark-body [style*="background-color: rgb(0, 69, 171)"] *,
.dark-body [style*="background-color: #0045AB"] * {
  color: #ffffff !important;
}

/* Dark Mode - Banner overlays */
.dark-body .banner::before {
  background-color: rgba(0, 26, 77, 0.8) !important;
}

/* Dark Mode - Remove any green tints */
.dark-body .cause,
.dark-body .cause-two,
.dark-body .cause-three {
  background-color: #000000 !important;
}

.dark-body .difference-two {
  background-color: #1e1e1e !important;
}

/* Dark Mode - Nice select dropdown */
.dark-body .nice-select {
  background-color: #242424 !important;
  border-color: #444 !important;
  color: #ffffff !important;
}

.dark-body .nice-select .list {
  background-color: #242424 !important;
}

.dark-body .nice-select .option:hover {
  background-color: var(--base-color) !important;
  color: #ffffff !important;
}
