/* Eedith Logo Styles - Updated to use new Eedith logo assets */
.logo-container {
  position: relative;
  width: 2.5rem;  /* 40px */
  height: 2.5rem; /* 40px */
  display: flex;
  align-items: center;
  justify-content: center;
  /* Prevent layout shift during logo loading */
  min-height: 2.5rem;
  background: transparent;
}

.logo-container.large {
  width: 4.5rem;  /* 72px */
  height: 4.5rem; /* 72px */
  min-height: 4.5rem;
}

.logo-container.small {
  width: 2rem;  /* 32px */
  height: 2rem; /* 32px */
  min-height: 2rem;
}

.eedith-logo {
  width: 100%;
  height: 100%;
  opacity: 1; /* Always visible by default - no blinking */
  transform: scale(1);
  transition: filter 0.3s ease, transform 0.2s ease;
}

/* Subtle hover effect for the Eedith logo */
.logo:hover .eedith-logo {
  filter: brightness(1.1);
  transform: scale(1.05);
}

/* Smooth entrance animation for newly loaded logos - optional enhancement */
.eedith-logo.loading {
  opacity: 0;
  transform: scale(0.95);
  animation: fade-in 0.3s ease forwards;
}

/* Critical: Ensure logo remains visible during auth state changes */
.auth-pending .logo-container,
.auth-loading .logo-container {
  opacity: 1 !important;
  visibility: visible !important;
  display: flex !important;
}

.auth-pending .eedith-logo,
.auth-loading .eedith-logo {
  opacity: 1 !important;
  visibility: visible !important;
}

@keyframes fade-in {
  0% {
    opacity: 0;
    transform: scale(0.95);
  }
  100% {
    opacity: 1;
    transform: scale(1);
  }
}