/**
 * ANNOTATED COPY — every line explained
 * Source: src/app/layout.tsx
 * NOT used by the app — read this to learn how the real file works
 */
// Type-only import — erased at compile time; no JavaScript bundle cost
import type { Metadata } from 'next';
// Self-hosted Google fonts — better performance than external CSS
import { Inter, Playfair_Display, Noto_Nastaliq_Urdu } from 'next/font/google';
// Import project module (@/ alias = src/ folder in tsconfig)
import LanguageBanner from '@/components/layout/LanguageBanner';
// Import project module (@/ alias = src/ folder in tsconfig)
import Header from '@/components/layout/Header';
// Import project module (@/ alias = src/ folder in tsconfig)
import Footer from '@/components/layout/Footer';
// Import project module (@/ alias = src/ folder in tsconfig)
import LocaleAttributes from '@/components/layout/LocaleAttributes';
// Import project module (@/ alias = src/ folder in tsconfig)
import { SITE_NAME } from '@/lib/constants';
// Import from a relative file in the same project
import './globals.css';
// (blank line — separates logical blocks for readability)
// Line 10: const inter = Inter({
const inter = Inter({
  // Property or array item — trailing comma allowed in TypeScript
  subsets: ['latin'],
  // Property or array item — trailing comma allowed in TypeScript
  variable: '--font-inter',
  // Property or array item — trailing comma allowed in TypeScript
  display: 'swap',
// Closing brace — end of block (function, if, object, JSX)
});
// (blank line — separates logical blocks for readability)
// Line 16: const playfair = Playfair_Display({
const playfair = Playfair_Display({
  // Property or array item — trailing comma allowed in TypeScript
  subsets: ['latin'],
  // Property or array item — trailing comma allowed in TypeScript
  variable: '--font-playfair',
  // Property or array item — trailing comma allowed in TypeScript
  display: 'swap',
// Closing brace — end of block (function, if, object, JSX)
});
// (blank line — separates logical blocks for readability)
// Line 22: const notoUrdu = Noto_Nastaliq_Urdu({
const notoUrdu = Noto_Nastaliq_Urdu({
  // Property or array item — trailing comma allowed in TypeScript
  subsets: ['arabic'],
  // Property or array item — trailing comma allowed in TypeScript
  variable: '--font-urdu',
  // Property or array item — trailing comma allowed in TypeScript
  weight: ['400', '500', '600', '700'],
  // Property or array item — trailing comma allowed in TypeScript
  display: 'swap',
// Closing brace — end of block (function, if, object, JSX)
});
// (blank line — separates logical blocks for readability)
// Line 29: const siteDescription =
const siteDescription =
  // Line 30: 'Premium 100% Halal meat delivery. Fresh and frozen chick...
  'Premium 100% Halal meat delivery. Fresh and frozen chicken, beef, lamb, and fish — customized to your preference and delivered to your door.';
// (blank line — separates logical blocks for readability)
// Named export constant — shared config/data imported elsewhere
export const viewport = {
  // Property or array item — trailing comma allowed in TypeScript
  themeColor: '#8B1F1F',
// Closing brace — end of block (function, if, object, JSX)
};
// (blank line — separates logical blocks for readability)
// Named export constant — shared config/data imported elsewhere
export const metadata: Metadata = {
  // Line 37: title: {
  title: {
    // Switch default — fallback when no case matches
    default: `${SITE_NAME} — Premium Halal Meat Delivery`,
    // Property or array item — trailing comma allowed in TypeScript
    template: `%s | ${SITE_NAME}`,
  // Closing brace — end of block (function, if, object, JSX)
  },
  // Property or array item — trailing comma allowed in TypeScript
  description: siteDescription,
  // Line 42: keywords: [
  keywords: [
    // Property or array item — trailing comma allowed in TypeScript
    'halal meat',
    // Property or array item — trailing comma allowed in TypeScript
    'halal chicken',
    // Property or array item — trailing comma allowed in TypeScript
    'halal beef',
    // Property or array item — trailing comma allowed in TypeScript
    'halal lamb',
    // Property or array item — trailing comma allowed in TypeScript
    'meat delivery',
    // Property or array item — trailing comma allowed in TypeScript
    'fresh meat',
    // Property or array item — trailing comma allowed in TypeScript
    'Kött Gård',
    // Property or array item — trailing comma allowed in TypeScript
    'kottgard',
  // End of array literal
  ],
  // Line 52: openGraph: {
  openGraph: {
    // Property or array item — trailing comma allowed in TypeScript
    title: `${SITE_NAME} — Premium Halal Meat Delivery`,
    // Property or array item — trailing comma allowed in TypeScript
    description: siteDescription,
    // Property or array item — trailing comma allowed in TypeScript
    type: 'website',
    // Property or array item — trailing comma allowed in TypeScript
    locale: 'sv_SE',
    // Property or array item — trailing comma allowed in TypeScript
    siteName: SITE_NAME,
  // Closing brace — end of block (function, if, object, JSX)
  },
  // Line 59: robots: {
  robots: {
    // Property or array item — trailing comma allowed in TypeScript
    index: true,
    // Property or array item — trailing comma allowed in TypeScript
    follow: true,
  // Closing brace — end of block (function, if, object, JSX)
  },
// Closing brace — end of block (function, if, object, JSX)
};
// (blank line — separates logical blocks for readability)
// Default export — main component/page Next.js or other files import
export default function RootLayout({
  // Property or array item — trailing comma allowed in TypeScript
  children,
// Closing brace — end of block (function, if, object, JSX)
}: {
  // Line 68: children: React.ReactNode;
  children: React.ReactNode;
// Closing brace — end of block (function, if, object, JSX)
}) {
  // Return JSX — describes UI tree React renders to the DOM
  return (
    // JSX element — HTML-like tag becomes React component in browser
    <html
      // Line 72: lang="sv"
      lang="sv"
      // Line 73: dir="ltr"
      dir="ltr"
      // Tailwind CSS utility classes — styling (colors, spacing, layout)
      className={`${inter.variable} ${playfair.variable} ${notoUrdu.variable}`}
      // Line 75: suppressHydrationWarning
      suppressHydrationWarning
    // Line 76: >
    >
      // JSX element — HTML-like tag becomes React component in browser
      <body className="flex min-h-screen flex-col font-sans">
        // JSX element — HTML-like tag becomes React component in browser
        <LocaleAttributes />
        // JSX element — HTML-like tag becomes React component in browser
        <div className="sticky top-0 z-50">
          // JSX element — HTML-like tag becomes React component in browser
          <LanguageBanner />
          // JSX element — HTML-like tag becomes React component in browser
          <Header />
        // JSX element — HTML-like tag becomes React component in browser
        </div>
        // JSX element — HTML-like tag becomes React component in browser
        <main className="flex-1">{children}</main>
        // JSX element — HTML-like tag becomes React component in browser
        <Footer />
      // JSX element — HTML-like tag becomes React component in browser
      </body>
    // JSX element — HTML-like tag becomes React component in browser
    </html>
  // Line 87: );
  );
// Closing brace — end of block (function, if, object, JSX)
}
