* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body.auth-page {
    font-family: var(--font-auth);
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
}

.login-container {
background: white;
padding: 3rem 2.5rem;
border-radius: 15px;
box-shadow: 0 20px 40px rgba(0,0,0,0.1);
min-width: 380px;
max-width: 450px;
width: 90%;
}

.logo-section {
text-align: center;
margin-bottom: 2rem;
}

.logo-section h1 {
color: #2c3e50;
font-size: 1.8rem;
font-weight: 600;
margin-bottom: 0.5rem;
}

.logo-section p {
color: #7f8c8d;
font-size: 0.95rem;
}

.form-group {
margin-bottom: 1.5rem;
}

label {
display: block;
margin-bottom: 0.5rem;
font-weight: 500;
color: #2c3e50;
font-size: 0.9rem;
}

input[type="email"], input[type="password"] {
width: 100%;
padding: 0.875rem;
border: 2px solid #e1e8ed;
border-radius: 8px;
font-size: 1rem;
transition: border-color 0.3s ease;
background: #f8f9fa;
}

input[type="email"]:focus, input[type="password"]:focus {
outline: none;
border-color: #3498db;
background: white;
}

.btn-login {
width: 100%;
padding: 0.875rem;
background: linear-gradient(135deg, #3498db, #2980b9);
color: white;
border: none;
border-radius: 8px;
font-size: 1rem;
font-weight: 500;
cursor: pointer;
transition: transform 0.2s ease, box-shadow 0.2s ease;
margin-top: 0.5rem;
}

.btn-login:hover {
transform: translateY(-1px);
box-shadow: 0 5px 15px rgba(52, 152, 219, 0.3);
}

.btn-login:active {
transform: translateY(0);
}

.error-message {
color: #e74c3c;
background: #fdf2f2;
border: 1px solid #fecaca;
border-radius: 8px;
padding: 1rem;
margin-bottom: 1.5rem;
text-align: center;
font-size: 0.9rem;
}

.footer-text {
text-align: center;
margin-top: 2rem;
color: #7f8c8d;
font-size: 0.85rem;
}

@media (max-width: 480px) {
.login-container {
    padding: 2rem 1.5rem;
    min-width: 320px;
}

.logo-section h1 {
    font-size: 1.5rem;
}
}


/* Registrering (signup) */
.signup-wrapper {
min-height: 80vh;
display: flex;
align-items: center;
justify-content: center;
background: #f8f9fa;
}
.signup-card {
background: white;
padding: 2.5rem 2rem;
border-radius: 10px;
box-shadow: 0 2px 8px rgba(0,0,0,0.08);
min-width: 340px;
}
.signup-card h1 {
text-align: center;
margin-bottom: 2rem;
color: #2c3e50;
}

.signup-card .btn {
width: 100%;
margin-top: 0.5rem;
}

.info-message {
color: #2c3e50;
background: #eaf6fb;
border: 1px solid #b8e0ef;
border-radius: 4px;
padding: 0.75rem;
margin-bottom: 1rem;
text-align: center;
}
.error-message {
color: #e74c3c;
background: #fbeeea;
border: 1px solid #f5c6cb;
border-radius: 4px;
padding: 0.75rem;
margin-bottom: 1rem;
text-align: center;
}
