/**
 * @file login_scan.css
 * Staff login, first step: the QR scanner and the paste field (login_scan_panel.php), and the link page's
 * person row and "another person or house" link (zugang.php). Sits on the light form side of till_login.css.
 */
.ls-panel[hidden], #tlForm[hidden], .ls-cam[hidden], .ls-open[hidden] { display: none; }
.ls-open { display: inline-flex; align-items: center; justify-content: center; gap: 10px; }
.ls-cam {
    position: relative; margin-top: 16px; aspect-ratio: 1; overflow: hidden;
    border-radius: 5px; background: #0f172a;
}
.ls-cam video { width: 100%; height: 100%; object-fit: cover; display: block; }
.ls-frame {
    position: absolute; inset: 18%; border: 3px solid rgba(255, 255, 255, .9); border-radius: 5px;
    box-shadow: 0 0 0 999px rgba(15, 23, 42, .35);
}
.ls-status { min-height: 1.4em; margin: 12px 0 4px; color: #64748b; font-size: 14px; }
.ls-status.ls-bad { color: #dc2626; font-weight: 600; }
.ls-paste { margin-top: 10px; }
.ls-paste-row { display: flex; gap: 10px; align-items: stretch; }
.ls-paste-row .input-icon { flex: 1 1 auto; min-width: 0; }
.ls-paste-row .btn { flex: 0 0 auto; min-height: var(--feld-hoehe, 52px); }

/* the link page: who signs in, and the way back to the scanner */
.zg-wer { display: flex; align-items: center; gap: 12px; margin-bottom: 18px; }
.zg-kreis {
    width: 44px; height: 44px; border-radius: 50%; background: rgba(59, 130, 246, .14); color: #2563eb;
    display: flex; align-items: center; justify-content: center; font-weight: 800; font-size: 15px;
}
.zg-name { font-weight: 800; font-size: 17px; color: #0f172a; }
.zg-rolle { font-size: 12.5px; color: #64748b; margin-top: 1px; }

/* no camera button on a plain-http page: no empty white bar at the bottom of the phone either */
.tl-main.ls-no-bar::after { display: none; }