Hide scrollbars on expense tab strips

apps/frontend/src/features/expenses/ExpensesPage.tsx

@@ -17,7 +17,7 @@ function ExpensesPageInner() {
     <div className="space-y-4">
       <h1 className="text-2xl font-semibold text-balance">Gastos</h1>
 
-      <div className="flex gap-1 overflow-x-auto border-b">
+      <div className="scrollbar-none flex gap-1 overflow-x-auto border-b">
         {tabs.map((tab) => (
           <button
             key={tab.id}

apps/frontend/src/features/expenses/components/ExpensesTabContent.tsx

@@ -65,7 +65,7 @@ export function ExpensesTabContent() {
   return (
     <div className="space-y-4">
       <div className="space-y-3 sm:flex sm:flex-wrap sm:items-center sm:justify-between sm:gap-2 sm:space-y-0">
-        <div className="flex gap-1 overflow-x-auto pb-1 sm:pb-0">
+        <div className="scrollbar-none flex gap-1 overflow-x-auto pb-1 sm:pb-0">
           {filters.map((f) => (
             <Button
               key={f.value}

apps/frontend/src/index.css

@@ -136,6 +136,15 @@
   animation: loading-bar 1.5s ease-in-out infinite;
 }
 
+.scrollbar-none {
+  -ms-overflow-style: none;
+  scrollbar-width: none;
+}
+
+.scrollbar-none::-webkit-scrollbar {
+  display: none;
+}
+
 * {
   border-color: var(--border);
 }