Fix: Center badge text

src/pages/Designers.tsx

@@ -116,7 +116,7 @@ export default function Designers() {
           
           <div className="flex items-center justify-between">
             <div className="flex flex-wrap items-center gap-1.5 sm:gap-2">
-              <Badge variant="secondary" className="text-sm sm:text-base px-2 py-0.5 sm:px-3 sm:py-1">
+              <Badge variant="secondary" className="flex items-center justify-center text-sm sm:text-base px-2 py-0.5 sm:px-3 sm:py-1 whitespace-nowrap">
                 {filteredCompanies.length} designers
               </Badge>
             </div>

src/pages/Manufacturers.tsx

@@ -135,7 +135,7 @@ export default function Manufacturers() {
           
           <div className="flex items-center justify-between">
             <div className="flex flex-wrap items-center gap-1.5 sm:gap-2">
-              <Badge variant="secondary" className="text-sm sm:text-base px-2 py-0.5 sm:px-3 sm:py-1">
+              <Badge variant="secondary" className="flex items-center justify-center text-sm sm:text-base px-2 py-0.5 sm:px-3 sm:py-1 whitespace-nowrap">
                 {filteredCompanies.length} manufacturers
               </Badge>
             </div>

src/pages/Operators.tsx

@@ -138,11 +138,11 @@ const Operators = () => {
           
           <div className="flex items-center justify-between">
             <div className="flex flex-wrap items-center gap-1.5 sm:gap-2">
-              <Badge variant="secondary" className="text-sm sm:text-base px-2 py-0.5 sm:px-3 sm:py-1">
+              <Badge variant="secondary" className="flex items-center justify-center text-sm sm:text-base px-2 py-0.5 sm:px-3 sm:py-1 whitespace-nowrap">
                 {filteredAndSortedOperators?.length || 0} operators
               </Badge>
               {searchTerm && (
-                <Badge variant="outline" className="text-xs sm:text-sm px-2 py-0.5">
+                <Badge variant="outline" className="flex items-center justify-center text-xs sm:text-sm px-2 py-0.5 whitespace-nowrap">
                   Searching: "{searchTerm}"
                 </Badge>
               )}

src/pages/ParkOwners.tsx

@@ -138,11 +138,11 @@ const ParkOwners = () => {
           
           <div className="flex items-center justify-between">
             <div className="flex flex-wrap items-center gap-1.5 sm:gap-2">
-              <Badge variant="secondary" className="text-sm sm:text-base px-2 py-0.5 sm:px-3 sm:py-1">
+              <Badge variant="secondary" className="flex items-center justify-center text-sm sm:text-base px-2 py-0.5 sm:px-3 sm:py-1 whitespace-nowrap">
                 {filteredAndSortedOwners?.length || 0} property owners
               </Badge>
               {searchTerm && (
-                <Badge variant="outline" className="text-xs sm:text-sm px-2 py-0.5">
+                <Badge variant="outline" className="flex items-center justify-center text-xs sm:text-sm px-2 py-0.5 whitespace-nowrap">
                   Searching: "{searchTerm}"
                 </Badge>
               )}

src/pages/Parks.tsx

@@ -351,13 +351,13 @@ export default function Parks() {
           
           <div className="flex items-center justify-between">
             <div className="flex flex-wrap items-center gap-1.5 sm:gap-2">
-              <Badge variant="secondary" className="text-sm sm:text-base px-2 py-0.5 sm:px-3 sm:py-1">
+              <Badge variant="secondary" className="flex items-center justify-center text-sm sm:text-base px-2 py-0.5 sm:px-3 sm:py-1 whitespace-nowrap">
                 {filteredAndSortedParks.length} parks
               </Badge>
-              <Badge variant="outline" className="text-xs sm:text-sm px-2 py-0.5">
+              <Badge variant="outline" className="flex items-center justify-center text-xs sm:text-sm px-2 py-0.5 whitespace-nowrap">
                 {parks.reduce((sum, park) => sum + (park.ride_count || 0), 0)} total rides
               </Badge>
-              <Badge variant="outline" className="text-xs sm:text-sm px-2 py-0.5 hidden xs:inline-flex sm:inline-flex">
+              <Badge variant="outline" className="flex items-center justify-center text-xs sm:text-sm px-2 py-0.5 whitespace-nowrap hidden xs:inline-flex sm:inline-flex">
                 {parks.reduce((sum, park) => sum + (park.coaster_count || 0), 0)} coasters
               </Badge>
             </div>

src/pages/Rides.tsx

@@ -185,10 +185,10 @@ export default function Rides() {
           
           <div className="flex items-center justify-between">
             <div className="flex flex-wrap items-center gap-1.5 sm:gap-2">
-              <Badge variant="secondary" className="text-sm sm:text-base px-2 py-0.5 sm:px-3 sm:py-1">
+              <Badge variant="secondary" className="flex items-center justify-center text-sm sm:text-base px-2 py-0.5 sm:px-3 sm:py-1 whitespace-nowrap">
                 {filteredRides.length} rides
               </Badge>
-              <Badge variant="outline" className="text-xs sm:text-sm px-2 py-0.5">
+              <Badge variant="outline" className="flex items-center justify-center text-xs sm:text-sm px-2 py-0.5 whitespace-nowrap">
                 {rides.filter(r => r.category === 'roller_coaster').length} coasters
               </Badge>
             </div>