fix: give the calendar, contacts, files and settings sidebar headers the mail header's height

components/calendar/calendar-sidebar-header.tsx

@@ -18,10 +18,8 @@ export function CalendarSidebarHeader({ onCreateEvent, tourTarget = true }: Cale
   const t = useTranslations("calendar");
 
   return (
-    <div
-      className="px-3 border-b border-border flex items-center justify-between flex-shrink-0"
-      style={{ paddingBlock: "var(--density-header-py)" }}
-    >
+    // Same h-14 box as the mail sidebar's account switcher, so the apps line up.
+    <div className="px-3 h-14 border-b border-border flex items-center justify-between flex-shrink-0">
       <span className="text-sm font-semibold truncate">{t("title")}</span>
       <Button
         size="icon"

components/contacts/contacts-sidebar.tsx

@@ -275,7 +275,8 @@ export function ContactsSidebar({
   return (
     <div className={cn("flex flex-col h-full bg-secondary", className)}>
       {/* Header */}
-      <div className="px-3 border-b border-border flex items-center justify-between" style={{ paddingBlock: 'var(--density-header-py)' }}>
+      {/* Same h-14 box as the mail sidebar's account switcher, so the apps line up. */}
+      <div className="px-3 h-14 border-b border-border flex items-center justify-between flex-shrink-0">
         <span className="text-sm font-semibold truncate">{t("title")}</span>
         <div className="relative flex-shrink-0">
           <Button

components/files/files-sidebar.tsx

@@ -258,10 +258,8 @@ export function FilesSidebar({
 
   return (
     <div className="flex flex-col h-full bg-secondary">
-      <div
-        className="px-3 border-b border-border flex items-center justify-between flex-shrink-0"
-        style={{ paddingBlock: "var(--density-header-py)" }}
-      >
+      {/* Same h-14 box as the mail sidebar's account switcher, so the apps line up. */}
+      <div className="px-3 h-14 border-b border-border flex items-center justify-between flex-shrink-0">
         <span className="text-sm font-semibold truncate">{t("title")}</span>
         {canCreate && (
           <Button

components/settings/settings-app.tsx

@@ -1025,16 +1025,19 @@ export function SettingsApp({ linkSegments: routeSegments }: SettingsAppProps =
         style={{ width: `${settingsSidebarWidth}px` }}
       >
         {!proInterface && (
-          <div className="p-4 border-b border-border">
-            <Button
-              variant="ghost"
-              size="sm"
-              onClick={() => router.push('/')}
-              className="w-full justify-start"
-            >
-              <ArrowLeft className="w-4 h-4 me-2" />
-              {t('back_to_mail')}
-            </Button>
+          // Same h-14 box as the mail sidebar's account switcher, so the apps line up.
+          <div className="border-b border-border">
+            <div className="flex items-center h-14 px-2">
+              <Button
+                variant="ghost"
+                size="sm"
+                onClick={() => router.push('/')}
+                className="w-full justify-start"
+              >
+                <ArrowLeft className="w-4 h-4 me-2" />
+                {t('back_to_mail')}
+              </Button>
+            </div>
           </div>
         )}