.field-validation-error, .validation-summary-errors {
    color: #a33;
    font-size: .82rem
}

.input-validation-error {
    border-color: #a33 !important
}

.honeypot {
    position: absolute !important;
    left: -10000px !important;
    width: 1px !important;
    height: 1px !important;
    overflow: hidden !important
}

.site-notice {
    position: fixed;
    right: 20px;
    top: 92px;
    z-index: 1200;
    max-width: 420px;
    padding: 14px 18px;
    border-radius: 12px;
    box-shadow: 0 12px 35px rgba(0,0,0,.18);
    background: #fff
}

    .site-notice.success {
        border-left: 4px solid #2d7a62
    }

    .site-notice.error {
        border-left: 4px solid #b9483b
    }

.api-form.is-loading button[type=submit] {
    opacity: .65;
    pointer-events: none
}

.form-message.show {
    display: block
}

.form-message.error {
    color: #a33
}

.form-message.success {
    color: #2d7a62
}

.phone-row {
    display: grid;
    grid-template-columns: 90px 1fr;
    gap: 8px
}

.agent-portrait img {
    width: 100%;
    height: 100%;
    object-fit: cover
}

.content-unavailable {
    border: 1px solid var(--line);
    border-radius: 24px;
    padding: 32px;
    background: var(--surface)
}

.pagination {
    display: flex;
    gap: 8px;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    margin-top: 30px
}

    .pagination a, .pagination span {
        min-width: 42px;
        height: 42px;
        display: grid;
        place-items: center;
        border: 1px solid var(--line);
        border-radius: 10px
    }

    .pagination .active {
        background: var(--green);
        color: #fff;
        border-color: var(--green)
    }

.property-grid > .empty-state {
    grid-column: 1/-1
}

.saved-loading {
    padding: 50px;
    text-align: center
}

.safe-prose p {
    margin-bottom: 1.2em
}

.safe-prose {
    max-width: 800px
}

.missing-capability {
    border-left: 4px solid var(--gold);
    background: #fff8e8;
    padding: 18px 20px;
    border-radius: 10px;
    margin: 20px 0
}

.field.full {
    grid-column: 1/-1
}

@media(max-width:640px) {
    .site-notice {
        left: 12px;
        right: 12px;
        top: 80px
    }

    .phone-row {
        grid-template-columns: 80px 1fr
    }
}
/* Prevent an off-canvas mobile drawer from contributing to document width. */
html {
    overflow-x: hidden
}

@supports (overflow:clip) {
    html {
        overflow-x: clip
    }
}