dotfiles/themes/KVJ/gtk-3.0/gtk.css

/* KVJ — GTK 3 theme, matched to foot.ini and Quickshell tokens. */
@define-color theme_bg_color #151515;
@define-color theme_fg_color #D0D0D0;
@define-color theme_base_color #181818;
@define-color theme_text_color #D0D0D0;
@define-color theme_selected_bg_color #6C99BB;
@define-color theme_selected_fg_color #F5F5F5;
@define-color theme_unfocused_bg_color #181818;
@define-color theme_unfocused_fg_color #D0D0D0;
@define-color theme_unfocused_base_color #151515;
@define-color theme_unfocused_text_color #D0D0D0;
@define-color borders #2F2F2F;
@define-color borders_focus #454545;
@define-color surface #202020;
@define-color surface_hover #282828;
@define-color surface_selected #303030;
@define-color accent #6C99BB;
@define-color success #7B9246;
@define-color warning #D3A04D;
@define-color danger #A53C23;
@define-color teal #5EA8A2;
@define-color muted #757575;

* {
  color: @theme_fg_color;
  font-family: "Maple Mono", "Liberation Mono", monospace;
  -GtkWidget-focus-line-width: 1;
  -GtkWidget-focus-padding: 2;
}

window,
window.background,
.background {
  background-color: @theme_bg_color;
  color: @theme_fg_color;
}

label:disabled,
button:disabled,
entry:disabled,
textview text:disabled {
  color: @muted;
}

entry,
spinbutton,
combobox entry,
textview text,
treeview.view,
list row,
.view {
  background-color: @theme_base_color;
  color: @theme_text_color;
  border-color: @borders;
  border-radius: 0;
  caret-color: #F5F5F5;
  outline-color: @accent;
}

entry:focus,
spinbutton:focus,
combobox:focus,
textview:focus,
treeview.view:focus,
button:focus {
  border-color: @borders_focus;
  box-shadow: inset 0 0 0 1px @accent;
}

selection,
entry selection,
textview text selection,
treeview.view:selected,
row:selected,
.view:selected {
  background-color: @theme_selected_bg_color;
  color: @theme_selected_fg_color;
}

button,
combobox button,
spinbutton button,
toolbar button {
  background-color: @surface;
  color: @theme_fg_color;
  border: 1px solid @borders;
  border-radius: 0;
  box-shadow: none;
  padding: 5px 9px;
}

button:hover,
combobox button:hover,
spinbutton button:hover,
toolbar button:hover {
  background-color: @surface_hover;
  border-color: @borders_focus;
}

button:active,
button:checked,
button:selected,
modelbutton:checked {
  background-color: @surface_selected;
  border-color: @borders_focus;
}

button.suggested-action,
button.suggested-action:hover {
  background-color: @accent;
  color: #151515;
  border-color: @accent;
}

button.destructive-action,
button.destructive-action:hover {
  background-color: @danger;
  color: #F5F5F5;
  border-color: @danger;
}

menu,
.menu,
popover,
popover.background,
tooltip,
tooltip.background {
  background-color: #181818;
  color: @theme_fg_color;
  border: 1px solid @borders;
  border-radius: 0;
  box-shadow: none;
}

menuitem,
modelbutton,
popover modelbutton {
  background-color: transparent;
  color: @theme_fg_color;
  border-radius: 0;
  padding: 5px 9px;
}

menuitem:hover,
menuitem:focus,
modelbutton:hover,
modelbutton:focus,
popover modelbutton:hover {
  background-color: @surface_hover;
  color: #F5F5F5;
  outline-color: @accent;
}

menuitem:checked,
modelbutton:checked {
  background-color: @surface_selected;
  color: @accent;
}

headerbar,
toolbar {
  background-color: #181818;
  color: @theme_fg_color;
  border: 0;
  border-bottom: 1px solid @borders;
  border-radius: 0;
  box-shadow: none;
}

headerbar button {
  padding: 4px 8px;
}

scrollbar trough {
  background-color: #151515;
  border-radius: 0;
}

scrollbar slider {
  background-color: #505050;
  border: 1px solid @borders;
  border-radius: 0;
  min-width: 7px;
  min-height: 7px;
}

scrollbar slider:hover {
  background-color: @accent;
}

progressbar trough,
levelbar trough {
  background-color: @surface;
  border: 1px solid @borders;
  border-radius: 0;
}

progressbar progress,
levelbar block.filled {
  background-color: @accent;
  border-radius: 0;
}

switch,
check,
radio {
  background-color: @surface;
  border: 1px solid @borders;
  border-radius: 0;
}

switch:checked,
check:checked,
radio:checked {
  background-color: @accent;
  border-color: @borders_focus;
  color: #151515;
}

*:backdrop {
  color: @theme_unfocused_fg_color;
}