import { useTranslations } from "@/hooks/translations";
import styles from "./styles.module.scss";
import { ELocalesPlacement } from "@/locales";
import Title from "@/components/Title";

function Caution() {
  const { translate } = useTranslations(ELocalesPlacement.PalmistryV1);

  return (
    <div className={styles.container}>
      <img
        className={styles.image}
        src="/smiling-face-with-hearts.webp"
        alt="Love"
      />
      <div className={styles["text-container"]}>
        <Title variant="h4" className={styles.title}>
          {translate("/add-consultant.caution")}
        </Title>
        <p className={styles.text}>
          {translate("/add-consultant.caution_text")}
        </p>
      </div>
    </div>
  );
}

export default Caution;
