/* App lock screens (workspace/lock/*.js, Case Vault S2–S5, S8, S9).
   Builds on ws-dialogs.css (cards, buttons, banner); colours only via tokens.css (--lysi-*). */

/* S5 / S9 cover the workspace; the S3 dialog (z 9500) and S4 (z 9600) sit above */
.license-overlay.wsl-screen { z-index: 9400; }
.wsl-rec-overlay { z-index: 9600; }
.wsl-card { gap: var(--lysi-s-12); }
.wsl-card .sdp-pw-input, .wsl-card .license-btn, .wsl-card .sdp-pw-cancel, .wsl-card .sdp-pw-err { width: 100%; box-sizing: border-box; }
.wsl-mark { font: 700 var(--lysi-fs-17) var(--lysi-font-sans); color: var(--lysi-ink); letter-spacing: .02em; }
.wsl-text { font-size: var(--lysi-fs-13); line-height: 1.5; color: var(--lysi-ink2); margin: 0; }
.wsl-link {
  background: none; border: 0; padding: 4px; cursor: pointer;
  font: 500 var(--lysi-fs-13) var(--lysi-font-sans); color: var(--lysi-accent-text);
}
.wsl-link:hover { text-decoration: underline; }

/* S4: six groups of four, monospace, always two rows of three (never 5+1) */
.wsl-code {
  display: grid; grid-template-columns: repeat(3, max-content); justify-content: center;
  gap: var(--lysi-s-8) var(--lysi-s-12);
  padding: var(--lysi-s-12); border-radius: var(--lysi-r-8); background: var(--lysi-seg);
}
.wsl-code-group { font: 600 var(--lysi-fs-17) ui-monospace, Menlo, Consolas, monospace; color: var(--lysi-ink); letter-spacing: .08em; }
.wsl-rec-input { text-transform: uppercase; letter-spacing: .1em; }
.wsl-rec-done:disabled { background: var(--lysi-disabled); color: var(--lysi-disabled-ink); border-color: var(--lysi-disabled); cursor: not-allowed; }

/* S8 */
.wsl-settings { width: 420px; gap: var(--lysi-s-10); }
.wsl-switch { display: flex; align-items: flex-start; gap: var(--lysi-s-10); cursor: pointer; font-size: var(--lysi-fs-13-5); color: var(--lysi-ink); }
.wsl-switch input { margin-top: 3px; accent-color: var(--lysi-accent); }
.wsl-switch-text { display: flex; flex-direction: column; gap: 2px; }
.wsl-set-btn { text-align: left; }

/* S0 first-start setup (setup.js): the S5 card, the switch reads left-aligned */
.wsl-setup .wsl-switch { text-align: left; }

/* S4 «Drucken»: the print-only view is the code, nothing else */
@media print {
  body > *:not(.wsl-rec-overlay) { display: none; }
  .wsl-rec-overlay { position: static; background: none; backdrop-filter: none; }
  .wsl-rec > *:not(.sdp-pw-title):not(.wsl-code) { display: none; }
  .wsl-rec { box-shadow: none; border: 0; }
}