body {
    font-family: 'Inter', sans-serif;
    transition: background-color 0.3s, color 0.3s;
}

body.light-mode {
    background-color: #f8fafc;
    color: #1e293b;
}

body.dark-mode {
    background-color: #1a202c;
    color: #e2e8f0;
}


body.dark-mode .logo-light {
    visibility: hidden;
}

body.dark-mode .logo-dark {
    visibility: visible;
}
img {
  max-width: 100%;
  height: auto;
}

/* Fix logo switch layout glitch */
.logo-img {
  position: absolute;
  top: 0;
  left: 0;
  height: 75%;
  width: auto;
  object-fit: contain;
  max-width: none; /* ⬅️ override the bad rule */
  display: block;
  visibility: hidden;
  transform: translateY(15%);
}

.logo-light {
  visibility: visible;
}

body.dark-mode .logo-light {
  visibility: hidden;
}

body.dark-mode .logo-dark {
  visibility: visible;
}