@media (prefers-color-scheme: light) {
  :root {
    --wl-header-bg: #002c50;
    --bs-dark: #002c50;
    --bs-dark-rgb: 0, 44, 80;
    --wl-header-text: #ffffff;
    --wl-navi-color: #0685c9;
    
    --wl-focus-color: #1fa3e8;
    --wl-hover-color: #004970;
    --wl-color-link: #045a8a;
    --bs-link-color: #045a8a;
    --bs-link-color-rgb: 4, 90, 138;
    --wl-color-link-hover: #023653;
    --bs-link-hover-color: #023653;
    --bs-link-hover-color-rgb: 2, 54, 83;
    --wl-primary-button-color: #045a8a;
    --wl-progress-color: #0685c9;
    --wl-progress-approved-color: #045079;
    --wl-progress-bg: #dbe3ec;
  }

  .navbar {
    --bs-navbar-color: #ffffff;
    --bs-navbar-brand-color: #ffffff;
    --bs-navbar-brand-hover-color: #1fa3e8;
    --bs-navbar-hover-color: #1fa3e8;
  }


  .nav-pills {
    --bs-nav-pills-link-active-bg: #004970;
  }

}

:root[data-bs-theme="light"] {
  --wl-header-bg: #002c50 !important;
  --bs-dark: #002c50 !important;
  --bs-dark-rgb: 0, 44, 80 !important;
  --wl-header-text: #ffffff !important;
  --wl-navi-color: #0685c9 !important;
  
  --wl-focus-color: #1fa3e8 !important;
  --wl-hover-color: #004970 !important;
  --wl-color-link: #045a8a !important;
  --bs-link-color: #045a8a !important;
  --bs-link-color-rgb: 4, 90, 138 !important;
  --wl-color-link-hover: #023653 !important;
  --bs-link-hover-color: #023653 !important;
  --bs-link-hover-color-rgb: 2, 54, 83 !important;
  --wl-primary-button-color: #045a8a !important;
  --wl-progress-color: #0685c9 !important;
  --wl-progress-approved-color: #045079 !important;
  --wl-progress-bg: #dbe3ec !important;
}

[data-bs-theme="light"] .navbar {
  --bs-navbar-color: #ffffff !important;
  --bs-navbar-brand-color: #ffffff !important;
  --bs-navbar-brand-hover-color: #1fa3e8 !important;
  --bs-navbar-hover-color: #1fa3e8 !important;
}


[data-bs-theme="light"] .nav-pills {
  --bs-nav-pills-link-active-bg: #004970 !important;
}



@media (prefers-color-scheme: dark) {
  :root {
    --wl-header-bg: #001a30;
    --bs-dark: #001a30;
    --bs-dark-rgb: 0, 26, 48;
    --wl-header-text: #ffffff;
    --wl-navi-color: #1fa3e8;
    
    --wl-focus-color: #1fa3e8;
    --wl-hover-color: #045a8a;
    --wl-color-link: #1fa3e8;
    --bs-link-color: #1fa3e8;
    --bs-link-color-rgb: 31, 163, 232;
    --wl-color-link-hover: #79c8f1;
    --bs-link-hover-color: #79c8f1;
    --bs-link-hover-color-rgb: 121, 200, 241;
    --wl-primary-button-color: #1fa3e8;
    --wl-progress-color: #1fa3e8;
    --wl-progress-approved-color: #13628b;
    --wl-progress-bg: #334251;
  }

  .navbar {
    --bs-navbar-color: #ffffff;
    --bs-navbar-brand-color: #ffffff;
    --bs-navbar-brand-hover-color: #1fa3e8;
    --bs-navbar-hover-color: #1fa3e8;
  }


  .nav-pills {
    --bs-nav-pills-link-active-bg: #045a8a;
  }

}

:root[data-bs-theme="dark"] {
  --wl-header-bg: #001a30 !important;
  --bs-dark: #001a30 !important;
  --bs-dark-rgb: 0, 26, 48 !important;
  --wl-header-text: #ffffff !important;
  --wl-navi-color: #1fa3e8 !important;
  
  --wl-focus-color: #1fa3e8 !important;
  --wl-hover-color: #045a8a !important;
  --wl-color-link: #1fa3e8 !important;
  --bs-link-color: #1fa3e8 !important;
  --bs-link-color-rgb: 31, 163, 232 !important;
  --wl-color-link-hover: #79c8f1 !important;
  --bs-link-hover-color: #79c8f1 !important;
  --bs-link-hover-color-rgb: 121, 200, 241 !important;
  --wl-primary-button-color: #1fa3e8 !important;
  --wl-progress-color: #1fa3e8 !important;
  --wl-progress-approved-color: #13628b !important;
  --wl-progress-bg: #334251 !important;
}

[data-bs-theme="dark"] .navbar {
  --bs-navbar-color: #ffffff !important;
  --bs-navbar-brand-color: #ffffff !important;
  --bs-navbar-brand-hover-color: #1fa3e8 !important;
  --bs-navbar-hover-color: #1fa3e8 !important;
}


[data-bs-theme="dark"] .nav-pills {
  --bs-nav-pills-link-active-bg: #045a8a !important;
}