diff --git a/src/components/VFilters/VSearchGridFilter.vue b/src/components/VFilters/VSearchGridFilter.vue
index 94e48a7d16..46181ef055 100644
--- a/src/components/VFilters/VSearchGridFilter.vue
+++ b/src/components/VFilters/VSearchGridFilter.vue
@@ -1,9 +1,6 @@
 <template>
   <div
-    class="py-8 px-10 min-h-full"
-    :class="{
-      'bg-dark-charcoal-06': isMinScreenMd,
-    }"
+    class="filters py-8 px-10 min-h-full md:bg-dark-charcoal-06"
     data-testid="filters-list"
     @onUpdateFilter="onUpdateFilter"
     @onToggleSearchGridFilter="$emit('close')"
@@ -55,7 +52,6 @@ import {
   TOGGLE_FILTER,
 } from '~/constants/action-types'
 import { MEDIA, SEARCH } from '~/constants/store-modules'
-import { isMinScreen } from '~/composables/use-media-query'
 
 import VFilterChecklist from '~/components/VFilters/VFilterChecklist.vue'
 
@@ -67,7 +63,6 @@ export default {
   setup() {
     const { i18n, store } = useContext()
     const router = useRouter()
-    const isMinScreenMd = isMinScreen('md')
 
     const isAnyFilterApplied = computed(
       () => store.getters[`${SEARCH}/isAnyFilterApplied`]
@@ -107,8 +102,18 @@ export default {
       filterTypeTitle,
       clearFilters,
       onUpdateFilter,
-      isMinScreenMd,
     }
   },
 }
 </script>
+<style scoped>
+.filters {
+  border-inline-start: 1px solid transparent;
+}
+@screen md {
+  .filters {
+    /* dark-charcoal-20*/
+    border-inline-start: 1px solid #d6d4d5;
+  }
+}
+</style>