Adopt Tamagui defaults for tabs and filters

resources/js/admin/mobile/components/Primitives.tsx

@@ -434,8 +434,6 @@ export function ContentTabs({
   tabs: { value: string; label: string; content: React.ReactNode }[];
   header?: React.ReactNode;
 }) {
-  const { border, muted, primary } = useAdminTheme();
-
   return (
     <Tabs
       defaultValue={value}
@@ -445,27 +443,21 @@ export function ContentTabs({
       flexDirection="column"
       borderRadius="$4"
       borderWidth={1}
-      borderColor={border}
+      borderColor="$borderColor"
       overflow="hidden"
     >
-      <Tabs.List separator={<Separator vertical />} disablePassBorderRadius="bottom" backgroundColor="$surface">
+      <Tabs.List separator={<Separator vertical />} disablePassBorderRadius="bottom">
         {tabs.map((tab) => (
           <Tabs.Tab
             key={tab.value}
             value={tab.value}
             flex={1}
-            unstyled
-            paddingVertical="$3"
+            paddingVertical="$2.5"
+            paddingHorizontal="$3"
             alignItems="center"
             justifyContent="center"
-            backgroundColor={value === tab.value ? primary : 'transparent'}
-            hoverStyle={{ backgroundColor: value === tab.value ? primary : '$backgroundHover' }}
           >
-            <Text
-              fontSize="$sm"
-              fontWeight={value === tab.value ? '700' : '500'}
-              color={value === tab.value ? '#fff' : muted}
-            >
+            <Text fontSize="$sm" fontWeight="600">
               {tab.label}
             </Text>
           </Tabs.Tab>