/* Login / Register / Reset – neutraler Look */

.auth-body { background: #f4f6fa; min-height: 100vh; }
.auth-main {
    max-width: 460px;
    margin: 0 auto;
    padding: 24px 16px 60px;
}
.auth-header { text-align: center; padding: 28px 0 16px; }
.auth-header .brand { font-size: 1.6rem; font-weight: 600; color: var(--text); text-decoration: none; }

/* Tabs */
.tabs {
    display: flex;
    background: #eef1f5;
    border-radius: var(--radius-sm);
    padding: 4px;
    margin-bottom: 16px;
}
.tab {
    flex: 1;
    text-align: center;
    padding: 10px 14px;
    border-radius: calc(var(--radius-sm) - 2px);
    color: var(--text-muted);
    cursor: pointer;
    background: transparent;
    border: none;
    font-size: .95rem;
    font-weight: 500;
    font-family: inherit;
    min-height: 44px;
}
.tab.active { background: #fff; color: var(--text); box-shadow: var(--shadow-sm); }

.dsgvo { font-size: .85rem; color: var(--text-muted); margin-top: 12px; display: flex; gap: 8px; align-items: flex-start; }
.dsgvo input { margin-top: 2px; flex-shrink: 0; }

.totp-input { font-size: 1.6rem; letter-spacing: .5em; text-align: center; padding-left: .5em; }

.qr-box { background: #fff; padding: 16px; border-radius: var(--radius); display: flex; justify-content: center; }
.qr-box canvas, .qr-box img { max-width: 200px; height: auto; }
.backup-codes { background: #f6f8fb; border-radius: var(--radius-sm); padding: 12px; font-family: ui-monospace, Menlo, monospace; font-size: 1rem; line-height: 1.9; letter-spacing: .05em; }

.auth-foot { text-align: center; margin-top: 18px; font-size: .9rem; color: var(--text-muted); }
.auth-foot a { color: var(--accent-text); }