1 files changed, 5 insertions, 1 deletions

diff --git a/packages/renderer/src/components/locationBar/LocationBar.tsx b/packages/renderer/src/components/locationBar/LocationBar.tsx
index e1f470d..8b079f0 100644
--- a/packages/renderer/src/components/locationBar/LocationBar.tsx
+++ b/packages/renderer/src/components/locationBar/LocationBar.tsx
@@ -27,6 +27,8 @@ import { useStore } from '../StoreProvider';
 import LocationTextField from './LocationTextField';
 import NavigationButtons from './NavigationButtons';
 
+export const LOCATION_BAR_ID = 'Sophie-LocationBar';
+
 const LocationBarRoot = styled('header', {
   name: 'LocationBar',
   slot: 'Root',
@@ -34,6 +36,8 @@ const LocationBarRoot = styled('header', {
   display: hidden ? 'none' : 'flex',
   flexDirection: 'row',
   padding: theme.spacing(1),
+  // Align the bottom border with the service switcher in the sidebar.
+  paddingBottom: `calc(${theme.spacing(1)} - 1px)`,
   gap: theme.spacing(1),
   borderBottom: `1px solid ${theme.palette.divider}`,
 }));
@@ -44,7 +48,7 @@ function LocationBar(): JSX.Element {
   } = useStore();
 
   return (
-    <LocationBarRoot id="locationBar" hidden={!showLocationBar}>
+    <LocationBarRoot id={LOCATION_BAR_ID} hidden={!showLocationBar}>
       <NavigationButtons service={selectedService} />
       <LocationTextField service={selectedService} />
     </LocationBarRoot>