/* Étape 5 — Transmission / Avis 15 & transport */

function StepTransmission({ b, bind }) {
  const t = b.transmission;
  const transport = ['smur', 'vsav', 'ambulance'].includes(t.decision);

  return (
    <div className="space-y-5">
      <Card title="Avis médical — SAMU (15)" icon={Phone}>
        <div className="grid gap-4 sm:grid-cols-3">
          <Field label="Heure de l'appel">
            <TimeInput {...bind('transmission.heureAppel')} />
          </Field>
          <Field label="Médecin régulateur">
            <TextInput placeholder="Dr …" {...bind('transmission.medecin')} />
          </Field>
          <Field label="Matricule / identifiant">
            <TextInput {...bind('transmission.matricule')} />
          </Field>
          <Field label="Consignes / avis du régulateur" className="sm:col-span-3">
            <TextArea placeholder="Consignes reçues, n° de dossier SAMU…" {...bind('transmission.avis')} />
          </Field>
        </div>
      </Card>

      <Card title="Décision de régulation" icon={Ambulance}>
        <Segmented options={DECISIONS} size="lg" className="grid sm:grid-cols-2 lg:grid-cols-3" {...bind('transmission.decision')} />
      </Card>

      {transport && (
        <Card title="Destination & horaires" icon={Hospital}>
          <div className="space-y-4">
            <Field label="Centre hospitalier / établissement">
              <TextInput list="hopitaux-list" placeholder="ex : CHU — site Nord" {...bind('transmission.destination')} />
            </Field>
            <Field label="Service">
              <Segmented options={SERVICES} tone="blue" {...bind('transmission.service')} />
            </Field>
            <div className="grid gap-4 sm:grid-cols-2">
              <Field label="Départ des lieux">
                <TimeInput {...bind('transmission.heureDepart')} />
              </Field>
              <Field label="Arrivée à destination">
                <TimeInput {...bind('transmission.heureArrivee')} />
              </Field>
            </div>
          </div>
          <datalist id="hopitaux-list">
            {HOPITAUX.map((h) => (
              <option key={h} value={h} />
            ))}
          </datalist>
        </Card>
      )}

      <Card title="Observations complémentaires" icon={FileText}>
        <TextArea rows={4} placeholder="Effets personnels remis, personne prévenue, difficultés rencontrées…" {...bind('transmission.observations')} />
      </Card>
    </div>
  );
}