add drop shadow to tooltips

assets/css/custom.css

@@ -75,12 +75,12 @@ body a, body button {
   min-width: 16ch;
   max-width: 40ch;
   bottom: 95%;
-  left: 0;
+  left: 75%;
   padding: 0.25ch;
   padding-left: 0.5ch;
   padding-right: 0.5ch;
-  background-color: rgba(var(--color-neutral-100),0.75);
-  color: rgba(var(--color-secondary-700),0.75);
+  background-color: rgba(var(--color-neutral-100),1);
+  color: rgba(var(--color-secondary-700),1);
   text-align: center;
   border-radius: 5px;
   position: absolute;
@@ -89,20 +89,21 @@ body a, body button {
   transition-property: opacity;
   transition-duration: 250ms;
   transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
+  box-shadow: 2px 2px 5px rgba(var(--color-neutral-800),1);
 }
 /* TODO make background blur work*/
 .tooltip:hover .tooltiptext {
-  opacity: 0.95;
-  backdrop-filter: blur(100px);
+  opacity: 1;
 }
 
 .dark .tooltip {
-  border-bottom: 2px dotted rgba(var(--color-secondary-400), var(--tw-text-opacity));
+  border-bottom: 2px dotted rgba(var(--color-secondary-500), var(--tw-text-opacity));
 }
 
 .dark .tooltip  .tooltiptext {
-  background-color: rgba(var(--color-neutral-800),var(--tw-bg-opacity));
-  color: rgba(var(--color-secondary-400),var(--tw-text-opacity));
+ background-color: rgba(var(--color-neutral-800),1);
+  color: rgba(var(--color-secondary-400),1);
+  box-shadow: 2px 2px 5px rgba(var(--color-neutral-400),1);
 }
 
 /* BLOCKQUOTES that don't suck */