import {
  IonBackButton,
  IonButtons,
  IonCard,
  IonCardContent,
  IonCardHeader,
  IonCardSubtitle,
  IonCardTitle,
  IonContent,
  IonHeader,
  IonPage,
  IonTitle,
  IonToolbar,
} from "@ionic/react";
import ButtonComponent from "../../components/ButtonComponent"

const ApoyoPage: React.FC = () => {
  let body= "Es de mi interés ponerme en contacto con ustedes para poder coordinar el uso de su servicio de Seguridad y Apoyo. También me gustaría saber donde están actualmente ubicados."
  return (
    <IonPage>
      <IonHeader>
        <IonToolbar>
          <IonButtons slot="start">
            <IonBackButton />
          </IonButtons>
          <IonTitle>Servicios</IonTitle>
        </IonToolbar>
      </IonHeader>
      <IonContent fullscreen>
        <IonCard>
          <IonCardHeader>
            <IonCardTitle>Seguridad y Apoyo</IonCardTitle>
            <IonCardSubtitle></IonCardSubtitle>
          </IonCardHeader>

          <IonCardContent>
            Los parientes custodios pueden permanecer en un área de espera
            cómoda y segura en la cual se le brindarán servicios de  apoyo
            durante su espera. 
          </IonCardContent>
        </IonCard>
        <ButtonComponent body={body}></ButtonComponent>
      </IonContent>
    </IonPage>
  );
};

export default ApoyoPage;