diff --git a/watchlist.css b/watchlist.css
index 1709776..898d27c 100644
--- a/watchlist.css
+++ b/watchlist.css
@@ -1804,3 +1804,7 @@ div[data-tab="watchlist"] .loading-message {
     color: rgba(0,0,0,.26);
     cursor: auto
 }
+
+.watchlist-button[data-active="true"], .watchlist-icon[data-active="true"] {
+    color: rgb(34, 197, 94) !important;
+}
\ No newline at end of file
diff --git a/watchlist.js b/watchlist.js
index 396e9c1..544df3d 100644
--- a/watchlist.js
+++ b/watchlist.js
@@ -5355,7 +5355,7 @@ In the Custom Tabs plugin, add a new tab with the following HTML content:
 		// Create watchlist button
 		const watchlistButton = document.createElement('button');
 		watchlistButton.type = 'button';
-		watchlistButton.className = 'watchlist-button cardOverlayButton cardOverlayButton-hover itemAction paper-icon-button-light emby-button';
+		watchlistButton.className = 'watchlist-button cardOverlayButton cardOverlayButton-hover itemAction paper-icon-button-light emby-button button-flat';
 		watchlistButton.setAttribute('data-action', 'none');
 		watchlistButton.setAttribute('data-id', itemId);
 		watchlistButton.setAttribute('data-active', 'false');
@@ -5483,7 +5483,7 @@ In the Custom Tabs plugin, add a new tab with the following HTML content:
 		
 		const watchlistIcon = document.createElement('button');
 		watchlistIcon.setAttribute("is", "emby-button");
-		watchlistIcon.className = 'watchlist-icon detailButton emby-button hide';	
+		watchlistIcon.className = 'watchlist-icon detailButton emby-button button-flat hide';	
 		watchlistIcon.title = "Add to Watchlist";
 		watchlistIcon.dataset.active = 'false';