diff --git a/web/chat/message-tooltip.css b/web/chat/message-tooltip.css
index dbee9f7b3..5d65ec81e 100644
--- a/web/chat/message-tooltip.css
+++ b/web/chat/message-tooltip.css
@@ -1,60 +1,62 @@
 div.messageTooltipContainer {
   display: flex;
   flex-direction: column;
   align-items: center;
   font-size: var(--s-font-14);
 }
 
 div.messageActionContainer {
   display: flex;
   flex-direction: row;
   align-items: center;
   justify-content: center;
   background-color: var(--message-action-tooltip-bg);
   border-radius: 8px;
   width: fit-content;
+  box-shadow: var(--message-action-tooltip-bg) 0 2px 8px;
 }
 
 div.messageActionButtons {
   display: flex;
   font-size: 16px;
 }
 div.messageActionButtons svg {
   padding: 10px 6px 6px;
   color: var(--color-disabled);
 }
 
 div.messageActionButtons svg:hover {
   cursor: pointer;
   color: var(--fg);
 }
 
 div.messageTooltipButton {
   display: flex;
   align-items: center;
   justify-content: center;
 }
 
 div.messageTooltipLabel {
   display: flex;
   flex-direction: row;
   align-items: center;
   justify-content: center;
   background-color: var(--message-action-tooltip-bg);
   color: var(--tool-tip-color);
   border-radius: 8px;
   overflow: auto;
   white-space: nowrap;
+  box-shadow: var(--message-action-tooltip-bg) 0 2px 8px;
 }
 
 div.leftTooltipAlign {
   align-items: flex-start;
 }
 
 div.centerTooltipAlign {
   align-items: center;
 }
 
 div.rightTooltipAlign {
   align-items: flex-end;
 }