diff --git a/themes/finna2/scss/finna/organisation-info.scss b/themes/finna2/scss/finna/organisation-info.scss
index 462d9729adbf..31910c87a70f 100644
--- a/themes/finna2/scss/finna/organisation-info.scss
+++ b/themes/finna2/scss/finna/organisation-info.scss
@@ -511,8 +511,9 @@ $organisation-info-max-w: 400px !default;
                     break-inside: avoid-column;
                     page-break-inside: avoid;
                 }
-                .service-tooltip {
+                .finna-toggletip {
                     padding: 0px;
+                    margin-left: -6px;
                     color: $link-color;
                     text-align: left;
                     text-decoration: none;
@@ -592,6 +593,18 @@ $organisation-info-max-w: 400px !default;
                 .service-list {
                     column-count: 3;
                 }
+                .finna-toggletip {
+                    padding: 0px;
+                    margin-left: -6px;
+                    color: $link-color;
+                    text-align: left;
+                    text-decoration: none;
+                    background-color: inherit;
+                    border: none;
+                    .finna-toggletip__button { 
+                        text-align: left;
+                    }
+                }
             }
         }
     }
diff --git a/themes/finna2/templates/organisationinfo/elements/location/service-list.phtml b/themes/finna2/templates/organisationinfo/elements/location/service-list.phtml
index b6be82f45866..8f3d275d55bc 100644
--- a/themes/finna2/templates/organisationinfo/elements/location/service-list.phtml
+++ b/themes/finna2/templates/organisationinfo/elements/location/service-list.phtml
@@ -10,10 +10,14 @@
     <?php foreach ($services as $service): ?>
       <div>
         <?php if ($desc = $service['description'] ?: $service['shortDescription']): ?>
-          <?php $tooltipEsc = $this->transEscAttr('<h6>' . $this->cleanHtml($service['name']) . '</h6>' . $this->cleanHtml($desc)); ?>
-          <button type="button" class="service-tooltip" data-bs-toggle="tooltip" data-placement="bottom" data-html="true" data-original-title="<?=$tooltipEsc?>">
-            <?=$this->cleanHtml($service['name'])?>
-          </button>
+          <?php
+            $contentHtml = '<h6>' . $this->cleanHtml($service['name']) . '</h6>' . $this->cleanHtml($desc);
+            echo $this->component('finna-toggletip', [
+              'placement' => 'bottom',
+              'contentHtml' => $contentHtml,
+              'labelHtml' => $this->cleanHtml($service['name']),
+            ]);
+          ?>
         <?php else: ?>
           <?=$this->cleanHtml($service['name'])?>
         <?php endif; ?>