import { useGenderInfo } from "@/components/pages/Mike/v1/lib/getGenderInfo";
import styles from "./styles.module.css";
import { PropsWithChildren } from "react";
import Header from "../../components/Header";
import Title from "@/components/Title";

interface DiscountLayoutProps {
  title?: string;
}

function DiscountLayout({
  children,
  title,
}: PropsWithChildren<DiscountLayoutProps>) {
  const genderInfo = useGenderInfo();

  return (
    <section
      className={`${styles.page} page`}
      style={{
        backgroundColor: genderInfo?.id === "male" ? "#C0E5FF" : "#C0E5FF",
      }}
    >
      <Header className={styles.header} />
      {title && (
        <Title variant="h2" className={styles.title}>
          {title}
        </Title>
      )}

      {children}
    </section>
  );
}

export default DiscountLayout;
