/* Flow Form — Frontend Styles */
.ff-form, .ff-form * {
    box-sizing: border-box;
}
.ff-form-container { max-width: 600px; margin: 0 auto; }
.ff-form .ff-form-fields {
    display: flex;
    flex-direction: column;
    gap: 18px;
    width: 100%;
}
.ff-form .ff-form-row {
    display: flex;
    flex-wrap: nowrap;
    align-items: flex-start;
    column-gap: 12px;
    width: 100%;
    box-sizing: border-box;
}
.ff-form .ff-form-row-cell {
    min-width: 0;
}
.ff-form .ff-form-fields > .ff-page-break {
    width: 100%;
    margin: 0;
}
.ff-form .ff-label { display: block; font-size: 14px; font-weight: 500; color: #1d2327; margin-bottom: 5px; }
.ff-form .ff-required { color: #d63638; }
.ff-form .ff-field-desc { font-size: 13px; color: #8c8f94; margin: 0 0 5px; }
.ff-form input[type="text"], .ff-form input[type="email"], .ff-form input[type="tel"],
.ff-form input[type="url"], .ff-form input[type="number"], .ff-form input[type="date"],
.ff-form input[type="time"], .ff-form textarea, .ff-form select {
    width: 100%; border: 1px solid #dcdcde; border-radius: 3px;
    padding: 9px 12px; font-size: 14px; color: #1d2327; background: #fff;
    transition: border-color .15s, box-shadow .15s;
}
.ff-form input:focus, .ff-form textarea:focus, .ff-form select:focus {
    outline: none; border-color: #1a3c5e; box-shadow: 0 0 0 2px rgba(26,60,94,.1);
}
.ff-form textarea { min-height: 100px; resize: vertical; }
.ff-form .ff-radio-label, .ff-form .ff-checkbox-label { display: flex; align-items: center; gap: 8px; font-size: 14px; color: #1d2327; margin-bottom: 5px; cursor: pointer; }
.ff-form .ff-consent-label { font-size: 13px; }
.ff-form .ff-name-fields { display: flex; gap: 10px; }
.ff-form .ff-name-fields input { flex: 1; }
.ff-form .ff-address-row { display: flex; gap: 8px; margin-top: 8px; }
.ff-form .ff-address-row input { flex: 1; }
.ff-form .ff-form-section { border-top: 2px solid #1a3c5e; padding-top: 10px; margin-bottom: 0; }
.ff-form .ff-form-section h3 { font-size: 15px; font-weight: 600; margin: 0 0 4px; }
.ff-form .ff-form-html { margin-bottom: 0; }
.ff-form .ff-page-break { border: none; border-top: 1px dashed #dcdcde; margin: 24px 0; }
.ff-form .ff-captcha-placeholder { background: #f6f7f7; border: 1px solid #dcdcde; border-radius: 3px; padding: 12px; font-size: 13px; color: #8c8f94; }
.ff-form .ff-product-field { display: flex; justify-content: space-between; align-items: center; padding: 10px 12px; border: 1px solid #dcdcde; border-radius: 3px; font-size: 14px; background: #f9f9f9; }
.ff-form .ff-product-price { font-weight: 600; color: #1a3c5e; }
.ff-form .ff-total-field input { background: #f9f9f9; font-weight: 600; }
.ff-form .ff-list-add-btn { background: none; border: none; color: #1a3c5e; font-size: 13px; cursor: pointer; padding: 4px 0; margin-top: 4px; }
.ff-form .ff-form-footer { margin-top: 24px; }
.ff-form .ff-submit-button { background: #1a3c5e; color: #fff; border: none; border-radius: 3px; padding: 11px 28px; font-size: 15px; font-weight: 500; cursor: pointer; transition: background .15s; }
.ff-form .ff-submit-button:hover { background: #143050; }
.ff-form .ff-submit-button:disabled { opacity: .6; cursor: not-allowed; }
.ff-form-message { padding: 14px 16px; border-radius: 4px; font-size: 14px; margin-top: 12px; }
.ff-form-message.success { background: #edfaef; border-left: 4px solid #00a32a; color: #1a4a1f; }
.ff-form-message.error   { background: #fce8e8; border-left: 4px solid #d63638; color: #6a1212; }
