import { Container } from '@/components/Container/Container'
import { Title } from '@/components/Title/Title'
import { Row } from '@/components/Flex/Row'
import styles from "./styles.module.scss"

export const DonationForm = () => {
  return (
    <>
      <Container>
        <Title
          title={'Ihre Hilfe kommt an'}
          fontStyle={"sans-serif"}
          size={'md'}
        />
      </Container>

      <div className={styles.container}>
        <div className={styles.col1}>
          <p>
            Mit Ihrer Spende leisten Sie einen wertvollen Beitrag für unsere Arbeit. Ihr Engagement ermöglicht es uns,
            Menschen in Not zu helfen und ihnen eine bessere Zukunft zu ermöglichen.
          </p>

          <p>
            Spenden Sie jetzt und unterstützen Sie unsere Mission! Nutzen Sie dazu einfach das Spendenformular nebenan oder überweisen Sie direkt auf unser Konto:<br/>
          </p>
          <p>
            <strong>Konto:</strong> Pfarrei Heilige Drei Könige<br/>
            <strong>IBAN:</strong> DE1237 0601 9360 0044 9006
          </p>

          <p>
            Jede Spende, egal ob groß oder klein, macht einen Unterschied. Von Herzen danken wir Ihnen für Ihre Unterstützung!
          </p>
        </div>
        <div className={styles.col2}>
          <iframe
            className={styles.iframe}
            scrolling="no"
            src="https://spenden.tools/37111/Formular/SpendenFormularId/318?KostenstelleId=0"
            width="100%"
            height="800px">
          </iframe>
        </div>
      </div>
    </>
  )
}