"use client";
import React, { ReactNode } from "react";

const Background = ({ children }: { children: ReactNode }) => {
  const isDarkMode = (() =>
    typeof window !== "undefined" &&
    window.matchMedia &&
    window.matchMedia("(prefers-color-scheme: dark)").matches)();
  return (
    <div
      className="h-full relative w-full bg-center bg-no-repeat bg-cover bg-fixed min-h-screen"
      style={{
        backgroundImage: isDarkMode
          ? "linear-gradient(rgba(0, 0, 0, 0.7), rgba(135, 80, 156, 0.05)), url(/images/hero.jpg)"
          : "linear-gradient(rgba(255, 255, 255, 0.7), rgba(135, 80, 156, 0.05)), url(/images/hero.jpg)",
      }}
    >
      {children}
    </div>
  );
};

export default Background;