refactor: update layout and styling of site dashboard buttons and date range selector for improved usability

app/sites/[id]/page.tsx

@@ -259,16 +259,19 @@ export default function SiteDashboardPage() {
             </button>
           </div>
 
-            <div className="flex gap-2">
-              <button
+            <div className="flex items-center gap-2">
+              <div className="flex items-center gap-2">
+                <Button
                   onClick={() => setIsExportModalOpen(true)}
-                className="hidden md:flex items-center gap-2 px-3 py-2 bg-white dark:bg-neutral-900 border border-neutral-200 dark:border-neutral-800 rounded-lg text-sm text-neutral-600 dark:text-neutral-400 hover:text-brand-orange dark:hover:text-brand-orange transition-colors"
+                  variant="primary"
+                  className="hidden md:inline-flex gap-2 text-sm"
                 >
                   <DownloadIcon className="w-4 h-4" />
-                <span>Export</span>
-              </button>
-
+                  Export
+                </Button>
                 <Select
+                  variant="input"
+                  className="min-w-[140px]"
                   value={
                     dateRange.start === new Date().toISOString().split('T')[0] && dateRange.end === new Date().toISOString().split('T')[0]
                       ? 'today'
@@ -306,16 +309,22 @@ export default function SiteDashboardPage() {
                     { value: 'custom', label: 'Custom' },
                   ]}
                 />
+              </div>
+              <div
+                className="h-6 w-px bg-neutral-200 dark:bg-neutral-700 flex-shrink-0"
+                aria-hidden
+              />
+              <div className="flex items-center gap-1">
                 <Button
                   onClick={() => router.push(`/sites/${siteId}/uptime`)}
-              variant="secondary"
+                  variant="ghost"
                   className="text-sm"
                 >
                   Uptime
                 </Button>
                 <Button
                   onClick={() => router.push(`/sites/${siteId}/funnels`)}
-              variant="secondary"
+                  variant="ghost"
                   className="text-sm"
                 >
                   Funnels
@@ -323,7 +332,7 @@ export default function SiteDashboardPage() {
                 {canEdit && (
                   <Button
                     onClick={() => router.push(`/sites/${siteId}/settings`)}
-              variant="secondary"
+                    variant="ghost"
                     className="text-sm"
                   >
                     Settings
@@ -332,6 +341,7 @@ export default function SiteDashboardPage() {
               </div>
             </div>
         </div>
+      </div>
 
       {/* Advanced Chart with Integrated Stats */}
       <div className="mb-8">