feat(ui): make dashboard responsive for iPhone and mobile devices

- Add Sheet primitive component for mobile drawers
- Add MobileNav with hamburger menu for dashboard layout
- Hide desktop sidebars on mobile; show mobile header
- Make dashboard header responsive with stacked layout on small screens
- Hide selector text on mobile, show icons only
- Convert fixed-width filters to responsive widths (CFDI, Clientes, Admin, Documentos, Alertas)
- Cap dialog widths to 95vw on mobile (CFDI viewer, Documentos, Reportes, Contribuyentes, Facturación)
- Make calendar grid smaller and use single-letter weekdays on mobile
- Update viewport to include viewport-fit=cover for Samsung safe areas

apps/web/app/(dashboard)/layout.tsx

@@ -9,6 +9,7 @@ import { Sidebar } from '@/components/layouts/sidebar';
 import { TopNav } from '@/components/layouts/topnav';
 import { SidebarCompact } from '@/components/layouts/sidebar-compact';
 import { SidebarFloating } from '@/components/layouts/sidebar-floating';
+import { MobileNav } from '@/components/layouts/mobile-nav';
 import { SubscriptionBanner } from '@/components/subscription-banner';
 import { cn } from '@horux/shared-ui';
 
@@ -45,7 +46,7 @@ export default function DashboardLayout({
   }
 
   // Render layout based on theme
-  const renderNavigation = () => {
+  const renderDesktopNavigation = () => {
     switch (layout) {
       case 'topnav':
         return <TopNav />;
@@ -62,14 +63,14 @@ export default function DashboardLayout({
   const getContentClasses = () => {
     switch (layout) {
       case 'topnav':
-        return 'pt-16'; // Top padding for fixed top nav
+        return 'pt-16 px-4 md:px-6'; // Top padding for fixed top nav
       case 'sidebar-compact':
-        return 'pl-16'; // Small left padding for compact sidebar
+        return 'md:pl-16 px-4 md:px-0'; // Small left padding for compact sidebar on desktop
       case 'sidebar-floating':
-        return 'pl-72 pr-4 py-4'; // Padding for floating sidebar
+        return 'px-4 py-4 md:pl-72 md:pr-4 md:py-4'; // Padding for floating sidebar on desktop
       case 'sidebar-standard':
       default:
-        return 'pl-64'; // Standard sidebar width
+        return 'px-4 md:pl-64 md:px-0'; // Standard sidebar width on desktop
     }
   };
 
@@ -78,8 +79,20 @@ export default function DashboardLayout({
       'min-h-screen bg-background',
       layout === 'sidebar-floating' && 'bg-gradient-to-br from-background via-background to-muted/20'
     )}>
-      {renderNavigation()}
-      <div className={getContentClasses()}>
+      {/* Mobile header with hamburger menu */}
+      <header className="md:hidden fixed top-0 left-0 right-0 z-40 h-14 border-b bg-card px-4 flex items-center justify-between">
+        <MobileNav />
+        <span className="font-bold text-lg">Horux</span>
+        <div className="w-10" />
+      </header>
+
+      {/* Desktop navigation - hidden on mobile */}
+      <div className="hidden md:block">
+        {renderDesktopNavigation()}
+      </div>
+
+      {/* Main content */}
+      <div className={cn('pt-14 md:pt-0', getContentClasses())}>
         <SubscriptionBanner />
         {children}
       </div>