chore: added css tooltips

src/style.css

@@ -28,6 +28,33 @@ body {
   border-radius: theme('borderRadius.md');
 }
 
+/* Tooltips */
+[data-tooltip] {
+  position: relative;
+}
+
+[data-tooltip] > .tooltip-content {
+  visibility: hidden;
+  background-color: theme('colors.inherit');
+  min-width: 125px;
+  color: inherit;
+  text-align: center;
+  border-radius: theme('borderRadius.md');
+  padding: 0.25rem 0.5rem;
+
+  position: absolute;
+  z-index: 1;
+
+  top: calc(100% + 0.5rem);
+  left: 50%;
+  transform: translateX(-50%);
+}
+
+[data-tooltip]:hover > .tooltip-content,
+[data-tooltip]:focus-visible > .tooltip-content {
+  visibility: visible;
+}
+
 @media print {
   :root {
     color-scheme: light;