html {
  color-scheme: light;
}

html[data-theme="dark"] {
  color-scheme: dark;
  --hb-dark-bg: #0b1519;
  --hb-dark-bg-soft: #101d23;
  --hb-dark-surface: #142128;
  --hb-dark-surface-2: #192930;
  --hb-dark-border: rgba(143, 208, 205, 0.16);
  --hb-dark-border-strong: rgba(143, 208, 205, 0.24);
  --hb-dark-text: #e7f1f3;
  --hb-dark-text-soft: #bdd0d5;
  --hb-dark-muted: #95aeb5;
  --hb-dark-link: #7ad7d3;
  --hb-dark-link-hover: #aaefeb;
  --hb-dark-accent: #59c8c3;
  --hb-dark-shadow: 0 22px 56px rgba(0, 0, 0, 0.3);
}

html[data-theme="dark"] body {
  background:
    radial-gradient(circle at top, rgba(13, 82, 90, 0.2), transparent 32%),
    linear-gradient(180deg, var(--hb-dark-bg) 0%, #0d171b 36%, #0a1216 100%);
  color: var(--hb-dark-text);
}

html[data-theme="dark"] body,
html[data-theme="dark"] a,
html[data-theme="dark"] button,
html[data-theme="dark"] input,
html[data-theme="dark"] textarea,
html[data-theme="dark"] select,
html[data-theme="dark"] .card,
html[data-theme="dark"] .modal-content,
html[data-theme="dark"] .dropdown-menu,
html[data-theme="dark"] .table,
html[data-theme="dark"] .form-control,
html[data-theme="dark"] .form-select {
  transition: background-color .28s ease, color .28s ease, border-color .28s ease, box-shadow .28s ease;
}

html[data-theme="dark"] a {
  color: var(--hb-dark-link);
}

html[data-theme="dark"] a:hover,
html[data-theme="dark"] a:focus {
  color: var(--hb-dark-link-hover);
}

html[data-theme="dark"] :where(.bg-white, .bg-light, .card, .card-body, .card-header, .card-footer, .modal-content, .dropdown-menu, .dropdown-item, .list-group-item, .accordion-item, .accordion-button, .table, .table-responsive, .offcanvas, .popover, .tooltip-inner, .service-card, .campaign-card-new, .event-card-new-style, .event-card-modern, .domain-card, .membership-card, .team-card, .career-card, .contact-card, .form-card, .filter-card, .card-modern, .card-custom, .donation-card, .custom-card, .hb-card, .hb-table-scroll, .site-footer, .site-footer__row, .site-footer__bottom, .site-footer__panel-grid) {
  background-color: var(--hb-dark-surface) !important;
  color: var(--hb-dark-text) !important;
  border-color: var(--hb-dark-border) !important;
  box-shadow: var(--hb-dark-shadow);
}

html[data-theme="dark"] :where(.container, .container-fluid, .row, .col, [class*="col-"]) {
  border-color: transparent;
}

html[data-theme="dark"] :where(.form-control, .form-select, input, textarea, select) {
  background: var(--hb-dark-bg-soft) !important;
  color: var(--hb-dark-text) !important;
  border-color: var(--hb-dark-border-strong) !important;
}

html[data-theme="dark"] :where(.form-control, .form-select, input, textarea, select)::placeholder {
  color: var(--hb-dark-muted) !important;
}

html[data-theme="dark"] :where(.form-control:focus, .form-select:focus, input:focus, textarea:focus, select:focus) {
  background: var(--hb-dark-bg-soft) !important;
  color: var(--hb-dark-text) !important;
  border-color: rgba(122, 215, 211, 0.44) !important;
  box-shadow: 0 0 0 0.2rem rgba(89, 200, 195, 0.14) !important;
}

html[data-theme="dark"] :where(.table, .table th, .table td, .table-striped > tbody > tr:nth-of-type(odd), .table-hover > tbody > tr:hover, .table-bordered, .table-bordered td, .table-bordered th) {
  color: var(--hb-dark-text) !important;
  border-color: var(--hb-dark-border) !important;
}

html[data-theme="dark"] .table-striped > tbody > tr:nth-of-type(odd) {
  background: rgba(255, 255, 255, 0.02) !important;
}

html[data-theme="dark"] .table-hover > tbody > tr:hover {
  background: rgba(89, 200, 195, 0.08) !important;
}

html[data-theme="dark"] :where(.btn-light, .btn-outline-light, .btn-outline-secondary, .btn.btn-light) {
  background: var(--hb-dark-surface-2) !important;
  color: var(--hb-dark-text) !important;
  border-color: var(--hb-dark-border-strong) !important;
}

html[data-theme="dark"] :where(.btn-light:hover, .btn-outline-light:hover, .btn-outline-secondary:hover, .btn.btn-light:hover) {
  background: #21353e !important;
  color: #f5fbfc !important;
}

html[data-theme="dark"] :where(.alert, .toast, .pagination .page-link, .breadcrumb, .nav-tabs .nav-link, .nav-pills .nav-link, .tab-content) {
  background-color: var(--hb-dark-surface) !important;
  color: var(--hb-dark-text) !important;
  border-color: var(--hb-dark-border) !important;
}

html[data-theme="dark"] .pagination .page-link:hover,
html[data-theme="dark"] .nav-tabs .nav-link:hover,
html[data-theme="dark"] .nav-pills .nav-link:hover {
  background-color: rgba(89, 200, 195, 0.1) !important;
}

html[data-theme="dark"] :where(.carousel-caption, .hero-content, .help-hero, .career-hero, .csr-hero, .home-hero, .hb-baaz-hero, [class*="hero"], [class*="banner"], [class*="cta"], .site-footer__accent, .back-to-top-btn, .hb-btn--primary, .btn-primary, .btn-success, .btn-info, .btn-danger, .btn-warning, .badge, .modal-header, .toast-header) :where(h1, h2, h3, h4, h5, h6, p, li, span, small, strong, a, label) {
  color: inherit !important;
}

html[data-theme="dark"] :where([class*="hero"], [class*="banner"], [class*="cta"]) {
  box-shadow: var(--hb-dark-shadow);
}

html[data-theme="dark"] .site-footer,
html[data-theme="dark"] footer.site-footer,
html[data-theme="dark"] .site-footer__bottom {
  background: linear-gradient(180deg, #101b20 0%, #0d171b 100%) !important;
  color: var(--hb-dark-text) !important;
  border-color: var(--hb-dark-border) !important;
}

html[data-theme="dark"] .site-footer__row:hover {
  background: linear-gradient(90deg, rgba(89, 200, 195, 0.08), transparent 70%) !important;
}

html[data-theme="dark"] :where(.site-footer__icon, .site-footer__label, .site-footer__single-label, .site-footer__panel-grid a, .site-footer__social a) {
  color: var(--hb-dark-text-soft) !important;
}

html[data-theme="dark"] .site-footer__line,
html[data-theme="dark"] .site-footer__single-line {
  background: linear-gradient(90deg, rgba(143, 208, 205, 0.24), rgba(143, 208, 205, 0.08)) !important;
}

html[data-theme="dark"] .site-footer__social a {
  background: rgba(255, 255, 255, 0.03) !important;
  border-color: var(--hb-dark-border) !important;
}

html[data-theme="dark"] :where(hr, .border, .border-top, .border-bottom, .border-start, .border-end) {
  border-color: var(--hb-dark-border) !important;
}

html[data-theme="dark"] :where(.accordion-button:not(.collapsed), .dropdown-item:hover, .dropdown-item:focus, .list-group-item:hover, .list-group-item:focus) {
  background: rgba(89, 200, 195, 0.08) !important;
  color: #f2fcfd !important;
}

html[data-theme="dark"] :where(.modal-backdrop.show, .offcanvas-backdrop.show) {
  opacity: 0.72;
}

html[data-theme="dark"] .back-to-top,
html[data-theme="dark"] .back-to-top-btn {
  box-shadow: 0 18px 36px rgba(0, 0, 0, 0.34), 0 0 0 1px rgba(143, 208, 205, 0.18);
}

html[data-theme="dark"] ::selection {
  background: rgba(89, 200, 195, 0.24);
  color: #ffffff;
}

/* Homepage: explicit dark theme tokens and section overrides */
html[data-theme="dark"] {
  --home-teal: #72d8d2;
  --home-teal-dark: #9cebe6;
  --home-teal-soft: rgba(114, 216, 210, 0.12);
  --home-sand: #0e181c;
  --home-ink: #edf6f8;
  --home-muted: #b5c9cf;
  --home-card: #142128;
  --home-shadow: 0 22px 54px rgba(0, 0, 0, 0.28);
  --home-shadow-strong: 0 30px 72px rgba(0, 0, 0, 0.34);
}

html[data-theme="dark"] .home-hero {
  background:
    linear-gradient(180deg, rgba(89, 200, 195, 0.08), transparent 50%),
    radial-gradient(circle at 12% 8%, rgba(89, 200, 195, 0.18), transparent 28%),
    radial-gradient(circle at 88% 14%, rgba(89, 200, 195, 0.12), transparent 24%),
    linear-gradient(180deg, #0d171b 0%, #0f1b20 42%, #0b1519 100%) !important;
}

html[data-theme="dark"] .home-future__grid {
  background-image:
    linear-gradient(rgba(114, 216, 210, 0.08) 1px, transparent 1px),
    linear-gradient(90deg, rgba(114, 216, 210, 0.08) 1px, transparent 1px);
}

html[data-theme="dark"] .home-hero__mesh,
html[data-theme="dark"] .home-hero__card::before {
  background:
    radial-gradient(circle at 8% 18%, rgba(89, 200, 195, 0.14), transparent 20%),
    radial-gradient(circle at 84% 10%, rgba(89, 200, 195, 0.12), transparent 24%),
    linear-gradient(120deg, rgba(255, 255, 255, 0.04), transparent 55%);
}

html[data-theme="dark"] .home-hero__band,
html[data-theme="dark"] .home-hero__band,
html[data-theme="dark"] .home-hero__band-metrics--luxury,
html[data-theme="dark"] .home-hero__insight,
html[data-theme="dark"] .home-hero__insight--luxury,
html[data-theme="dark"] .home-hero__telehealth,
html[data-theme="dark"] .home-story__note,
html[data-theme="dark"] .home-highlight__grid,
html[data-theme="dark"] .home-highlight__cards article,
html[data-theme="dark"] .home-campaign-card,
html[data-theme="dark"] .home-event-card,
html[data-theme="dark"] .home-service-card,
html[data-theme="dark"] .home-services__sample,
html[data-theme="dark"] .home-domain-card,
html[data-theme="dark"] .home-support-card,
html[data-theme="dark"] .home-most-card,
html[data-theme="dark"] .home-donate__card,
html[data-theme="dark"] .home-empty,
html[data-theme="dark"] .home-empty__mini-card {
  background: linear-gradient(180deg, #142128 0%, #17262d 100%) !important;
  color: var(--home-ink) !important;
  border-color: rgba(122, 215, 211, 0.14) !important;
  box-shadow: var(--home-shadow) !important;
}

html[data-theme="dark"] .home-hero__minimal-media {
  background: #112025 !important;
  box-shadow: 0 22px 48px rgba(0, 0, 0, 0.3) !important;
}

html[data-theme="dark"] .home-hero__card,
html[data-theme="dark"] .home-hero__card--luxury,
html[data-theme="dark"] .home-hero__card--minimal {
  background: linear-gradient(180deg, rgba(18, 31, 37, 0.96), rgba(15, 26, 31, 0.94)) !important;
  border: 1px solid rgba(122, 215, 211, 0.1) !important;
  box-shadow:
    0 28px 60px rgba(0, 0, 0, 0.24),
    inset 0 1px 0 rgba(255, 255, 255, 0.03) !important;
}

html[data-theme="dark"] .home-hero__minimal-media::after {
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.03), rgba(12, 45, 54, 0.24)),
    radial-gradient(circle at top right, rgba(89, 200, 195, 0.22), transparent 24%);
}

html[data-theme="dark"] .home-story,
html[data-theme="dark"] .home-services,
html[data-theme="dark"] .home-most {
  background: linear-gradient(180deg, #0f1a1f 0%, #0d171b 100%) !important;
}

html[data-theme="dark"] .home-highlight {
  background: linear-gradient(135deg, #0f1a1f 0%, #122127 100%) !important;
}

html[data-theme="dark"] .home-impact {
  background: linear-gradient(135deg, #0f1a1f, #0b1519) !important;
}

html[data-theme="dark"] .home-domain,
html[data-theme="dark"] .home-support,
html[data-theme="dark"] .home-donate {
  background: linear-gradient(180deg, #0d171b 0%, #101d23 100%) !important;
}

html[data-theme="dark"] .home-kicker,
html[data-theme="dark"] .home-hero__meta span,
html[data-theme="dark"] .home-progress,
html[data-theme="dark"] .home-story__points article,
html[data-theme="dark"] .home-story__metrics div,
html[data-theme="dark"] .home-hero__band-metrics div,
html[data-theme="dark"] .home-tag {
  background: rgba(114, 216, 210, 0.1) !important;
  color: var(--home-ink) !important;
  border-color: rgba(122, 215, 211, 0.18) !important;
}

html[data-theme="dark"] .home-tag {
  background: rgba(20, 33, 40, 0.86) !important;
  color: var(--home-teal-dark) !important;
}

html[data-theme="dark"] .home-kicker i,
html[data-theme="dark"] .home-story__points i,
html[data-theme="dark"] .home-services__sample-icon,
html[data-theme="dark"] .home-domain-card i,
html[data-theme="dark"] .home-support-card__icon,
html[data-theme="dark"] .home-most-card i {
  background: linear-gradient(135deg, rgba(89, 200, 195, 0.18), rgba(114, 216, 210, 0.1)) !important;
  color: var(--home-teal-dark) !important;
  box-shadow: 0 16px 30px rgba(89, 200, 195, 0.12) !important;
}

html[data-theme="dark"] .home-btn--secondary {
  background: rgba(20, 33, 40, 0.92) !important;
  color: var(--home-teal-dark) !important;
  border-color: rgba(122, 215, 211, 0.22) !important;
}

html[data-theme="dark"] .home-btn--secondary:hover {
  background: rgba(24, 40, 48, 0.98) !important;
  color: #ffffff !important;
  box-shadow: 0 18px 30px rgba(0, 0, 0, 0.22) !important;
}

html[data-theme="dark"] .home-progress__bar {
  background: rgba(122, 215, 211, 0.14) !important;
}

html[data-theme="dark"] .home-progress__meta,
html[data-theme="dark"] .home-event-card__meta,
html[data-theme="dark"] .home-empty p,
html[data-theme="dark"] .home-story__note span,
html[data-theme="dark"] .home-highlight__cards span,
html[data-theme="dark"] .home-campaign-card__body p,
html[data-theme="dark"] .home-event-card__content p,
html[data-theme="dark"] .home-service-card__body p,
html[data-theme="dark"] .home-story__content > p,
html[data-theme="dark"] .home-highlight__copy p,
html[data-theme="dark"] .home-donate__copy p,
html[data-theme="dark"] .home-story__points p,
html[data-theme="dark"] .home-story__metrics span,
html[data-theme="dark"] .home-hero__telehealth span,
html[data-theme="dark"] .home-hero__panel p,
html[data-theme="dark"] .home-story__trust-copy p {
  color: var(--home-muted) !important;
}

html[data-theme="dark"] .home-section-head h2,
html[data-theme="dark"] .home-highlight__copy h2,
html[data-theme="dark"] .home-story__content h2,
html[data-theme="dark"] .home-campaign-card__body h3,
html[data-theme="dark"] .home-event-card__content h3,
html[data-theme="dark"] .home-service-card__body h3,
html[data-theme="dark"] .home-story__points h3,
html[data-theme="dark"] .home-highlight__cards strong,
html[data-theme="dark"] .home-empty strong,
html[data-theme="dark"] .home-donate__copy h2,
html[data-theme="dark"] .home-title,
html[data-theme="dark"] .home-hero__panel h3,
html[data-theme="dark"] .home-hero__telehealth strong,
html[data-theme="dark"] .home-story__note strong,
html[data-theme="dark"] .home-story__metrics strong,
html[data-theme="dark"] .home-hero__meta strong {
  color: var(--home-ink) !important;
}

html[data-theme="dark"] .home-title span,
html[data-theme="dark"] .home-kicker,
html[data-theme="dark"] .home-story__trust-copy strong,
html[data-theme="dark"] .home-event-card__meta i {
  color: var(--home-teal-dark) !important;
}

html[data-theme="dark"] .home-lead,
html[data-theme="dark"] .home-section-head p {
  color: var(--home-muted) !important;
}

html[data-theme="dark"] .home-campaign-card:hover,
html[data-theme="dark"] .home-event-card:hover,
html[data-theme="dark"] .home-service-card:hover,
html[data-theme="dark"] .home-domain-card:hover,
html[data-theme="dark"] .home-support-card:hover,
html[data-theme="dark"] .home-most-card:hover {
  box-shadow: 0 28px 56px rgba(0, 0, 0, 0.34) !important;
}
