/* Patient form page — small additions on top of the site bundle.
   Everything else (inputs, selects, buttons, grid) comes from MyBundle.min.css
   so the page reads as part of the site, not a bolt-on. */

/* Honeypot: off-screen rather than display:none, so bots that skip hidden
   fields still fill it in. Never shown to a person. */
.hp-field {
    position: absolute;
    left: -9999px;
    top: auto;
    width: 1px;
    height: 1px;
    overflow: hidden;
}

/* The theme bundle only styles input[type="text"] and [type="password"]; an
   email/tel/date input drops straight through to the browser default and looks
   nothing like the field beside it. Repeat the theme's own declarations for the
   types this form uses rather than downgrading every field to type="text" and
   losing the mobile keyboards and date picker. */
.patient-form input[type="email"],
.patient-form input[type="tel"],
.patient-form input[type="date"],
.patient-form input[type="number"] {
    background: #f5f5f5;
    border: none;
    width: 100%;
    height: 50px;
    padding-left: 20px;
    font-weight: 500;
    margin-bottom: 24px;
    border-radius: 0;
    -webkit-appearance: none;
    appearance: none;
}

/* Safari/iOS otherwise centres a date input's text and lets it shrink to fit. */
.patient-form input[type="date"] {
    line-height: 50px;
    padding-right: 12px;
}

/* .input-with-label forces every span to display:block, which would drop the
   asterisk onto its own line under the label. */
.patient-form .input-with-label span .required-star {
    display: inline;
    color: #e2574c;
}

.required-star {
    color: #e2574c;
}

/* The theme's .select-option wrapper already carries the caret and border;
   just line it up with the plain inputs beside it. */
.patient-form .input-with-label .select-option {
    margin-bottom: 24px;
}

.patient-form h4 {
    margin-top: 40px;
}

.patient-form h4:first-of-type {
    margin-top: 0;
}

.patient-form-status {
    min-height: 24px;
    margin-bottom: 16px;
    font-weight: 600;
}

.patient-form-status.is-error {
    color: #e2574c;
}

.patient-form-status.is-busy {
    color: #777;
}

.patient-form button[disabled] {
    opacity: 0.55;
    cursor: not-allowed;
}