fucked my pixelbuds module

waybar/style.css

@@ -10,7 +10,8 @@
 }
 
 window#waybar {
-  background-color: alpha(@base, 0.6);
+  /* background-color: alpha(@crust, 0.9); */
+  background-color: alpha(@base, 0.4);
   padding: 10px;
   transition-property: background-color;
   transition-duration: 0.5s;
@@ -33,20 +34,21 @@ window#waybar.hidden {
   /* Use box-shadow instead of border so the text isn't offset */
   padding: 6px 18px;
   margin: 6px 3px;
-  border-radius: 3px;
-  background-color: alpha(@base, 0.9);
-  color: @text;
+  border-radius: 4px;
+  background-color: @base;
+  color: @subtext0;
 }
 
 #workspaces button.active {
+  color: @text;
   border-bottom: 3px solid @green;
 }
 
 #workspaces button:hover {
   box-shadow: inherit;
   text-shadow: inherit;
-  background-color: @teal;
-  color: @base;
+  background-color: @surface0;
+  color: @text;
 }
 
 #workspaces button.urgent {
@@ -65,39 +67,35 @@ window#waybar.hidden {
 #network,
 #clock,
 #tray,
-#custom-pixelbuds,
-#custom-anc,
+#custom-pixelbuds_pro,
 #custom-audio-output,
 #custom-gpu-screen-recorder {
   border-radius: 4px;
   margin: 6px 3px;
-  padding: 6px 16px 6px 12px;
+  padding: 6px 12px;
   background-color: @base;
   color: @text;
 }
 
-#custom-anc.anc-active {
+#custom-pixelbuds_pro.anc-active {
     color: @teal; 
-  	border-bottom: 3px solid @teal;
 }
 
-#custom-anc.anc-aware {
+#custom-pixelbuds_pro.anc-aware {
     color: @yellow; 
-  	border-bottom: 3px solid @yellow;
 }
 
-#custom-anc.anc-off {
+#custom-pixelbuds_pro.anc-off {
     color: @text; 
-  	border-bottom: 3px solid @text;
 }
 
-#custom-anc.disconnected {
+#custom-pixelbuds_pro.disconnected {
+    color: @subtext1;
 }
 
 #custom-gpu-screen-recorder,
 #custom-gamemode {
 	color: @teal;
-	border-bottom: 3px solid @teal;
 }
 
 #custom-power {
@@ -107,7 +105,6 @@ window#waybar.hidden {
 #custom-gpu-screen-recorder.recording,
 #custom-gamemode.active {
   color: @red;
-  border-bottom: 3px solid @red;
 }
 
 #custom-tlp {
@@ -117,22 +114,18 @@ window#waybar.hidden {
 
 #custom-tlp.charging {
     color: @teal; 
-  	border-bottom: 3px solid @teal;
 }
 
 #custom-tlp.bat {
 	color: @sapphire;
-  	border-bottom: 3px solid @sapphire;
 }
 
 #custom-tlp.warning {
     color: @yellow; 
-  	border-bottom: 3px solid @yellow;
 }
 
 #custom-tlp.critical {
     color: @red; 
-  	border-bottom: 3px solid @red;
 	animation-name: blink;
 	animation-duration: 0.8s;
 	animation-timing-function: linear;
@@ -143,26 +136,28 @@ window#waybar.hidden {
 @keyframes blink {
   to {
     color: @yellow;
-  	border-bottom: 3px solid @yellow;
     opacity: 0.6;
   }
 }
 
 #custom-gpu-usage.max_usage {
   color: @maroon;
+  border-bottom: 3px solid @maroon;
 }
 
 #custom-gpu-usage.high_usage {
   color: @yellow;
+  border-bottom: 3px solid @yellow;
 }
 
 #custom-gpu-usage.normal_usage {
   color: @teal;
+  border-bottom: 3px solid @teal;
 }
 
-#memory,
-#cpu {
+#memory, #cpu {
   color: @teal;
+  border-bottom: 3px solid @teal;
 }
 
 
@@ -173,23 +168,21 @@ window#waybar.hidden {
 #wireplumber {
   color: @mauve;
   padding-right: 15px;
-  border-bottom: 3px solid @mauve;
 }
 
 #custom-audio-output {
   color: @mauve;
-  border-bottom: 3px solid @mauve;
 }
 
 #network {
   color: @mauve;
   padding-right: 15px;
+  border-bottom: 3px solid @mauve;
 }
 
 #clock {
   font-family: JetBrainsMono Nerd Font;
   color: @green;
-  border-bottom: 3px solid @green;
 }
 
 tooltip {
@@ -203,7 +196,22 @@ tooltip label {
   background-color: @base;
 }
 
-#custom-pixelbuds.connected {
-    color: @teal; /* A pleasant green */
-    border-bottom: 3px solid @teal;
+#battery.charging {
+  color: @green;
+  border-bottom: 3px solid @green;
 }
+
+#battery.critical {
+  color: @red;
+  border-bottom: 3px solid @red;
+}
+
+#battery.warning {
+  color: @yellow;
+  border-bottom: 3px solid @yellow;
+}
+
+#battery.bat {
+  color: @text;
+  border-bottom: 3px solid @text;
+}