Hide the birthday legend when it names a single field

Co-Authored-By: Claude Fable 5.1 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01XBRLomdLK9jF7wU7a8AA6H

frontend/src/components/inputs/ChildBirthdayInput.test.tsx

@@ -113,4 +113,28 @@ describe('ChildBirthdayInput', () => {
     )
     expect(screen.getByTestId('birthday-input-fieldset')).toBeInTheDocument()
   })
+
+  it('hides legend when preschool field is not present and shows it when present', () => {
+    const onBirthDateChange = vi.fn()
+    const onPreschoolStartDateChange = vi.fn()
+
+    // Without preschool field
+    const { rerender } = render(
+      <ChildBirthdayInput
+        birthDate="2024-06-15"
+        onBirthDateChange={onBirthDateChange}
+      />
+    )
+    expect(screen.getByTestId('birthday-legend')).toHaveClass('visually-hidden')
+
+    // With preschool field
+    rerender(
+      <ChildBirthdayInput
+        birthDate="2024-06-15"
+        onBirthDateChange={onBirthDateChange}
+        onPreschoolStartDateChange={onPreschoolStartDateChange}
+      />
+    )
+    expect(screen.getByTestId('birthday-legend')).not.toHaveClass('visually-hidden')
+  })
 })

frontend/src/components/inputs/ChildBirthdayInput.tsx

@@ -36,7 +36,12 @@ export function ChildBirthdayInput({
 
   return (
     <fieldset data-testid="birthday-input-fieldset">
-      <legend data-testid="birthday-legend">{resolvedLabel}</legend>
+      <legend
+        data-testid="birthday-legend"
+        className={!onPreschoolStartDateChange ? 'visually-hidden' : undefined}
+      >
+        {resolvedLabel}
+      </legend>
       <div className="field" data-testid="birth-date-group">
         <label htmlFor="birth-date" className="field__label">
           {t('childBirthdayInput.birthDateLabel')}