/* ============================================================
   ITR Cockpit v1.4 – login.css
   Login-Seite, Setup-Assistent
   ============================================================ */

body.page-login,
body.page-setup {
    overflow: auto;
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 24px;
    background: #e8eef7;
}

.login-box { width: 100%; max-width: 420px; }

.logo-wrap { text-align: center; margin-bottom: 28px; }

.logo-brand {
    display: inline-flex; align-items: center; gap: 12px;
    background: var(--accent); border-radius: 10px;
    padding: 12px 20px;
    box-shadow: 0 2px 12px rgba(30,58,110,0.15);
}
.logo-brand img { height: 36px; width: auto; flex-shrink: 0; }
.logo-text { text-align: left; }
.logo-title {
    font-size: 13px;
    font-weight: 700;
    color: #fff;
    white-space: nowrap;
    display: block;
}
.logo-sub { font-size: 10px; color: rgba(255,255,255,0.6); display: block; white-space: nowrap; }

/* Card mit blauem oberen Rand */
.login-card {
    background: var(--panel);
    border: 1px solid var(--border);
    border-top: 4px solid var(--accent);
    border-radius: var(--radius-lg);
    padding: 32px;
    box-shadow: 0 4px 24px rgba(30,58,110,0.10);
}

.login-card .card-title {
    font-size: 19px; font-weight: 700;
    color: var(--accent); margin-bottom: 6px;
}
.login-card .card-sub {
    font-size: 12px; color: var(--muted2);
    margin-bottom: 24px; line-height: 1.6;
}

/* Microsoft-Button */
.ms-btn {
    display: flex; align-items: center; justify-content: center; gap: 12px;
    width: 100%; padding: 12px 20px; border-radius: var(--radius);
    background: var(--accent); color: #fff;
    font-family: inherit; font-size: 13px; font-weight: 600;
    text-decoration: none; border: none; cursor: pointer;
    transition: background 0.15s, transform 0.1s;
}
.ms-btn:hover { background: var(--sidebar-hover); transform: translateY(-1px); text-decoration: none; color: #fff; }
.ms-btn svg { width: 20px; height: 20px; flex-shrink: 0; }

.login-divider { border: none; border-top: 1px solid var(--border); margin: 20px 0; }

.login-footer-note { text-align: center; font-size: 11px; color: var(--muted2); margin-bottom: 8px; }
.login-footer-links { text-align: center; font-size: 11px; }
.login-footer-links a { color: var(--accent2); }
.login-footer-links a:hover { text-decoration: underline; }
.login-footer-links span { color: var(--muted); margin: 0 6px; }

.copyright {
    margin-top: 28px; text-align: center;
    font-size: 11px; color: var(--muted2); line-height: 1.7;
}

/* Setup-spezifisch */
.setup-step-indicator {
    display: flex; align-items: center; gap: 8px;
    margin-bottom: 24px; font-size: 11px; color: var(--muted2);
}
.setup-step { width: 24px; height: 24px; border-radius: 50%; display: grid; place-items: center; font-size: 11px; font-weight: 700; }
.setup-step.done    { background: var(--success); color: #fff; }
.setup-step.active  { background: var(--accent);  color: #fff; }
.setup-step.pending { background: var(--border2); color: var(--muted2); }
.setup-step-line    { flex: 1; height: 1px; background: var(--border2); }

.setup-success { text-align: center; padding: 12px 0; }
.setup-success .success-icon { font-size: 52px; margin-bottom: 14px; }

/* Row2 grid for setup form */
.row2 { display: grid; grid-template-columns: 1fr 120px; gap: 12px; }

/* not-configured */
.not-configured { text-align: center; padding: 8px 0; color: var(--muted2); font-size: 12px; }