import { Tabs } from "expo-router";
import { useTheme } from "../../components/theme";

export default function TabLayout() {
  const theme = useTheme();

  return (
    <Tabs
      screenOptions={{
        headerShown: false,
        tabBarActiveTintColor: theme.colors.primary,
        tabBarInactiveTintColor: theme.colors.textTertiary,
        tabBarStyle: {
          backgroundColor: theme.colors.card,
          borderTopColor: theme.colors.border,
        },
        tabBarLabelStyle: { fontSize: 11 },
      }}
    >
      <Tabs.Screen
        name="(home)"
        options={{
          title: "Почетна",
          tabBarIcon: ({ color, size }) => undefined,
        }}
      />
      <Tabs.Screen
        name="(explore)"
        options={{
          title: "Пребарување",
          tabBarIcon: ({ color, size }) => undefined,
        }}
      />
      <Tabs.Screen
        name="(posts)"
        options={{
          title: "Побарувања",
          tabBarIcon: ({ color, size }) => undefined,
        }}
      />
      <Tabs.Screen
        name="(chat)"
        options={{
          title: "Чат",
          tabBarIcon: ({ color, size }) => undefined,
        }}
      />
      <Tabs.Screen
        name="(profile)"
        options={{
          title: "Профил",
          tabBarIcon: ({ color, size }) => undefined,
        }}
      />
    </Tabs>
  );
}