diff --git a/src/components/calendar/themes/shared/bootstrap/days-view.bootstrap.scss b/src/components/calendar/themes/shared/bootstrap/days-view.bootstrap.scss
index 3ac17161f..251139c27 100644
--- a/src/components/calendar/themes/shared/bootstrap/days-view.bootstrap.scss
+++ b/src/components/calendar/themes/shared/bootstrap/days-view.bootstrap.scss
@@ -20,7 +20,16 @@ $border-size: rem(1px);
 
 [part~='days-row'][part~='first'] {
     background: var-get($theme, 'header-background');
-    border-bottom: rem(1px) solid var-get($theme, 'border-color');
+    position: relative;
+
+    &::after {
+        content: '';
+        position: absolute;
+        width: 100%;
+        inset-block-start: 100%;
+        height: rem(1px);
+        background: var-get($theme, 'border-color');
+    }
 }
 
 [part~='week-number'] {
@@ -37,7 +46,6 @@ $border-size: rem(1px);
 
     &::after {
         width: var-get($theme, 'size');
-        height: calc(var-get($theme, 'size') / 2);
         inset-block-end: 100%;
         background: var-get($theme, 'week-number-background');
     }
@@ -73,6 +81,8 @@ $border-size: rem(1px);
 
 [part~='date'] {
     height: var-get($theme, 'size');
+    border-top: $border-size solid transparent;
+    border-bottom: $border-size solid transparent;
 
     &[part~='range'],
     &[part~='range'][part~='preview'] {
@@ -121,12 +131,6 @@ $border-size: rem(1px);
     }
 }
 
-[part~='date'],
-[part~='week-number'] {
-    border-top: $border-size solid transparent;
-    border-bottom: $border-size solid transparent;
-}
-
 [part~='date-inner'] {
     width: var-get($theme, 'size');
     height: var-get($theme, 'size');
diff --git a/src/components/calendar/themes/shared/fluent/days-view.fluent.scss b/src/components/calendar/themes/shared/fluent/days-view.fluent.scss
index 3bd4b678a..3bc10c4d0 100644
--- a/src/components/calendar/themes/shared/fluent/days-view.fluent.scss
+++ b/src/components/calendar/themes/shared/fluent/days-view.fluent.scss
@@ -11,6 +11,8 @@ $row-gap: rem(6px);
 
 [part~='date'] {
     height: var-get($theme, 'size');
+    border-top: $border-size solid transparent;
+    border-bottom: $border-size solid transparent;
 }
 
 [part~='date'],
@@ -18,12 +20,6 @@ $row-gap: rem(6px);
     border-radius: var-get($theme, 'date-border-radius');
 }
 
-[part~='date'],
-[part~='week-number'] {
-    border-top: $border-size solid transparent;
-    border-bottom: $border-size solid transparent;
-}
-
 [part~='date-inner'],
 [part~='week-number-inner'] {
     border: $border-size solid transparent;
@@ -31,6 +27,7 @@ $row-gap: rem(6px);
 
 [part~='week-number'] {
     width: var-get($theme, 'size');
+    height: var-get($theme, 'size');
 }
 
 [part~='week-number-inner'] {
@@ -43,7 +40,6 @@ $row-gap: rem(6px);
 
     &::after {
         width: var-get($theme, 'size');
-        height: calc(var-get($theme, 'size') / 2);
         background: var-get($theme, 'week-number-background');
         border-inline-start: rem(1px) solid var-get($theme, 'week-number-background');
         border-inline-end: rem(1px) solid var-get($theme, 'week-number-background');