Con los números de preguntas y secciones

components/question-renderer.tsx

@@ -32,6 +32,7 @@ export function QuestionRenderer({
   const error = errors[code]
 
   // A1 (Departamento) renders a combined geo widget that also handles A2 (Ciudad)
+  // Code badges for A1/A2 are rendered inside GeoSelectWidget.
   if (code === 'A1') {
     return (
       <GeoSelectWidget
@@ -47,11 +48,13 @@ export function QuestionRenderer({
   // A2 is rendered inside the GeoSelectWidget above — skip here to avoid duplication
   if (code === 'A2') return null
 
+  const legend = <><span className="q-code">{code} ·</span> {prompt}</>
+
   if (type === 'single_choice' && isArrayOptions(options)) {
     return (
       <RadioGroup
         name={code}
-        legend={prompt}
+        legend={legend}
         options={options}
         value={answers[code] as string | undefined}
         required={required}
@@ -65,7 +68,7 @@ export function QuestionRenderer({
     return (
       <CheckboxGroup
         name={code}
-        legend={prompt}
+        legend={legend}
         options={options}
         value={(answers[code] as string[]) ?? []}
         maxSelect={max_select}
@@ -80,7 +83,7 @@ export function QuestionRenderer({
     return (
       <RatingScale
         name={code}
-        legend={prompt}
+        legend={legend}
         ratingOptions={options}
         value={answers[code] as number | undefined}
         required={required}
@@ -94,7 +97,7 @@ export function QuestionRenderer({
     return (
       <TextShortField
         name={code}
-        label={prompt}
+        label={legend}
         value={(answers[code] as string) ?? ''}
         required={required}
         onChange={(v) => onChange(code, v)}
@@ -107,7 +110,7 @@ export function QuestionRenderer({
     return (
       <TextAreaField
         name={code}
-        label={prompt}
+        label={legend}
         value={(answers[code] as string) ?? ''}
         required={required}
         onChange={(v) => onChange(code, v)}