diff --git a/src/lib/components/AnalystEstimate.svelte b/src/lib/components/AnalystEstimate.svelte
index 30e4981e..db829543 100644
--- a/src/lib/components/AnalystEstimate.svelte
+++ b/src/lib/components/AnalystEstimate.svelte
@@ -789,7 +789,7 @@
               <tbody>
                 <tr class="bg-primary border-b border-gray-600">
                   <th
-                    class="text-white whitespace-nowrap text-sm sm:text-[1rem] text-start bg-primary border-b border-gray-800"
+                    class="text-white whitespace-nowrap text-sm sm:text-[1rem] text-start font-normal bg-primary border-b border-gray-800"
                   >
                     Revenue
                   </th>
@@ -808,7 +808,7 @@
 
                 <tr class="bg-primary">
                   <th
-                    class="bg-primary whitespace-nowrap text-sm sm:text-[1rem] text-white text-start border-b border-gray-800"
+                    class="bg-primary whitespace-nowrap text-sm sm:text-[1rem] text-white text-start font-normal border-b border-gray-800"
                   >
                     Revenue Growth
                   </th>
@@ -843,7 +843,7 @@
 
                 <tr class="bg-primary border-b-[#09090B]">
                   <th
-                    class="text-white whitespace-nowrap text-sm sm:text-[1rem] text-start bg-primary border-b border-gray-800"
+                    class="text-white whitespace-nowrap text-sm sm:text-[1rem] text-start font-normal bg-primary border-b border-gray-800"
                   >
                     EPS
                   </th>
@@ -862,7 +862,7 @@
 
                 <tr class="bg-primary">
                   <th
-                    class="bg-primary whitespace-nowrap text-sm sm:text-[1rem] text-white text-start border-b border-gray-800"
+                    class="bg-primary whitespace-nowrap text-sm sm:text-[1rem] text-white font-normal text-start border-b border-gray-800"
                   >
                     EPS Growth
                   </th>
@@ -896,7 +896,7 @@
                 </tr>
                 <tr class="bg-primary border-b border-gray-600">
                   <th
-                    class="text-white whitespace-nowrap text-sm sm:text-[1rem] text-start bg-primary border-b border-gray-800"
+                    class="text-white whitespace-nowrap text-sm sm:text-[1rem] text-start font-normal bg-primary border-b border-gray-800"
                   >
                     Net Income
                   </th>
@@ -915,7 +915,7 @@
 
                 <tr class="bg-primary">
                   <th
-                    class="bg-primary whitespace-nowrap text-sm sm:text-[1rem] text-white text-start border-b border-gray-800"
+                    class="bg-primary whitespace-nowrap text-sm sm:text-[1rem] text-white font-normal text-start border-b border-gray-800"
                   >
                     Net Income Growth
                   </th>
@@ -950,7 +950,7 @@
 
                 <tr class="bg-primary border-b border-gray-600">
                   <th
-                    class="text-white whitespace-nowrap text-sm sm:text-[1rem] text-start bg-primary border-b border-gray-800"
+                    class="text-white whitespace-nowrap text-sm sm:text-[1rem] text-start font-normal bg-primary border-b border-gray-800"
                   >
                     EBITDA
                   </th>
@@ -969,7 +969,7 @@
 
                 <tr class="bg-primary">
                   <th
-                    class="bg-primary whitespace-nowrap text-sm sm:text-[1rem] text-white text-start border-b border-gray-800"
+                    class="bg-primary whitespace-nowrap text-sm sm:text-[1rem] text-white font-normal text-start border-b border-gray-800"
                   >
                     EBITDA Growth
                   </th>
@@ -1004,7 +1004,7 @@
 
                 <tr class="bg-primary border-b border-gray-600">
                   <th
-                    class="text-white whitespace-nowrap text-sm sm:text-[1rem] text-start bg-primary border-b border-gray-800"
+                    class="text-white whitespace-nowrap text-sm sm:text-[1rem] text-start font-normal bg-primary border-b border-gray-800"
                     >No. Analysts</th
                   >
                   {#each tableCombinedRevenue as item}
diff --git a/src/lib/components/Options/GreekExposure.svelte b/src/lib/components/Options/GreekExposure.svelte
index 5df770b8..74d2aa4f 100644
--- a/src/lib/components/Options/GreekExposure.svelte
+++ b/src/lib/components/Options/GreekExposure.svelte
@@ -386,7 +386,7 @@
           {:else if data?.user?.tier !== "Pro"}
             <a
               href="/pricing"
-              class="px-3 py-1 text-sm flex flex-row items-center {timePeriod ===
+              class="px-3 py-1 text-sm flex flex-row items-center border border-gray-700 {timePeriod ===
               item
                 ? 'bg-white text-black '
                 : 'text-white bg-table text-opacity-[0.6]'} transition ease-out duration-100 sm:hover:bg-white sm:hover:text-black rounded-md cursor-pointer"
@@ -397,7 +397,7 @@
                 xmlns="http://www.w3.org/2000/svg"
                 viewBox="0 0 24 24"
                 ><path
-                  fill="#A3A3A3"
+                  fill="currentColor"
                   d="M17 9V7c0-2.8-2.2-5-5-5S7 4.2 7 7v2c-1.7 0-3 1.3-3 3v7c0 1.7 1.3 3 3 3h10c1.7 0 3-1.3 3-3v-7c0-1.7-1.3-3-3-3M9 7c0-1.7 1.3-3 3-3s3 1.3 3 3v2H9z"
                 /></svg
               >
diff --git a/src/lib/components/Options/HottestContracts.svelte b/src/lib/components/Options/HottestContracts.svelte
index b2f451b5..b6efefa8 100644
--- a/src/lib/components/Options/HottestContracts.svelte
+++ b/src/lib/components/Options/HottestContracts.svelte
@@ -4,7 +4,6 @@
 
   import TableHeader from "$lib/components/Table/TableHeader.svelte";
   import UpgradeToPro from "$lib/components/UpgradeToPro.svelte";
-  import Infobox from "$lib/components/Infobox.svelte";
   import highcharts from "$lib/highcharts.ts";
 
   export let data;
@@ -828,7 +827,7 @@
   id="optionDetailsDesktopModal"
   class="modal {$screenWidth < 640
     ? 'modal-bottom '
-    : ''} bg-[#000] bg-opacity-[0.8] sm:px-5"
+    : ''} bg-[#000]/40 sm:px-5"
 >
   <div
     class="modal-box w-full {rawDataHistory?.length > 0
diff --git a/src/lib/components/Options/UnusualActivity.svelte b/src/lib/components/Options/UnusualActivity.svelte
index a9473100..03d7fadf 100644
--- a/src/lib/components/Options/UnusualActivity.svelte
+++ b/src/lib/components/Options/UnusualActivity.svelte
@@ -187,7 +187,6 @@
           style: {
             color: "#fff",
           },
-          distance: 20, // Increases space between label and axis
           formatter: function () {
             const date = new Date(this.value);
             return date.toLocaleDateString("en-US", {
@@ -860,9 +859,7 @@
 
 <dialog
   id="optionDetailsDesktopModal"
-  class="modal {$screenWidth < 640
-    ? 'modal-bottom '
-    : ''} bg-[#000] bg-opacity-[0.8] sm:px-5"
+  class="modal {$screenWidth < 640 ? 'modal-bottom ' : ''} bg-[#000]/40 sm:px-5"
 >
   <div
     class="modal-box w-full {rawDataHistory?.length > 0
diff --git a/src/lib/components/Options/Volatility.svelte b/src/lib/components/Options/Volatility.svelte
index c253a80f..d2da05dc 100644
--- a/src/lib/components/Options/Volatility.svelte
+++ b/src/lib/components/Options/Volatility.svelte
@@ -439,7 +439,7 @@
           {:else if data?.user?.tier !== "Pro"}
             <a
               href="/pricing"
-              class="px-3 py-1 text-sm flex flex-row items-center {timePeriod ===
+              class="px-3 py-1 text-sm flex flex-row items-center border border-gray-700 {timePeriod ===
               item
                 ? 'bg-white text-black '
                 : 'text-white bg-table text-opacity-[0.6]'} transition ease-out duration-100 sm:hover:bg-white sm:hover:text-black rounded-md cursor-pointer"
@@ -450,7 +450,7 @@
                 xmlns="http://www.w3.org/2000/svg"
                 viewBox="0 0 24 24"
                 ><path
-                  fill="#A3A3A3"
+                  fill="currentColor"
                   d="M17 9V7c0-2.8-2.2-5-5-5S7 4.2 7 7v2c-1.7 0-3 1.3-3 3v7c0 1.7 1.3 3 3 3h10c1.7 0 3-1.3 3-3v-7c0-1.7-1.3-3-3-3M9 7c0-1.7 1.3-3 3-3s3 1.3 3 3v2H9z"
                 /></svg
               >
diff --git a/src/routes/etf/[tickerID]/+layout.svelte b/src/routes/etf/[tickerID]/+layout.svelte
index d18f09ea..6e1a5604 100644
--- a/src/routes/etf/[tickerID]/+layout.svelte
+++ b/src/routes/etf/[tickerID]/+layout.svelte
@@ -962,10 +962,7 @@
 <!--Start Add Watchlist Modal-->
 <input type="checkbox" id="addWatchListModal" class="modal-toggle" />
 
-<dialog
-  id="addWatchListModal"
-  class="modal bg-[#000] bg-opacity-[0.8] p-3 sm:p-0"
->
+<dialog id="addWatchListModal" class="modal bg-[#000]/40 p-3 sm:p-0">
   <label
     id="addWatchListModal"
     for="addWatchListModal"
diff --git a/src/routes/index/[tickerID]/+layout.svelte b/src/routes/index/[tickerID]/+layout.svelte
index ac34d919..d5862ad3 100644
--- a/src/routes/index/[tickerID]/+layout.svelte
+++ b/src/routes/index/[tickerID]/+layout.svelte
@@ -934,10 +934,7 @@
 <!--Start Add Watchlist Modal-->
 <input type="checkbox" id="addWatchListModal" class="modal-toggle" />
 
-<dialog
-  id="addWatchListModal"
-  class="modal bg-[#000] bg-opacity-[0.8] p-3 sm:p-0"
->
+<dialog id="addWatchListModal" class="modal bg-[#000]/40 p-3 sm:p-0">
   <label
     id="addWatchListModal"
     for="addWatchListModal"
diff --git a/src/routes/index/[tickerID]/options/hottest-contracts/+page.svelte b/src/routes/index/[tickerID]/options/hottest-contracts/+page.svelte
index 45132f1c..4e3cb32b 100644
--- a/src/routes/index/[tickerID]/options/hottest-contracts/+page.svelte
+++ b/src/routes/index/[tickerID]/options/hottest-contracts/+page.svelte
@@ -808,9 +808,7 @@
 
 <dialog
   id="optionDetailsDesktopModal"
-  class="modal {$screenWidth < 640
-    ? 'modal-bottom'
-    : ''} bg-[#000] bg-opacity-[0.8] sm:px-5"
+  class="modal {$screenWidth < 640 ? 'modal-bottom' : ''} bg-[#000]/40 sm:px-5"
 >
   <div
     class="modal-box w-full {rawDataHistory?.length > 0
diff --git a/src/routes/options-flow/+page.svelte b/src/routes/options-flow/+page.svelte
index 70031984..b6b9143c 100644
--- a/src/routes/options-flow/+page.svelte
+++ b/src/routes/options-flow/+page.svelte
@@ -1686,7 +1686,7 @@
     id="ruleModal"
     for="ruleModal"
     on:click={() => (searchTerm = "")}
-    class="cursor-pointer modal-backdrop bg-[#000] bg-opacity-[0.8]"
+    class="cursor-pointer modal-backdrop bg-[#000]/40"
   ></label>
 
   <div
@@ -1839,9 +1839,7 @@
 <input type="checkbox" id="mobileTooltip" class="modal-toggle" />
 
 <dialog id="mobileTooltip" class="modal p-3">
-  <label
-    for="mobileTooltip"
-    class="cursor-pointer modal-backdrop bg-[#000] bg-opacity-[0.8]"
+  <label for="mobileTooltip" class="cursor-pointer modal-backdrop bg-[#000]/40"
   ></label>
 
   <!-- Desktop modal content -->
diff --git a/src/routes/stock-screener/+page.svelte b/src/routes/stock-screener/+page.svelte
index 7d999487..b4bdd8ad 100644
--- a/src/routes/stock-screener/+page.svelte
+++ b/src/routes/stock-screener/+page.svelte
@@ -3618,7 +3618,7 @@ const handleKeyDown = (event) => {
     id="ruleModal"
     for="ruleModal"
     on:click={() => (searchTerm = "")}
-    class="cursor-pointer modal-backdrop bg-[#000] bg-opacity-[0.8]"
+    class="cursor-pointer modal-backdrop bg-[#000]/40"
   ></label>
 
   <div
@@ -3845,9 +3845,7 @@ const handleKeyDown = (event) => {
 <input type="checkbox" id="mobileTooltip" class="modal-toggle" />
 
 <dialog id="mobileTooltip" class="modal p-3">
-  <label
-    for="mobileTooltip"
-    class="cursor-pointer modal-backdrop bg-[#000] bg-opacity-[0.8]"
+  <label for="mobileTooltip" class="cursor-pointer modal-backdrop bg-[#000]/40"
   ></label>
 
   <!-- Desktop modal content -->
diff --git a/src/routes/stocks/[tickerID]/+layout.svelte b/src/routes/stocks/[tickerID]/+layout.svelte
index 498744a4..c370300e 100644
--- a/src/routes/stocks/[tickerID]/+layout.svelte
+++ b/src/routes/stocks/[tickerID]/+layout.svelte
@@ -1044,10 +1044,7 @@
 <!--Start Add Watchlist Modal-->
 <input type="checkbox" id="addWatchListModal" class="modal-toggle" />
 
-<dialog
-  id="addWatchListModal"
-  class="modal bg-[#000] bg-opacity-[0.8] p-3 sm:p-0"
->
+<dialog id="addWatchListModal" class="modal bg-[#000]/40 p-3 sm:p-0">
   <label
     id="addWatchListModal"
     for="addWatchListModal"