.beta-form-notice { margin: 16px 0; padding: 12px 16px; border: 1px solid #e5e7eb; border-radius: 6px; background: #f8f8f8; color: #333; font-size: 16px; line-height: 1.75; }
.beta-form-status { padding: 16px; border: 1px solid #d1d5db; border-radius: 6px; background: #f3f4f6; color: #262626; font-size: 16px; line-height: 1.75; }
.beta-form-status[data-state="error"] { border-color: #b42318; background: #fff5f4; }
.beta-form-status[data-state="success"] { border-color: #437345; background: #f1f8f1; }
.beta-form-status ul { margin: 8px 0 0; padding-left: 24px; list-style: disc; }
.beta-form-status a { color: #a8022b; text-decoration: underline; text-underline-offset: 3px; }
.beta-field-error { margin: 6px 0 0; color: #b42318; font-size: 16px; line-height: 1.75; }
form[data-native-form] [aria-invalid="true"] { border-color: #b42318; }
form[data-native-form][aria-busy="true"] { cursor: progress; }
form[data-native-form] .radio > div:focus-within { outline: 3px solid #cc0033; outline-offset: -3px; }
.beta-native-choice { width: 100%; min-height: 48px; padding: 10px 12px; border: 1px solid #d1d5db; border-radius: 6px; background: #fff; color: #333; font: inherit; }
.beta-added-fields { display: grid; grid-template-columns: minmax(0, 1fr); gap: 16px; }
.beta-added-field { display: flex; min-width: 0; flex-direction: column; gap: 8px; }
.beta-added-field label { color: #333; font-size: 16px; font-weight: 500; }
.beta-added-field input, .beta-added-field select { width: 100%; min-height: 48px; padding: 10px 12px; border: 1px solid #d1d5db; border-radius: 6px; background: #fff; color: #333; font: inherit; }
.beta-file-details { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin-top: 8px; font-size: 16px; }
.beta-file-details img { width: 72px; height: 72px; border-radius: 4px; object-fit: cover; }
.beta-file-details button { padding: 6px 10px; border: 1px solid #d1d5db; border-radius: 4px; background: #fff; color: #a8022b; font: inherit; }
.beta-file-details button:hover { background: #f3f4f6; }
.beta-form-dialog { width: min(92vw, 900px); max-width: 900px; max-height: 88vh; padding: 20px; overflow-y: auto; border: 0; border-radius: 8px; }
.beta-form-dialog::backdrop { background: #0009; }
.beta-form-dialog-header { display: flex; align-items: start; gap: 16px; margin-bottom: 16px; }
.beta-form-dialog-header h2 { flex: 1; margin: 0; font-size: 24px; line-height: 1.3; }
.beta-form-dialog-header button { min-height: 44px; margin: 0; padding: 8px 12px; border-radius: 4px; background: #cc0033; color: #fff; }
.beta-form-dialog > img { display: block; max-width: 100%; max-height: 68vh; margin: 0 auto; object-fit: contain; }
.beta-ral-search { width: 100%; min-height: 48px; margin-bottom: 16px; padding: 10px 12px; border: 1px solid #d1d5db; border-radius: 4px; font: inherit; }
.beta-ral-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.beta-ral-grid button { display: flex; min-width: 0; align-items: center; gap: 8px; margin: 0; padding: 10px; border: 1px solid #d1d5db; border-radius: 4px; background: #fff; color: #333; text-align: left; }
.beta-ral-grid button:hover { border-color: #cc0033; background: #fafafa; }
.beta-ral-grid .beta-colour-swatch { width: 32px; height: 32px; flex: 0 0 32px; border: 1px solid #9ca3af; border-radius: 50%; }
.beta-ral-grid strong, .beta-ral-grid small { display: block; overflow-wrap: anywhere; font-size: 14px; line-height: 1.4; }
.beta-promotion-motif { margin: 12px; }
.beta-form-help { color: #525252; font-size: 16px; line-height: 1.75; }
@media (min-width: 640px) { .beta-added-fields { grid-template-columns: repeat(2, minmax(0, 1fr)); } .beta-ral-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); } }