/* Custom CSS for fixing logo backgrounds in dark mode */

/* Target university logos in dark mode specifically */
[data-user-color-scheme="dark"] .university-logo,
[data-user-color-scheme="dark"] img[src*="logo_red.svg"],
[data-user-color-scheme="dark"] img[src*="uw-logo-horizontal-color-web-digital.svg"] {
  /* Remove the default brightness filter for these specific logos */
  -webkit-filter: none !important;
  filter: none !important;
  
  /* Ensure transparent background is maintained */
  background-color: transparent !important;
  
  /* Add a subtle background for better visibility if needed */
  /* Uncomment the next line if the logos need a slight background for contrast */
  /* background-color: rgba(255, 255, 255, 0.1) !important; */
  
  /* Optional: Add border radius for styling */
  border-radius: 8px;
  
  /* Ensure proper blending */
  mix-blend-mode: normal;
}

/* Alternative approach: For devices that prefer dark mode by default */
@media (prefers-color-scheme: dark) {
  :root:not([data-user-color-scheme]) .university-logo,
  :root:not([data-user-color-scheme]) img[src*="logo_red.svg"],
  :root:not([data-user-color-scheme]) img[src*="uw-logo-horizontal-color-web-digital.svg"] {
    -webkit-filter: none !important;
    filter: none !important;
    background-color: transparent !important;
    border-radius: 8px;
    mix-blend-mode: normal;
  }
}

/* For devices that prefer dark mode by default */
@media not print {
  [data-user-color-scheme="dark"] .university-logo,
  [data-user-color-scheme="dark"] img[src*="logo_red.svg"],
  [data-user-color-scheme="dark"] img[src*="uw-logo-horizontal-color-web-digital.svg"] {
    -webkit-filter: none !important;
    filter: none !important;
    background-color: transparent !important;
    border-radius: 8px;
    mix-blend-mode: normal;
  }
}