/* Registration uses the same compact card and palette as the login page. */
body.register-page {
    --auth-primary: #dc3545;
    --auth-hover: #c82333;
    --auth-soft: #f8f9fa;
    --auth-line: #ced4da;
    --auth-muted: #6c757d;
    --register-text: #212529;
    --register-muted: #6c757d;
    --register-border: #ced4da;
    --register-danger: #b93636;
    --portal-ink: #212529;
    --portal-line: #dee2e6;
    --portal-radius: 4px;
    min-width: 280px;
    margin: 0;
    color: var(--register-text);
    background: #e9ecef;
    font-family: "Source Sans Pro", Arial, sans-serif;
    font-size: 16px;
    line-height: 1.5;
    -webkit-font-smoothing: antialiased;
}
.register-page button, .register-page input { font: inherit; }
.register-page__main {
    display: grid;
    place-items: center;
    min-height: 100vh;
    min-height: 100svh;
    padding: 24px 0;
}
.register-card {
    width: 620px;
    max-width: 90%;
    overflow: hidden;
    border-top: 3px solid #dc3545;
    border-radius: 4px;
    background: #fff;
    box-shadow: 0 0 1px rgba(0, 0, 0, .125), 0 1px 3px rgba(0, 0, 0, .2);
}
.register-card__logo { padding: 12px 20px; border-bottom: 1px solid rgba(0, 0, 0, .125); text-align: center; }
.register-card__brand { display: inline-block; max-width: 100%; vertical-align: middle; }
.register-card__brand img { display: block; width: auto; max-width: 100%; height: 70px; object-fit: contain; border-radius: 4px; }
.register-card__body { min-width: 0; padding: 20px; }
.register-card__header { margin-bottom: 20px; text-align: center; }
body.register-page .register-card__header h1 { margin: 0 0 6px; color: #212529; font-size: 24px; font-weight: 600; line-height: 1.25; }
.register-card__header p { margin: 0; color: #6c757d; font-size: 14px; }
.register-alert { display: flex; align-items: flex-start; gap: 8px; margin-bottom: 16px; padding: 10px 12px; border: 1px solid #f5c6cb; border-radius: 4px; color: #721c24; background: #f8d7da; font-size: 14px; }
.register-form { display: grid; gap: 18px; }
body.register-page .register-form__section + .register-form__section { padding-top: 16px; border-top: 1px solid #dee2e6; }
body.register-page .register-form__title { margin-bottom: 12px; color: #343a40; font-size: 16px; font-weight: 600; }
.register-form__grid { display: grid; gap: 12px 16px; }
.register-form__grid--two, .register-form__grid--address { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.register-form__grid--address { margin-top: 12px; }
.register-field--address { grid-column: 1 / -1; }
.register-field { min-width: 0; }
.register-field label { display: block; margin-bottom: 5px; color: #495057; font-size: 14px; font-weight: 400; }
.register-field__optional { margin-left: 4px; color: #6c757d; font-size: 12px; }
.register-field input { width: 100%; min-width: 0; height: 38px; padding: 6px 12px; border: 1px solid #ced4da; border-radius: 4px; outline: 0; color: #495057; background: #fff; font-size: 16px; }
body.register-page .register-field input:focus { border-color: #80bdff; box-shadow: 0 0 0 3px rgba(0, 123, 255, .15); }
.register-field input::placeholder { color: #6c757d; }
.register-field__error { display: block; margin-top: 5px; color: var(--register-danger); font-size: 13px; }
.register-captcha { display: grid; grid-template-columns: 180px minmax(0, 1fr); align-items: end; gap: 16px; }
.register-captcha__image-wrap { display: flex; height: 50px; overflow: hidden; border: 1px solid #ced4da; border-radius: 4px; background: #fff; }
.register-captcha__image { display: block; width: 0; flex: 1; min-width: 0; height: 48px; object-fit: contain; }
body.register-page .register-captcha__reload { display: grid; place-items: center; flex-shrink: 0; width: 38px; padding: 0; border: 0; border-left: 1px solid #ced4da; color: #495057; background: #e9ecef; cursor: pointer; }
body.register-page .register-captcha__reload:hover { color: #343a40; background: #dee2e6; }
body.register-page .register-form__footer { display: flex; gap: 8px; padding-top: 16px; border-top: 1px solid #dee2e6; }
.register-button { display: inline-flex; flex: 1; align-items: center; justify-content: center; min-height: 38px; padding: 6px 12px; border: 1px solid transparent; border-radius: 4px; font-size: 16px; font-weight: 400; line-height: 1.5; text-decoration: none; cursor: pointer; }
body.register-page .register-button--primary { color: #fff; background: #dc3545; box-shadow: none; }
body.register-page .register-button--primary:hover { color: #fff; background: #c82333; }
body.register-page .register-button--secondary { color: #fff; background: #343a40; }
body.register-page .register-button--secondary:hover { color: #fff; background: #23272b; }
.register-card__signin { margin-top: 16px; text-align: center; color: #6c757d; font-size: 14px; }
body.register-page .register-card__signin a { color: #007bff; text-decoration: none; }
body.register-page .register-card__signin a:hover { color: #0056b3; text-decoration: underline; }
.register-page a:focus-visible, .register-page button:focus-visible { outline: 3px solid #dc3545; outline-offset: 3px; }
@media (max-width: 520px) {
    .register-form__grid--two, .register-form__grid--address, .register-captcha { grid-template-columns: minmax(0, 1fr); }
    .register-captcha__image-wrap { width: 180px; max-width: 100%; }
    .register-form__footer { flex-direction: column-reverse; }
}