/* Login Page Styles */
.login-page {
  min-block-size: 100dvh;
  display: flex;
  flex-direction: column;
  align-items: center;
  /* justify-content: center;  Removed to allow header at top, card in middle */
  background: var(--color-bg);
}

.login-top-bar {
  inline-size: 100%;
  padding: var(--space-4);
  /* border-block-end: 1px solid var(--color-border); Optional */
  display: flex;
  justify-content: center; /* Center the container */
}

.login-logo-header {
  font-size: var(--font-size-xl);
  font-weight: var(--font-weight-bold);
  color: var(--color-primary);
}

.login-card {
  margin-block: auto; /* Center vertically in remaining space */
  inline-size: 100%;
  max-inline-size: 400px;
  /* background/border/radius handled by .card */
  padding: var(--space-8);
  box-shadow: var(--shadow-lg);
}

.login-header {
  text-align: center;
  margin-block-end: var(--space-6);
}

.login-logo {
  font-size: var(--font-size-2xl);
  font-weight: var(--font-weight-bold);
  color: var(--color-primary);
  margin-block-end: var(--space-3);
  display: block;
  text-decoration: none;
}

.login-title {
  font-size: var(--font-size-xl);
  font-weight: var(--font-weight-semibold);
}

.login-form {
  display: flex;
  flex-direction: column;
  gap: var(--space-4);
}