/*
 * login.css: the staff sign-in page (login.html). The card reuses the panel's look from sheet.css
 * (bar, heading, fields); this file only centres it on the page.
 */

body { background: var(--sheet-sunk); }

.login {
  display: grid;
  place-items: center;
  min-height: 100vh;
  min-height: 100dvh;
  padding: var(--edge);
}

.login__card {
  width: 100%;
  max-width: var(--sheet-width);
  background: var(--sheet);
  border: 1px solid var(--line);
  border-radius: var(--radius-sheet);
  box-shadow: var(--shadow-sheet);
  overflow: hidden;
}

.login__body { padding: var(--space-4) var(--space-4) var(--space-5); }

.field input[type="password"] {
  width: 100%;
  padding: var(--space-2) var(--space-3);
  border: 1px solid var(--line);
  border-radius: var(--radius-control);
  background: var(--sheet-raised);
  font: inherit;
  color: var(--ink);
}

.login__error { margin-top: var(--space-3); font-size: var(--text-sm); color: var(--warn); }
.login__submit { width: 100%; margin-top: var(--space-5); }
.login__submit:disabled { opacity: 0.6; cursor: wait; }