changes to blocks and styles

style.css

@@ -23,20 +23,22 @@ Version: 1.0
 
 }
 
-/* Side content - absolute or fixed position */
+/* Side content */
 #lcp-sidecontent {
-    position: absolute; /* Positioned relative to the parent with position: relative */
+    position: absolute; 
     left: 0;
-    top: var(--my-top); /* Dynamically controlled top position via JS */
-    width: 340px; /* Fixed width */
-    height: 100%; /* Full height */
-    overflow: auto; /* Allow scrolling inside */
+    top: var(--my-top); 
+    width: 340px; 
+    height: 100%; 
+    overflow: auto; 
     background: #fff;
     border-right: 2px solid #eee;
     z-index: 2;
     outline: 0;
 }
 
+
+
 #lcp-sidecontent.lcp-fixed {
     position:fixed
 }
@@ -118,10 +120,7 @@ Version: 1.0
 
 
 
-#lcp-sidecontent {
 
-    overflow: hidden; /* Hide native scrollbar */
-}
 
 #lcp-sidecontent-inner {
     height: 100%;
@@ -145,4 +144,38 @@ Version: 1.0
     border-radius: 5px;
 }
 
+/* Highlight-to-share popup */
+.popup {
+    position: absolute;
+    background-color: white;
+    color: black;
+    padding: 8px;
+    border-radius: 5px;
+    font-size: 14px;
+    display: none; /* Hidden by default */
+    z-index:8999
+  }
 
+  /* LCP Button */
+  .lcp-button {
+    display: inline-block; 
+    background-color: var(--wp--preset--color--accent);
+    border: none;
+    color: #fff;
+    text-decoration: none;
+    padding: 10px;
+    font-weight: bold;
+    font-size: var(--wp--preset--font-size--small);
+    white-space: nowrap; 
+    cursor: pointer;
+    
+}
+
+.lcp-button .lcp-icon {
+    height: 1.2em;
+    max-height:100%;
+    width: auto;
+    vertical-align: middle; /* Aligns the icon with the text vertically */
+    margin-right: 10px; /* Space between the icon and the text */
+    fill:white;
+}