Introduce position attributes for tooltips

com/static/com/components/ics-calendar.scss

@@ -22,8 +22,6 @@
 ics-calendar {
   border: none;
   box-shadow: none;
-  overflow: visible;
-  z-index: 1;
 
   #event-details {
     z-index: 10;
@@ -118,34 +116,7 @@ ics-calendar {
     transition: 200ms linear;
   }
 
-
-
-  /* Tooltip styles */
-  button[data-tooltip] {
-    position: relative;
-    cursor: pointer;
-  }
-
-  button[data-tooltip]::after {
-    font-size: 10px;
-    content: attr(data-tooltip);
-    position: absolute;
-    bottom: 120%; /* Adjust this value to position the tooltip above the button */
-    left: 50%;
-    transform: translateX(-50%);
-    background-color: #333;
-    color: #fff;
-    padding: 5px 10px;
-    border-radius: 5px;
-    white-space: nowrap;
-    opacity: 0;
-    transition: opacity 0.3s;
-    pointer-events: none;
-    z-index: 99999;
-  }
-
-  button[data-tooltip]:hover::after,
-  button[data-tooltip]:focus::after {
-    opacity: 1;
+  [tooltip]::before {
+    font-size: 10px; // this will overflow otherwise
   }
 }