/* Form submit feedback — see /assets/js/form-submit.js */
.pb-form-status {
    width: 100%;
    margin: 1rem 0 0;
    padding: 0.85rem 1.1rem;
    border-radius: var(--shape-control, 0);
    border: 1px solid currentColor;
    font-size: clamp(0.9rem, 1.5vw, 1rem);
    line-height: 1.5;
    color: var(--paper-spot-text, currentColor);
}
.pb-form-status[hidden] { display: none; }
.pb-form-status--error { color: currentColor; }
/* Success is carried by the button morph; the text still needs to reach a
   screen reader through the live region, so it is hidden visually only. */
.pb-form-status--sr {
    position: absolute !important;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

.pb-is-busy,
.pb-is-done { pointer-events: none; position: relative; }
/* Kept in the layout, not removed, so the button width never jumps. */
.pb-is-busy .pb-btn-label,
.pb-is-done .pb-btn-label { opacity: 0; }
.pb-btn-spinner {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 1.15rem;
    height: 1.15rem;
    margin: -0.575rem 0 0 -0.575rem;
    opacity: 0;
    border-radius: var(--shape-round);
    border: 2px solid currentColor;
    border-top-color: transparent;
}
.pb-is-busy .pb-btn-spinner {
    opacity: 1;
    animation: pb-btn-spin 0.7s linear infinite;
}
/* Same box redrawn as a check mark, so success needs no extra element. */
.pb-is-done .pb-btn-spinner {
    opacity: 1;
    width: 0.55rem;
    height: 1.05rem;
    margin: -0.6rem 0 0 -0.275rem;
    border-radius: 0;
    border-width: 0 2px 2px 0;
    border-top-color: transparent;
    border-left-color: transparent;
    transform: rotate(45deg);
}
@keyframes pb-btn-spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) {
    .pb-is-busy .pb-btn-spinner { animation-duration: 1.8s; }
}
