Theme the screen share picker

default/themed/hyprland-preview-share-picker.css.tpl

@@ -10,14 +10,14 @@
 
 * {
   all: unset;
-  font-family: JetBrains Mono NF;
+  font-family: monospace;
   color: @foreground;
   font-weight: bold;
   font-size: 16px;
 }
 
 .window {
-  background: alpha(@background, 0.95);
+  background: @background;
   border: solid 2px @accent;
   margin: 4px;
   padding: 18px;
@@ -32,12 +32,11 @@ tabs > tab {
 }
 
 .tab-label {
-    color: @text;
+    color: alpha(@text, 0.6);
     transition: all 0.2s ease;
 }
 
 tabs > tab:checked > .tab-label, tabs > tab:active > .tab-label {
-    text-decoration: underline currentColor;
     color: @selected_tab;
 }
 
@@ -56,24 +55,24 @@ tabs > tab:focus > .tab-label {
 
 flowboxchild > .card, button > .card {
     transition: all 0.2s ease;
-    border: solid 2px transparent;
-    border-color: @background;
-    border-radius: 5px;
-    background-color: @card_bg;
+    border: solid 2px alpha(@accent, 0.5);
+    border-radius: 0;
+    background-color: alpha(@card_bg, 0.6);
     padding: 5px;
 }
 
 flowboxchild:hover > .card, button:hover > .card, flowboxchild:active > .card, flowboxchild:selected > .card, button:active > .card, button:selected > .card, button:focus > .card {
     border: solid 2px @accent;
+    background-color: @card_bg;
 }
 
 .image {
-    border-radius: 5px;
+    border-radius: 0;
 }
 
 .region-button {
     padding: 0.5rem 1rem;
-    border-radius: 5px;
+    border-radius: 0;
     background-color: @accent;
     color: @text_dark;
     transition: all 0.2s ease;
@@ -92,3 +91,38 @@ flowboxchild:hover > .card, button:hover > .card, flowboxchild:active > .card, f
     background-color: @muted;
     color: @background;
 }
+
+.restore-button {
+    padding: 0.35rem 0.75rem;
+    border: solid 2px alpha(@accent, 0.5);
+    background-color: alpha(@card_bg, 0.6);
+    transition: all 0.2s ease;
+}
+
+.restore-button:hover, .restore-button:focus {
+    border-color: @accent;
+    background-color: @card_bg;
+}
+
+.restore-button label {
+    font-size: 12px;
+    color: alpha(@text, 0.6);
+    margin-left: 0.5rem;
+}
+
+.restore-button:hover label, .restore-button:focus label {
+    color: @foreground;
+}
+
+.restore-button check {
+    min-width: 10px;
+    min-height: 10px;
+    border: solid 2px alpha(@accent, 0.5);
+    -gtk-icon-source: none;
+    transition: all 0.2s ease;
+}
+
+.restore-button check:checked {
+    border-color: @accent;
+    background-color: @accent;
+}