diff --git a/frontends/main/package.json b/frontends/main/package.json
index 3e8ee9d250..9a93ed0094 100644
--- a/frontends/main/package.json
+++ b/frontends/main/package.json
@@ -12,7 +12,7 @@
   "dependencies": {
     "@ebay/nice-modal-react": "^1.2.13",
     "@emotion/cache": "^11.13.1",
-    "@mitodl/course-search-utils": "^3.3.0",
+    "@mitodl/course-search-utils": "^3.3.1",
     "@next/bundle-analyzer": "^14.2.15",
     "@remixicon/react": "^4.2.0",
     "@sentry/nextjs": "^8",
diff --git a/frontends/main/src/app-pages/SearchPage/SearchPage.test.tsx b/frontends/main/src/app-pages/SearchPage/SearchPage.test.tsx
index 30a9715ce0..3fd65a0a38 100644
--- a/frontends/main/src/app-pages/SearchPage/SearchPage.test.tsx
+++ b/frontends/main/src/app-pages/SearchPage/SearchPage.test.tsx
@@ -157,8 +157,10 @@ describe("SearchPage", () => {
 
     const clearAll = await screen.findByRole("button", { name: /clear all/i })
 
-    const physics = await screen.findByRole("checkbox", { name: "Physics" })
-    const chemistry = await screen.findByRole("checkbox", { name: "Chemistry" })
+    const physics = await screen.findByRole("checkbox", { name: "Physics 100" })
+    const chemistry = await screen.findByRole("checkbox", {
+      name: "Chemistry 200",
+    })
     // initial
     expect(physics).toBeChecked()
     expect(chemistry).toBeChecked()
@@ -554,9 +556,9 @@ test("Facet 'Offered By' uses API response for names", async () => {
     search: {
       metadata: {
         aggregations: {
-          offered_by: offerors.results.map((o) => ({
+          offered_by: offerors.results.map((o, i) => ({
             key: o.code,
-            doc_count: 10,
+            doc_count: 10 + i,
           })),
         },
         suggestions: [],
@@ -571,13 +573,13 @@ test("Facet 'Offered By' uses API response for names", async () => {
   await user.click(showFacetButton)
 
   const offeror0 = await screen.findByRole("checkbox", {
-    name: offerors.results[0].name,
+    name: `${offerors.results[0].name} 10`,
   })
   const offeror1 = await screen.findByRole("checkbox", {
-    name: offerors.results[1].name,
+    name: `${offerors.results[1].name} 11`,
   })
   const offeror2 = await screen.findByRole("checkbox", {
-    name: offerors.results[2].name,
+    name: `${offerors.results[2].name} 12`,
   })
   expect(offeror0).toBeVisible()
   expect(offeror1).toBeVisible()
diff --git a/frontends/main/src/page-components/SearchDisplay/SearchDisplay.tsx b/frontends/main/src/page-components/SearchDisplay/SearchDisplay.tsx
index 4f46d7a195..71a7bedde3 100644
--- a/frontends/main/src/page-components/SearchDisplay/SearchDisplay.tsx
+++ b/frontends/main/src/page-components/SearchDisplay/SearchDisplay.tsx
@@ -140,7 +140,7 @@ const FacetStyles = styled.div`
     width: 100%;
     align-items: baseline;
 
-    label {
+    .facet-text {
       ${truncateText(1)};
       color: ${({ theme }) => theme.custom.colors.silverGrayDark};
     }
@@ -193,7 +193,7 @@ const FacetStyles = styled.div`
       margin-left: -2px;
 
       input,
-      label {
+      .facet-label {
         cursor: pointer;
       }
 
@@ -205,12 +205,13 @@ const FacetStyles = styled.div`
         color: ${({ theme }) => theme.custom.colors.silverGrayDark};
         float: right;
       }
-    }
 
-    .facet-visible.checked .facet-label label,
-    .facet-visible .facet-label label:hover,
-    .facet-visible input:hover + .facet-label label {
-      color: ${({ theme }) => theme.custom.colors.darkGray2};
+      &.checked,
+      &:hover {
+        .facet-label .facet-text {
+          color: ${({ theme }) => theme.custom.colors.darkGray2};
+        }
+      }
     }
 
     .facet-more-less {
@@ -294,12 +295,10 @@ const FacetStyles = styled.div`
     padding-top: 5px;
 
     /* stylelint-disable no-descending-specificity */
-    .facet-visible {
-      .facet-label {
-        label,
-        .facet-count {
-          color: ${({ theme }) => theme.custom.colors.darkGray2};
-        }
+    .facet-visible .facet-label {
+      .facet-text,
+      .facet-count {
+        color: ${({ theme }) => theme.custom.colors.darkGray2};
       }
 
       margin-bottom: 0;
diff --git a/yarn.lock b/yarn.lock
index 46a726bd84..f19e688cb0 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -3533,9 +3533,9 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@mitodl/course-search-utils@npm:^3.3.0":
-  version: 3.3.0
-  resolution: "@mitodl/course-search-utils@npm:3.3.0"
+"@mitodl/course-search-utils@npm:^3.3.1":
+  version: 3.3.1
+  resolution: "@mitodl/course-search-utils@npm:3.3.1"
   dependencies:
     "@mitodl/open-api-axios": "npm:2024.9.16"
     "@remixicon/react": "npm:^4.2.0"
@@ -3555,7 +3555,7 @@ __metadata:
       optional: true
     react-router:
       optional: true
-  checksum: 10/b6550dff9b96e3724be052a945e817d519c6ee196902def7137a3cfb874bcf030d4e00ff231ad35f948a8157fc439f2eb4dec87f61f7f10bfeeab7b76cddf1a1
+  checksum: 10/d0f69157755f1ff90a4cb9cee017320f08e2073066ac4b948120eb8b2c3c6cedb844f9c358596b47e8a04c9eba896c4da49f593436a9a9bf0f9d9894d2fc3119
   languageName: node
   linkType: hard
 
@@ -14505,7 +14505,7 @@ __metadata:
     "@ebay/nice-modal-react": "npm:^1.2.13"
     "@emotion/cache": "npm:^11.13.1"
     "@faker-js/faker": "npm:^8.4.1"
-    "@mitodl/course-search-utils": "npm:^3.3.0"
+    "@mitodl/course-search-utils": "npm:^3.3.1"
     "@next/bundle-analyzer": "npm:^14.2.15"
     "@remixicon/react": "npm:^4.2.0"
     "@sentry/nextjs": "npm:^8"