/* ============================================================================
   Anmelde-Seite. Wer nicht angemeldet ist, sieht DIESE Seite — nie den Desktop.
   Aufbau wie im ERP: geteilte Karte, links Marke/Kontakt, rechts das Formular.
   Farben/Abstände/Radien/Deckkraft ausschliesslich aus den Kern-Tokens.
   ============================================================================ */
.cc-loginpage { position: fixed; inset: 0; z-index: var(--z-modal); display: flex; align-items: center; justify-content: center;
                padding: var(--sp-6); background: var(--grey-900); }
.cc-login-card { display: flex; width: 100%; max-width: var(--sz-820); min-height: var(--sz-500); background: var(--surface);
                 border-radius: var(--radius); overflow: hidden; box-shadow: var(--shadow-lg); }
.cc-login-left { flex: 1; background: var(--o); color: var(--on-o); display: flex; flex-direction: column; justify-content: space-between; }
.cc-login-left-in { padding: var(--sp-8); display: flex; flex-direction: column; justify-content: center; flex: 1; gap: var(--sp-4); }
.cc-login-brand h1 { font-size: var(--fs-lg); font-weight: var(--fw-heavy); margin: 0; color: var(--on-o); }
.cc-login-brand h2 { font-size: var(--fs-base); font-weight: var(--fw-normal); margin: 0; color: var(--on-o); opacity: var(--op-strong); }
.cc-login-left p { font-size: var(--fs-sm); line-height: 1.6; margin: 0; opacity: var(--op-strong); }
.cc-login-info { font-size: var(--fs-xs); padding: var(--sp-4); background: var(--glass-soft); border-radius: var(--radius); }
.cc-login-actions { display: flex; }
.cc-login-act.cc-link { flex: 1; text-align: center; padding: var(--sp-4); color: var(--on-o); background: var(--scrim-soft); font-size: var(--fs-xs); }
.cc-login-act.cc-link:hover { background: var(--scrim); text-decoration: none; }
.cc-login-right { flex: 1; padding: var(--sp-8); display: flex; flex-direction: column; justify-content: center; gap: var(--sp-3); }
.cc-login-logo { text-align: center; font-size: var(--fs-display); color: var(--o); margin-bottom: var(--sp-4); }
.cc-login-submit { width: 100%; margin-top: var(--sp-4); }
@media (max-width: 720px) { .cc-login-card { flex-direction: column; } .cc-login-left { display: none; } }