/* PATROL - Screens: login, lobby, config, modal */

/* ── LOGIN & LOBBY ────────────────────────────── */
.login-container, .lobby-container {
    background: white;
    padding: 32px 40px;
    border-radius: 20px;
    max-width: 900px;
    margin: 0 auto;
    box-shadow: 0 10px 40px rgba(0,0,0,0.3);
    animation: fadeIn 0.8s ease;
}

.login-form { display: flex; flex-direction: column; gap: 18px; }

.login-input {
    background: #f8f9fa;
    border: 2px solid #dee2e6;
    width: 100%;
}

.login-btn, .signup-btn {
    background: linear-gradient(135deg, var(--prf-blue) 0%, #004080 100%);
    color: white !important;
    padding: 16px;
    font-size: 1.15em;
    width: 100%;
    margin: 0;
}

.reset-btn {
    background: transparent !important;
    border: 1px solid #dee2e6 !important;
    color: #6c757d !important;
    font-size: 0.9em !important;
    padding: 10px !important;
    width: 100%;
    margin: 0;
    text-transform: none !important;
}

.login-error {
    color: var(--wrong-red);
    background: #f8d7da;
    border: 1px solid #f5c6cb;
    border-radius: 6px;
    padding: 10px;
    font-size: 0.9em;
    display: none;
}

.login-options { margin-top: 20px; text-align: center; }
.login-options p { color: #6c757d; margin-bottom: 10px; font-size: 0.9em; }

.google-btn {
    background: white !important;
    color: var(--prf-text) !important;
    border: 2px solid #ddd !important;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    padding: 14px;
    width: 100%;
    margin: 0;
}
.google-btn img { width: 24px; height: 24px; }