/*
 * public/css/partials/profile.css
 *
 * The account panels: `profile-address` and `profile-change-password`
 * (tasks/PLAN_05_FRONTEND_LOGIN_260918.md steps F and G) and `register`
 * (tasks/PLAN_07_REGISTRATION_AND_ACTIVATION_260918.md step C).
 *
 * ONE FILE FOR ALL THREE, because they are the same panel — the registration
 * form IS the address form with an e-mail, two passwords and a live
 * account_type, and it carried the identical inline styles in the old project.
 * Steps G and C link nothing of their own; `register` extends this file rather
 * than starting public/css/partials/register.css, which would be a second copy
 * of the same six rules.
 *
 * WHY THESE RULES ARE HERE AND NOT IN THE PARTIALS. The old project's
 * partial.profile-address1-form.phtml and partial.profile-change-password.phtml
 * carried them as inline `style` attributes — the #F1F1F1 panel background, the
 * button margins, the select padding and border, the error box's red left
 * edge. Plan 04 decision 6 moves an element type's CSS out of its partial and
 * into public/css/partials/, which section.styles.phtml globs AFTER
 * custom.min.css so a type can override the theme.
 *
 * Everything else these two partials use — container, col-md-*, section-heading,
 * contact-form-box, butn, margin-30px-top — is already in css/styles-5.css and
 * css/plugins/default.css.
 */

/* The panel. Grey only in the edit view, exactly as the old form had it: the
   read view sat on the page background and the form announced itself. */
.profile-panel--edit {
    background-color: #F1F1F1;
}

/* The address block in the read view. The old markup was a bare <div> with
   <br>s; this only gives it the line height the surrounding type has. */
.profile-address {
    line-height: 1.8;
}

/* The old inline `style="padding: 16px; border: 2px solid #E5E5E5;"` on all
   three <select>s. */
.profile-select {
    padding: 16px;
    border: 2px solid #E5E5E5;
    background-color: #FFFFFF;
}

/* `vat` is shown and not editable — step F's docblock says why. It has to LOOK
   uneditable, or it is the old form's trap with better manners. */
.profile-readonly {
    background-color: #E9E9E9;
    color: #6E6E6E;
    cursor: not-allowed;
}

/* The old inline `style="margin-top: 20px; margin-right: 2rem;"` on the save
   button, and the same top margin on the read view's Bearbeiten link. */
.profile-butn {
    margin-top: 20px;
    margin-right: 2rem;
}

.profile-cancel {
    white-space: nowrap;
}

/* The password form's two fields sit in a narrow column; the old file gave them
   col-md-6 and nothing else. */
.profile-form label {
    display: block;
    margin-bottom: .25rem;
}

.profile-form .row + hr {
    margin: 1.5rem 0;
}

/* The registration form's password rule line, under the two password fields.
   It is the existing form::password_rule token — the same words the old form
   showed — and it needs to read as guidance rather than as an error. */
.profile-form small {
    display: block;
    margin-top: .35rem;
    color: #6E6E6E;
}

/* ---- Field-level errors — tasks/PLAN_12_FORM_VALIDATION_260923.md step A4.
   The registration and profile-address forms re-render themselves through
   htmx on a refusal (obform_* in lib/helpers/obform_helper.php): one message
   directly under each invalid field, a red border on the field itself, and a
   short line at the top of the form. #D00018 is the flash strip's error colour
   (section.flash.phtml), so a refusal reads the same wherever it appears. */
.form-field-error {
    margin: -10px 0 15px;   /* the theme gives every input margin-bottom: 15px */
    font-size: .85em;
    line-height: 1.4;
    color: #D00018;
}

.form-field-error a {
    color: #D00018;
    text-decoration: underline;
    margin-right: 1rem;
}

/* The links under the "existing account" message sit on their own line. */
.form-field-error--links {
    margin-top: -10px;
}

.profile-form [aria-invalid="true"] {
    border-color: #D00018;
}

.form-notice {
    margin: 0 0 1.25rem;
    padding: .6rem .9rem;
    border-left: 3px solid #D00018;
    background-color: #FFFFFF;
    color: #D00018;
    font-weight: bold;
}

/* ---- The registration's success page — /{lang}/register?msg=register_check_mail.
   partial.register.phtml renders ONLY this panel there (no heading, no form),
   tall enough to fill the screen between the header and the footer, so the
   one sentence the visitor has to read is the whole page. Green #006600 is
   the flash strip's success colour (section.flash.phtml). */
.register-done {
    display: flex;
    align-items: center;
    min-height: 65vh;
    padding: 4rem 0;
    background-color: #F1F1F1;
}

.register-done__message {
    max-width: 40rem;
    margin: 0 auto;
    font-size: 1.5rem;
    line-height: 1.5;
    font-weight: bold;
    text-align: center;
    color: #006600;
}

/* A hint under a field that is NOT an error: the profile form's readonly VAT
   ID when its stored value has no valid structure (Lib\Auth\VatId). It never
   blocks a save, so it must not look like .form-field-error. */
.form-field-hint {
    margin: -10px 0 15px;   /* the theme gives every input margin-bottom: 15px */
    font-size: .85em;
    line-height: 1.4;
    color: #8A6100;
}