/* Logo Styles */
.logo-container {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  flex-shrink: 0;
  margin-left: 50px;
}

.logo-image {
  height: 90%;
  width: auto;
  object-fit: contain;
  transition: none;
}

.logo-image:hover {
  transform: none;
  filter: none;
}

/* Logo Variants */
.logo-small {
  height: 60px;
}

.logo-medium {
  height: 80px;
}

.logo-large {
  height: 120px;
}

.logo-extra-large {
  height: 150px;
}

/* Logo Positioning */
.logo-center {
  justify-content: center;
}

.logo-left {
  justify-content: flex-start;
}

.logo-right {
  justify-content: flex-end;
}

/* Logo in Cards */
.logo-card {
  background: var(--color-background-card);
  border: 1px solid var(--color-border-primary);
  border-radius: var(--border-radius-lg);
  padding: var(--spacing-lg);
  display: flex;
  align-items: center;
  justify-content: center;
  margin: var(--spacing-md) 0;
}

.logo-card .logo-image {
  height: 80px;
}

/* Logo in Footer */
.logo-footer {
  margin-bottom: var(--spacing-md);
}

.logo-footer .logo-image {
  height: 60px;
  opacity: 0.8;
}

/* Responsive Design */
@media (max-width: 576px) {
  .logo-container {
    margin-left: 20px; /* Reduzierter Abstand auf mobilen Geräten */
  }
  
  .logo-image {
    height: 90%; /* 90% der Header-Höhe auf allen Geräten */
  }
  
  .logo-small {
    height: 40px;
  }
  
  .logo-medium {
    height: 60px;
  }
  
  .logo-large {
    height: 100px;
  }
  
  .logo-extra-large {
    height: 120px;
  }
  
  .logo-card .logo-image {
    height: 60px;
  }
  
  .logo-footer .logo-image {
    height: 50px;
  }
}