From: Maximiliano Sandoval <msandova@gnome.org>
Date: Sun, 14 Jul 2024 13:46:10 +0200
Subject: css: Port to css variables

(cherry picked from commit 7240be27b02aca7ebde12e5653301371d37a0d8e)

Origin: upstream, after 3.0.1
---
 data/gtk/style-dark.css | 10 ++++++----
 data/gtk/style.css      | 44 ++++++++++++++++++++++----------------------
 meson.build             |  4 ++--
 3 files changed, 30 insertions(+), 28 deletions(-)

diff --git a/data/gtk/style-dark.css b/data/gtk/style-dark.css
index 7826a70..0083263 100644
--- a/data/gtk/style-dark.css
+++ b/data/gtk/style-dark.css
@@ -1,7 +1,9 @@
-@define-color remote_headerbar_bg_color       shade(@purple_5, 0.6);
-@define-color remote_headerbar_backdrop_color shade(@purple_5, 0.45);
+:root {
+  --headerbar-bg-oklch: 0.32 calc(c * 0.32) h;
+  --headerbar-backdrop-oklch: 0.27 calc(c * 0.27) h;
+}
 
 .remote-row list {
-  background-color: @remote_headerbar_bg_color;
-  color: @light_1;
+  background-color: oklch(from var(--accent-purple) var(--headerbar-bg-oklch));
+  color: var(--light-1);
 }
diff --git a/data/gtk/style.css b/data/gtk/style.css
index ee295c6..25cdb77 100644
--- a/data/gtk/style.css
+++ b/data/gtk/style.css
@@ -1,25 +1,25 @@
-@define-color remote_headerbar_bg_color       shade(@purple_1, 1.27);
-@define-color remote_headerbar_backdrop_color shade(@purple_1, 1.35);
-
-.remote .top-bar {
-  background-color: @remote_headerbar_bg_color;
+:root {
+  --headerbar-bg-oklch: 0.95 calc(c * 0.3) h;
+  --headerbar-backdrop-oklch: 0.9 calc(c * 0.25) h;
 }
 
-.remote:backdrop .top-bar {
-  background-color: @remote_headerbar_backdrop_color;
+window.remote .top-bar {
+  --headerbar-bg-color: oklch(from var(--accent-purple) var(--headerbar-bg-oklch));
+  --headerbar-backdrop-color: oklch(from var(--accent-purple) var(--headerbar-backdrop-oklch));
 }
 
-/* Unset remote styling for dialogs */
-.remote dialog .top-bar {
-  background-color: initial;
+window.remote .top-bar.raised {
+  --accent-bg-color: color-mix(in srgb, currentColor 75%, transparent);
+  --accent-color: oklab(from var(--accent-bg-color) var(--standalone-color-oklab));
 }
 
-.remote:backdrop dialog .top-bar {
-  background-color: initial;
+window.remote .top-bar.raised popover {
+  --accent-bg-color: var(--system-accent);
+  --accent-color: oklab(from var(--accent-bg-color) var(--standalone-color-oklab));
 }
 
 .remote-row list {
-  background: @remote_headerbar_bg_color;
+  background: oklch(from var(--accent-purple) var(--headerbar-bg-oklch));
 }
 
 .thin-progressbar trough, .thin-progressbar progress{
@@ -28,8 +28,8 @@
 
 .bubble {
   border-radius: 50%;
-  background: @insensitive_fg_color;
-  color: @accent_fg_color;
+  background: color-mix(in srgb, var(--window-fg-color) 50%, transparent);
+  color: var(--accent-fg-color);
   min-width: 30px;
   min-height: 30px;
 }
@@ -40,16 +40,16 @@
 }
 
 .active.bubble{
-  background-color: @accent_bg_color;
+  background-color: var(--accent-bg-color);
 }
 
 .inactive progressbar progress {
-  background-color: @insensitive_fg_color;
-  border-color: @insensitive_fg_color;
+  background-color: color-mix(in srgb, var(--window-fg-color) 50%, transparent);
+  border-color: color-mix(in srgb, var(--window-fg-color) 50%, transparent);
 }
 
 .inactive .heading:not(.bubble) {
-  color: @insensitive_fg_color;
+  color: color-mix(in srgb, var(--window-fg-color) 50%, transparent);
 }
 
 .queue-button button {
@@ -84,8 +84,8 @@
 
 listview.card {
   border-radius: 0;
-  color: @card_fg_color;
-  background: @card_bg_color;
+  color: var(--card-fg-color);
+  background: var(--card-bg-color);
 }
 
 listview.card row:hover{
@@ -101,7 +101,7 @@ listview.card row:hover{
 /* Drag overlay */
 .dragging-area-highlight {
   border-radius: 8px;
-  background-color: alpha(@blue_2, 0.35);
+  background-color: color-mix(in srgb, var(--blue-2) 35%, transparent);
   margin: 24px;
 }
 
diff --git a/meson.build b/meson.build
index a6f8eb6..36a8735 100644
--- a/meson.build
+++ b/meson.build
@@ -12,8 +12,8 @@ dependency('dbus-1')
 dependency('openssl', version: '>= 1.0')
 dependency('glib-2.0', version: '>= 2.76')
 dependency('gio-2.0', version: '>= 2.76')
-dependency('gtk4', version: '>= 4.12.0')
-dependency('libadwaita-1', version: '>=1.5.0')
+dependency('gtk4', version: '>= 4.15.3')
+dependency('libadwaita-1', version: '>=1.6')
 
 # Initialize project variables
 name       = 'Fragments'