/**
 * psm_forms — storefront form styling.
 * Loaded only on pages where a form is actually rendered (see FrontAssetsSubscriber).
 */
.psm-form { margin: 0 0 1rem; }

/* Layout rows/columns authored in the form builder. The merchant blob carries
   <div class="psm-row"><div class="psm-col psm-col-6">…</div>…</div>; these rules
   lay the columns out as a 12-grid that stacks on small screens. */
.psm-form .psm-row { display: flex; flex-wrap: wrap; margin-left: -8px; margin-right: -8px; }
.psm-form .psm-col { padding-left: 8px; padding-right: 8px; flex: 0 0 100%; max-width: 100%; }
.psm-form .psm-col-1 { flex: 0 0 8.333%; max-width: 8.333%; }
.psm-form .psm-col-2 { flex: 0 0 16.666%; max-width: 16.666%; }
.psm-form .psm-col-3 { flex: 0 0 25%; max-width: 25%; }
.psm-form .psm-col-4 { flex: 0 0 33.333%; max-width: 33.333%; }
.psm-form .psm-col-5 { flex: 0 0 41.666%; max-width: 41.666%; }
.psm-form .psm-col-6 { flex: 0 0 50%; max-width: 50%; }
.psm-form .psm-col-7 { flex: 0 0 58.333%; max-width: 58.333%; }
.psm-form .psm-col-8 { flex: 0 0 66.666%; max-width: 66.666%; }
.psm-form .psm-col-9 { flex: 0 0 75%; max-width: 75%; }
.psm-form .psm-col-10 { flex: 0 0 83.333%; max-width: 83.333%; }
.psm-form .psm-col-11 { flex: 0 0 91.666%; max-width: 91.666%; }
.psm-form .psm-col-12 { flex: 0 0 100%; max-width: 100%; }
@media (max-width: 768px) {
    .psm-form .psm-col { flex: 0 0 100% !important; max-width: 100% !important; }
}

.psm-form .psm-form-field { margin-bottom: 1rem; }
.psm-form .psm-form-label { display: block; font-weight: 600; margin-bottom: .25rem; }
.psm-form .psm-form-error { color: #c00; font-size: .875em; margin-top: .25rem; }
.psm-form .psm-form-success { color: #18794e; }
.psm-form .psm-required { color: #c00; }
.psm-form .psm-form-hidden { display: none; }
