'use client';
import Footer from '@/components/Footer';
import MobileMenu from '@/components/MobileMenu';
import Nav from '@/components/Nav';
import MainProvider from '@/providers/MainProvider';
import localFont from 'next/font/local';
import React, { PropsWithChildren } from 'react';

const roboto = localFont({
  src: [
    {
      path: '../../fonts/roboto/Roboto-Light.ttf',
      weight: '300',
      style: 'normal',
    },
    {
      path: '../../fonts/roboto/Roboto-Regular.ttf',
      weight: '400',
      style: 'normal',
    },
    {
      path: '../../fonts/roboto/Roboto-Bold.ttf',
      weight: '700',
      style: 'normal',
    },
  ],
  variable: '--font-roboto',
});

const layout = ({ children }: PropsWithChildren) => {
  return (
    <MainProvider>
      <div className={`dark:bg-black transition-all h-full ${roboto.className}`}>
        <h1 className="hidden">Turkmen TV</h1>
        <Nav />
        <main className="mt-[32px] md:mt-[64px] mb-[64px] md:mb-[128px] w-full">
          <div className="container">{children}</div>
        </main>
        <Footer />
        <MobileMenu />
      </div>
    </MainProvider>
  );
};

export default layout;