/* Auth Responsive Styles - Luana App
   Enthält responsive Anpassungen für die Auth-Screens (Login/Register/Passwort) */

/* Basis-Styles für alle Bildschirmgrößen */
.auth-screen.container {
  min-height: 100vh;
  min-height: 100dvh;
  width: 100%;
  padding: 0;
}

/* Mobile: Fullscreen */
@media (max-width: 767px) {
  .auth-screen {
    height: 100dvh; /* iOS-safe */
    overflow: hidden;
  }
  
  .auth-shell {
    height: 100%;
    padding: 0;
    border-radius: 0;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
  }
  
  .auth-card {
    min-height: 100%;
    max-width: 100%;
    width: 100%;
    border-radius: 0;
    box-shadow: none;
    padding: 40px 24px calc(40px + env(safe-area-inset-bottom)) 24px;
    display: flex;
    flex-direction: column;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    min-height: 0;
  }
  
  .auth-brand {
    margin-top: 20px;
  }
  
  .auth-form {
    margin-top: 20px;
    flex: 1;
  }
  
  .auth-links {
    margin-top: auto;
    padding-bottom: 40px;
  }
  
  .auth-card h1 {
    font-size: 32px;
  }
  
  .auth-subtitle {
    font-size: 16px;
    margin-bottom: 24px;
  }
}

/* Desktop: Fenster */
@media (min-width: 768px) {
  .auth-shell {
    padding: 32px 20px 48px;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  
  .auth-card {
    max-width: 420px;
    border-radius: 22px;
    box-shadow: var(--modal-shadow);
    padding: 28px 24px;
  }
}