/* Staff sign-in and registration. Field primitives come from booking.css,
   chrome from gov.css — so these pages inherit the same focus states,
   error styling and accessibility modes as the public forms. */

.auth-wrap { max-width: 480px; margin: 0 auto; }

.auth-lead {
    font-size: calc(16px * var(--gov-font-scale));
    line-height: 1.65;
    color: var(--gov-muted);
    margin: 0 0 26px;
}
.auth-lead a { color: var(--gov-blue); }

.auth-notice,
.auth-success {
    padding: 13px 15px;
    border-radius: 4px;
    margin-bottom: 22px;
    font-size: calc(16px * var(--gov-font-scale));
    line-height: 1.6;
}
.auth-notice  { background: #eef4fb; border-left: 5px solid var(--gov-blue); color: #14304f; }
.auth-success { background: #f0fdf4; border-left: 5px solid #15803d; color: #14532d; }

/* "Show password" — a labelled checkbox rather than an icon button, so it
   says what it does and is announced properly by assistive technology. */
.auth-reveal {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-top: 10px;
    font-size: calc(15px * var(--gov-font-scale));
    color: #383f45;
    cursor: pointer;
}
.auth-reveal input {
    width: 18px; height: 18px; margin: 0;
    accent-color: var(--gov-blue); cursor: pointer;
}
.auth-reveal input:focus-visible { outline: 3px solid #ffdd00; outline-offset: 2px; }

.auth-alt {
    margin-top: 30px;
    padding-top: 18px;
    border-top: 1px solid var(--gov-line);
    font-size: calc(16px * var(--gov-font-scale));
}
.auth-alt a { color: var(--gov-blue); }

/* Registration has more fields, so it is allowed a wider column. */
.auth-wrap--wide { max-width: 560px; }

@media (max-width: 560px) {
    .auth-wrap { max-width: none; }
}