/* GTK NAMED COLORS ---------------- use responsibly! */
@define-color accent_bg_color RGB(130 170 255 / 80%);

@define-color destructive_bg_color #c01c28;
@define-color destructive_fg_color white;
@define-color success_bg_color #26a269;
@define-color success_fg_color white;
@define-color warning_bg_color #cd9309;
@define-color warning_fg_color RGB(0 0 0 / 80%);
@define-color error_bg_color #c01c28;
@define-color error_fg_color white;
@define-color accent_color oklab(from @accent_bg_color max(l, 0.85) a b);
@define-color destructive_color oklab(from @destructive_bg_color max(l, 0.85) a b);
@define-color success_color oklab(from @success_bg_color max(l, 0.85) a b);
@define-color warning_color oklab(from @warning_bg_color max(l, 0.85) a b);
@define-color error_color oklab(from @error_bg_color max(l, 0.85) a b);

@define-color window_bg_color #2e2f3d;
@define-color window_fg_color white;
@define-color view_bg_color @window_bg_color
@define-color view_fg_color white;
@define-color headerbar_bg_color @window_bg_color
@define-color headerbar_fg_color white;
@define-color headerbar_border_color white;
@define-color headerbar_backdrop_color @window_bg_color;
@define-color headerbar_shade_color RGB(46 47 61 / 8%);
@define-color headerbar_darker_shade_color RGB(0, 0, 6, 0.9);

@define-color sidebar_bg_color #3c3c4b;
@define-color sidebar_fg_color white;
@define-color sidebar_backdrop_color #3c3c4b;
@define-color sidebar_shade_color RGB(60 60 75/8%);
@define-color sidebar_border_color RGB(75 75 90/36%);
@define-color secondary_sidebar_bg_color #3c3c4b;
@define-color secondary_sidebar_fg_color white;
@define-color secondary_sidebar_backdrop_color #3c3c4b;
@define-color secondary_sidebar_shade_color RGB(0 0 6/25%);
@define-color secondary_sidebar_border_color RGB(0 0 6/36%);
@define-color card_bg_color RGB(180 200 255/15%);
@define-color card_fg_color white;
@define-color card_shade_color RGB(46 47 61/8%);
@define-color dialog_bg_color @window_bg_color;
@define-color dialog_fg_color white;
@define-color popover_bg_color @window_bg_color;
@define-color popover_fg_color white;
@define-color popover_shade_color RGB(0 0 6/25%);
@define-color thumbnail_bg_color @window_bg_color;
@define-color thumbnail_fg_color white;
@define-color shade_color RGB(0 0 6/25%);
@define-color scrollbar_outline_color RGB(0 0 12/95%);
@define-color blue_1 #99c1f1;
@define-color blue_2 #62a0ea;
@define-color blue_3 #3584e4;
@define-color blue_4 #1c71d8;
@define-color blue_5 #1a5fb4;
@define-color green_1 #8ff0a4;
@define-color green_2 #57e389;
@define-color green_3 #33d17a;
@define-color green_4 #2ec27e;
@define-color green_5 #26a269;
@define-color yellow_1 #f9f06b;
@define-color yellow_2 #f8e45c;
@define-color yellow_3 #f6d32d;
@define-color yellow_4 #f5c211;
@define-color yellow_5 #e5a50a;
@define-color orange_1 #ffbe6f;
@define-color orange_2 #ffa348;
@define-color orange_3 #ff7800;
@define-color orange_4 #e66100;
@define-color orange_5 #c64600;
@define-color red_1 #f66151;
@define-color red_2 #ed333b;
@define-color red_3 #e01b24;
@define-color red_4 #c01c28;
@define-color red_5 #a51d2d;
@define-color purple_1 #dc8add;
@define-color purple_2 #c061cb;
@define-color purple_3 #9141ac;
@define-color purple_4 #813d9c;
@define-color purple_5 #613583;
@define-color brown_1 #cdab8f;
@define-color brown_2 #b5835a;
@define-color brown_3 #986a44;
@define-color brown_4 #865e3c;
@define-color brown_5 #63452c;
@define-color light_1 #ffffff;
@define-color light_2 #f6f5f4;
@define-color light_3 #deddda;
@define-color light_4 #c0bfbc;
@define-color light_5 #9a9996;
@define-color dark_1 #77767b;
@define-color dark_2 #5e5c64;
@define-color dark_3 #3d3846;
@define-color dark_4 #241f31;
@define-color dark_5 #000000;

:root {
  --standalone-color-oklab: max(l, 0.85) a b;
  --accent-color: oklab(
    from var(--accent-bg-color) var(--standalone-color-oklab)
  );
  --destructive-color: oklab(
    from var(--destructive-bg-color) var(--standalone-color-oklab)
  );
  --success-color: oklab(
    from var(--success-bg-color) var(--standalone-color-oklab)
  );
  --warning-color: oklab(
    from var(--warning-bg-color) var(--standalone-color-oklab)
  );
  --error-color: oklab(
    from var(--error-bg-color) var(--standalone-color-oklab)
  );
  --active-toggle-bg-color: rgb(255 255 255 / 20%);
  --active-toggle-fg-color: #ffffff;
  --overview-bg-color: #2e2f3d;
  --overview-fg-color: #ffffff;
}

@import '../gtk-3.0/libadwaita.css';
@import '../gtk-3.0/libadwaita-tweaks.css';

* {
  border-radius: 20px;
}

window {
  border-radius: 20px;
  padding: 10px;
}

.maximize window {
  border-radius: 0px;
  padding: 0px;
}

window.maximize {
  border-radius: 0px;
  padding: 0px;
}
/* More customizations */
/* GTK3 */
button.titlebutton {
  color: transparent;
  min-width: 12px;
  min-height: 12px;
  padding: 0;
  margin: 0 2px;
  box-shadow: inset 0 -1px 0 0 alpha(white, 0.2),
    inset 0 1px 0 0 alpha(white, 0.3), inset 1px 0 0 0 alpha(white, 0.07),
    inset -1px 0 0 0 alpha(white, 0.07), 0 1px 3px rgba(0, 0, 0, 0.12),
    0 1px 2px rgba(0, 0, 0, 0.24);
}

button.titlebutton:backdrop {
  opacity: 0.5;
}

/*****************
   * Title buttons *
   *****************/
.raven .expander-button,
.raven .raven-header:not(.top) button.image-button,
widget > box.terminal-titlebar > button.image-button,
widget > box.terminal-titlebar > button.image-button.toggle,
.terminix-session-sidebar button.tilix-sidebar-close-button,
.tilix-session-sidebar button.tilix-sidebar-close-button,
.nemo-window toolbar.primary-toolbar > toolitem > box.raised > button,
.nemo-window toolbar.primary-toolbar > toolitem > box.linked.raised > button,
.nautilus-window headerbar > revealer > button,
.solid-csd headerbar:not(.default-decoration) button.titlebutton,
headerbar button.titlebutton,
.csd headerbar button.titlebutton,
.csd headerbar.default-decoration button.titlebutton,
.titlebar button.titlebutton,
.csd .titlebar button.titlebutton,
.titlebar.default-decoration button.titlebutton,
.csd .titlebar.default-decoration button.titlebutton,
row button.image-button,
check,
radio,
headerbar.default-decoration button.titlebutton,
headerbar button.suggested-action,
headerbar button.destructive-action,
headerbar button:not(.suggested-action):not(.destructive-action),
button.close,
button.circular {
  border-radius: 9999px;
  -gtk-outline-radius: 9999px;
}

headerbar,
.titlebar {
  padding: 0 14px;
}

.solid-csd headerbar:not(.default-decoration) button.titlebutton.close,
headerbar button.titlebutton.close,
.titlebar button.titlebutton.close {
  min-width: 12px;
  min-height: 12px;
  padding: 0;
  margin: 0 2px;
  color: transparent;
  background-color: rgba(0, 0, 0, 0.3);
  background-color: #f25056;
  box-shadow: inset 0 -1px 0 0 alpha(white, 0.2),
    inset 0 1px 0 0 alpha(white, 0.3), inset 1px 0 0 0 alpha(white, 0.07),
    inset -1px 0 0 0 alpha(white, 0.07), 0 1px 3px rgba(0, 0, 0, 0.12),
    0 1px 2px rgba(0, 0, 0, 0.24);
}

.solid-csd headerbar:not(.default-decoration) button.titlebutton.maximize,
headerbar button.titlebutton.maximize,
.titlebar button.titlebutton.maximize {
  min-width: 12px;
  min-height: 12px;
  padding: 0;
  margin: 0 2px;
  color: transparent;
  background-color: rgba(0, 0, 0, 0.3);
  background-color: #39ea49;
  box-shadow: inset 0 -1px 0 0 alpha(white, 0.2),
    inset 0 1px 0 0 alpha(white, 0.3), inset 1px 0 0 0 alpha(white, 0.07),
    inset -1px 0 0 0 alpha(white, 0.07), 0 1px 3px rgba(0, 0, 0, 0.12),
    0 1px 2px rgba(0, 0, 0, 0.24);
}

.solid-csd headerbar:not(.default-decoration) button.titlebutton.minimize,
headerbar button.titlebutton.minimize,
.titlebar button.titlebutton.minimize {
  min-width: 12px;
  min-height: 12px;
  padding: 0;
  margin: 0 2px;
  color: transparent;
  background-color: rgba(0, 0, 0, 0.3);
  background-color: #fac536;
  box-shadow: inset 0 -1px 0 0 alpha(white, 0.2),
    inset 0 1px 0 0 alpha(white, 0.3), inset 1px 0 0 0 alpha(white, 0.07),
    inset -1px 0 0 0 alpha(white, 0.07), 0 1px 3px rgba(0, 0, 0, 0.12),
    0 1px 2px rgba(0, 0, 0, 0.24);
}

#MozillaGtkWidget.background
  headerbar.titlebar.default-decoration
  button.titlebutton.close:hover,
.solid-csd headerbar:not(.default-decoration) button.titlebutton.close:hover,
headerbar button.titlebutton.close:hover,
.csd headerbar button.titlebutton.close:hover,
headerbar.default-decoration button.titlebutton.close:hover,
.csd headerbar.default-decoration button.titlebutton.close:hover,
.titlebar button.titlebutton.close:hover,
.csd .titlebar button.titlebutton.close:hover,
.titlebar.default-decoration button.titlebutton.close:hover,
.csd .titlebar.default-decoration button.titlebutton.close:hover {
  padding: 2px;
  margin: -2px 0;
  background-color: #f25056;
  color: rgba(255, 255, 255, 0.7);
  box-shadow: inset 0 -1px 0 0 alpha(white, 0.2),
    inset 0 1px 0 0 alpha(white, 0.3), inset 1px 0 0 0 alpha(white, 0.07),
    inset -1px 0 0 0 alpha(white, 0.07), 0 1px 3px rgba(0, 0, 0, 0.12),
    0 1px 2px rgba(0, 0, 0, 0.24);
}

#MozillaGtkWidget.background
  headerbar.titlebar.default-decoration
  button.titlebutton.maximize:hover,
.solid-csd headerbar:not(.default-decoration) button.titlebutton.maximize:hover,
headerbar button.titlebutton.maximize:hover,
.csd headerbar button.titlebutton.maximize:hover,
headerbar.default-decoration button.titlebutton.maximize:hover,
.csd headerbar.default-decoration button.titlebutton.maximize:hover,
.titlebar button.titlebutton.maximize:hover,
.csd .titlebar button.titlebutton.maximize:hover,
.titlebar.default-decoration button.titlebutton.maximize:hover,
.csd .titlebar.default-decoration button.titlebutton.maximize:hover {
  padding: 2px;
  margin: -2px 0;
  background-color: #39ea49;
  color: rgba(255, 255, 255, 0.7);
  box-shadow: inset 0 -1px 0 0 alpha(white, 0.2),
    inset 0 1px 0 0 alpha(white, 0.3), inset 1px 0 0 0 alpha(white, 0.07),
    inset -1px 0 0 0 alpha(white, 0.07), 0 1px 3px rgba(0, 0, 0, 0.12),
    0 1px 2px rgba(0, 0, 0, 0.24);
}

#MozillaGtkWidget.background
  headerbar.titlebar.default-decoration
  button.titlebutton.minimize:hover,
.solid-csd headerbar:not(.default-decoration) button.titlebutton.minimize:hover,
headerbar button.titlebutton.minimize:hover,
.csd headerbar button.titlebutton.minimize:hover,
headerbar.default-decoration button.titlebutton.minimize:hover,
.csd headerbar.default-decoration button.titlebutton.minimize:hover,
.titlebar button.titlebutton.minimize:hover,
.csd .titlebar button.titlebutton.minimize:hover,
.titlebar.default-decoration button.titlebutton.minimize:hover,
.csd .titlebar.default-decoration button.titlebutton.minimize:hover {
  padding: 2px;
  margin: -2px 0;
  background-color: #fac536;
  color: rgba(255, 255, 255, 0.7);
  box-shadow: inset 0 -1px 0 0 alpha(white, 0.2),
    inset 0 1px 0 0 alpha(white, 0.3), inset 1px 0 0 0 alpha(white, 0.07),
    inset -1px 0 0 0 alpha(white, 0.07), 0 1px 3px rgba(0, 0, 0, 0.12),
    0 1px 2px rgba(0, 0, 0, 0.24);
}

.solid-csd headerbar:not(.default-decoration) button.titlebutton.close:hover,
.solid-csd headerbar:not(.default-decoration) button.titlebutton.maximize:hover,
.solid-csd headerbar:not(.default-decoration) button.titlebutton.minimize:hover,
headerbar button.titlebutton.close:hover,
headerbar button.titlebutton.close:backdrop:hover,
headerbar button.titlebutton.maximize:hover,
headerbar button.titlebutton.maximize:backdrop:hover,
headerbar button.titlebutton.minimize:hover,
headerbar button.titlebutton.minimize:backdrop:hover,
.csd headerbar button.titlebutton.close:hover,
.csd headerbar button.titlebutton.close:backdrop:hover,
.csd headerbar button.titlebutton.maximize:hover,
.csd headerbar button.titlebutton.maximize:backdrop:hover,
.csd headerbar button.titlebutton.minimize:hover,
.csd headerbar button.titlebutton.minimize:backdrop:hover,
headerbar.default-decoration button.titlebutton.close:hover,
headerbar.default-decoration button.titlebutton.close:backdrop:hover,
headerbar.default-decoration button.titlebutton.maximize:hover,
headerbar.default-decoration button.titlebutton.maximize:backdrop:hover,
headerbar.default-decoration button.titlebutton.minimize:hover,
headerbar.default-decoration button.titlebutton.minimize:backdrop:hover,
.csd headerbar.default-decoration button.titlebutton.close:hover,
.csd headerbar.default-decoration button.titlebutton.close:backdrop:hover,
.csd headerbar.default-decoration button.titlebutton.maximize:hover,
.csd headerbar.default-decoration button.titlebutton.maximize:backdrop:hover,
.csd headerbar.default-decoration button.titlebutton.minimize:hover,
.csd headerbar.default-decoration button.titlebutton.minimize:backdrop:hover,
.titlebar button.titlebutton.close:hover,
.titlebar button.titlebutton.close:backdrop:hover,
.titlebar button.titlebutton.maximize:hover,
.titlebar button.titlebutton.maximize:backdrop:hover,
.titlebar button.titlebutton.minimize:hover,
.titlebar button.titlebutton.minimize:backdrop:hover,
.csd .titlebar button.titlebutton.close:hover,
.csd .titlebar button.titlebutton.close:backdrop:hover,
.csd .titlebar button.titlebutton.maximize:hover,
.csd .titlebar button.titlebutton.maximize:backdrop:hover,
.csd .titlebar button.titlebutton.minimize:hover,
.csd .titlebar button.titlebutton.minimize:backdrop:hover,
.titlebar.default-decoration button.titlebutton.close:hover,
.titlebar.default-decoration button.titlebutton.close:backdrop:hover,
.titlebar.default-decoration button.titlebutton.maximize:hover,
.titlebar.default-decoration button.titlebutton.maximize:backdrop:hover,
.titlebar.default-decoration button.titlebutton.minimize:hover,
.titlebar.default-decoration button.titlebutton.minimize:backdrop:hover,
.csd .titlebar.default-decoration button.titlebutton.close:hover,
.csd .titlebar.default-decoration button.titlebutton.close:backdrop:hover,
.csd .titlebar.default-decoration button.titlebutton.maximize:hover,
.csd .titlebar.default-decoration button.titlebutton.maximize:backdrop:hover,
.csd .titlebar.default-decoration button.titlebutton.minimize:hover,
.csd .titlebar.default-decoration button.titlebutton.minimize:backdrop:hover {
  color: transparent;
}

.solid-csd headerbar:not(.default-decoration) button.titlebutton.close:active,
.solid-csd
  headerbar:not(.default-decoration)
  button.titlebutton.maximize:active,
.solid-csd
  headerbar:not(.default-decoration)
  button.titlebutton.minimize:active,
.solid-csd headerbar:not(.default-decoration) button.titlebutton.close:checked,
.solid-csd
  headerbar:not(.default-decoration)
  button.titlebutton.maximize:checked,
.solid-csd
  headerbar:not(.default-decoration)
  button.titlebutton.minimize:checked,
.solid-csd
  headerbar:not(.default-decoration)
  button.titlebutton.close:backdrop:active,
.solid-csd
  headerbar:not(.default-decoration)
  button.titlebutton.maximize:backdrop:active,
.solid-csd
  headerbar:not(.default-decoration)
  button.titlebutton.minimize:backdrop:active,
.solid-csd
  headerbar:not(.default-decoration)
  button.titlebutton.close:backdrop:checked,
.solid-csd
  headerbar:not(.default-decoration)
  button.titlebutton.maximize:backdrop:checked,
.solid-csd
  headerbar:not(.default-decoration)
  button.titlebutton.minimize:backdrop:checked,
headerbar button.titlebutton.close:active,
headerbar button.titlebutton.close:checked,
headerbar button.titlebutton.close:backdrop:active,
headerbar button.titlebutton.close:backdrop:checked,
headerbar button.titlebutton.maximize:active,
headerbar button.titlebutton.maximize:checked,
headerbar button.titlebutton.maximize:backdrop:active,
headerbar button.titlebutton.maximize:backdrop:checked,
headerbar button.titlebutton.minimize:active,
headerbar button.titlebutton.minimize:checked,
headerbar button.titlebutton.minimize:backdrop:active,
headerbar button.titlebutton.minimize:backdrop:checked,
.csd headerbar button.titlebutton.close:active,
.csd headerbar button.titlebutton.close:checked,
.csd headerbar button.titlebutton.close:backdrop:active,
.csd headerbar button.titlebutton.close:backdrop:checked,
.csd headerbar button.titlebutton.maximize:active,
.csd headerbar button.titlebutton.maximize:checked,
.csd headerbar button.titlebutton.maximize:backdrop:active,
.csd headerbar button.titlebutton.maximize:backdrop:checked,
.csd headerbar button.titlebutton.minimize:active,
.csd headerbar button.titlebutton.minimize:checked,
.csd headerbar button.titlebutton.minimize:backdrop:active,
.csd headerbar button.titlebutton.minimize:backdrop:checked,
headerbar.default-decoration button.titlebutton.close:active,
headerbar.default-decoration button.titlebutton.close:checked,
headerbar.default-decoration button.titlebutton.close:backdrop:active,
headerbar.default-decoration button.titlebutton.close:backdrop:checked,
headerbar.default-decoration button.titlebutton.maximize:active,
headerbar.default-decoration button.titlebutton.maximize:checked,
headerbar.default-decoration button.titlebutton.maximize:backdrop:active,
headerbar.default-decoration button.titlebutton.maximize:backdrop:checked,
headerbar.default-decoration button.titlebutton.minimize:active,
headerbar.default-decoration button.titlebutton.minimize:checked,
headerbar.default-decoration button.titlebutton.minimize:backdrop:active,
headerbar.default-decoration button.titlebutton.minimize:backdrop:checked,
.csd headerbar.default-decoration button.titlebutton.close:active,
.csd headerbar.default-decoration button.titlebutton.close:checked,
.csd headerbar.default-decoration button.titlebutton.close:backdrop:active,
.csd headerbar.default-decoration button.titlebutton.close:backdrop:checked,
.csd headerbar.default-decoration button.titlebutton.maximize:active,
.csd headerbar.default-decoration button.titlebutton.maximize:checked,
.csd headerbar.default-decoration button.titlebutton.maximize:backdrop:active,
.csd headerbar.default-decoration button.titlebutton.maximize:backdrop:checked,
.csd headerbar.default-decoration button.titlebutton.minimize:active,
.csd headerbar.default-decoration button.titlebutton.minimize:checked,
.csd headerbar.default-decoration button.titlebutton.minimize:backdrop:active,
.csd headerbar.default-decoration button.titlebutton.minimize:backdrop:checked,
.titlebar button.titlebutton.close:active,
.titlebar button.titlebutton.close:checked,
.titlebar button.titlebutton.close:backdrop:active,
.titlebar button.titlebutton.close:backdrop:checked,
.titlebar button.titlebutton.maximize:active,
.titlebar button.titlebutton.maximize:checked,
.titlebar button.titlebutton.maximize:backdrop:active,
.titlebar button.titlebutton.maximize:backdrop:checked,
.titlebar button.titlebutton.minimize:active,
.titlebar button.titlebutton.minimize:checked,
.titlebar button.titlebutton.minimize:backdrop:active,
.titlebar button.titlebutton.minimize:backdrop:checked,
.csd .titlebar button.titlebutton.close:active,
.csd .titlebar button.titlebutton.close:checked,
.csd .titlebar button.titlebutton.close:backdrop:active,
.csd .titlebar button.titlebutton.close:backdrop:checked,
.csd .titlebar button.titlebutton.maximize:active,
.csd .titlebar button.titlebutton.maximize:checked,
.csd .titlebar button.titlebutton.maximize:backdrop:active,
.csd .titlebar button.titlebutton.maximize:backdrop:checked,
.csd .titlebar button.titlebutton.minimize:active,
.csd .titlebar button.titlebutton.minimize:checked,
.csd .titlebar button.titlebutton.minimize:backdrop:active,
.csd .titlebar button.titlebutton.minimize:backdrop:checked,
.titlebar.default-decoration button.titlebutton.close:active,
.titlebar.default-decoration button.titlebutton.close:checked,
.titlebar.default-decoration button.titlebutton.close:backdrop:active,
.titlebar.default-decoration button.titlebutton.close:backdrop:checked,
.titlebar.default-decoration button.titlebutton.maximize:active,
.titlebar.default-decoration button.titlebutton.maximize:checked,
.titlebar.default-decoration button.titlebutton.maximize:backdrop:active,
.titlebar.default-decoration button.titlebutton.maximize:backdrop:checked,
.titlebar.default-decoration button.titlebutton.minimize:active,
.titlebar.default-decoration button.titlebutton.minimize:checked,
.titlebar.default-decoration button.titlebutton.minimize:backdrop:active,
.titlebar.default-decoration button.titlebutton.minimize:backdrop:checked,
.csd .titlebar.default-decoration button.titlebutton.close:active,
.csd .titlebar.default-decoration button.titlebutton.close:checked,
.csd .titlebar.default-decoration button.titlebutton.close:backdrop:active,
.csd .titlebar.default-decoration button.titlebutton.close:backdrop:checked,
.csd .titlebar.default-decoration button.titlebutton.maximize:active,
.csd .titlebar.default-decoration button.titlebutton.maximize:checked,
.csd .titlebar.default-decoration button.titlebutton.maximize:backdrop:active,
.csd .titlebar.default-decoration button.titlebutton.maximize:backdrop:checked,
.csd .titlebar.default-decoration button.titlebutton.minimize:active,
.csd .titlebar.default-decoration button.titlebutton.minimize:checked,
.csd .titlebar.default-decoration button.titlebutton.minimize:backdrop:active,
.csd .titlebar.default-decoration button.titlebutton.minimize:backdrop:checked {
  color: transparent;
}

.solid-csd headerbar:not(.default-decoration) button.titlebutton.close:backdrop,
.solid-csd
  headerbar:not(.default-decoration)
  button.titlebutton.maximize:backdrop,
.solid-csd
  headerbar:not(.default-decoration)
  button.titlebutton.minimize:backdrop,
headerbar button.titlebutton.close:backdrop,
headerbar button.titlebutton.maximize:backdrop,
headerbar button.titlebutton.minimize:backdrop,
.csd headerbar button.titlebutton.close:backdrop,
.csd headerbar button.titlebutton.maximize:backdrop,
.csd headerbar button.titlebutton.minimize:backdrop,
headerbar.default-decoration button.titlebutton.close:backdrop,
headerbar.default-decoration button.titlebutton.maximize:backdrop,
headerbar.default-decoration button.titlebutton.minimize:backdrop,
.csd headerbar.default-decoration button.titlebutton.close:backdrop,
.csd headerbar.default-decoration button.titlebutton.maximize:backdrop,
.csd headerbar.default-decoration button.titlebutton.minimize:backdrop,
.titlebar button.titlebutton.close:backdrop,
.titlebar button.titlebutton.maximize:backdrop,
.titlebar button.titlebutton.minimize:backdrop,
.csd .titlebar button.titlebutton.close:backdrop,
.csd .titlebar button.titlebutton.maximize:backdrop,
.csd .titlebar button.titlebutton.minimize:backdrop,
.titlebar.default-decoration button.titlebutton.close:backdrop,
.titlebar.default-decoration button.titlebutton.maximize:backdrop,
.titlebar.default-decoration button.titlebutton.minimize:backdrop,
.csd .titlebar.default-decoration button.titlebutton.close:backdrop,
.csd .titlebar.default-decoration button.titlebutton.maximize:backdrop,
.csd .titlebar.default-decoration button.titlebutton.minimize:backdrop {
  color: transparent;
  background-color: rgba(0, 0, 0, 0.12);
}

button.titlebutton image {
  margin: -1px;
}

/* gtk4 */

/*********************
 * GtkWindowControls *
 *********************/
windowcontrols > button {
  min-height: 12px;
  min-width: 12px;
  padding: 0px;
  margin-left: 2px;
  margin-right: 2px;
}

windowcontrols > button.minimize,
windowcontrols > button.maximize,
windowcontrols > button.close {
  color: transparent;
  background: none;
}

windowcontrols > button.minimize > image {
  background-color: #fdbe04;
  box-shadow: inset 0 -1px 0 0 alpha(white, 0.2),
    inset 0 1px 0 0 alpha(white, 0.3), inset 1px 0 0 0 alpha(white, 0.07),
    inset -1px 0 0 0 alpha(white, 0.07), 0 1px 3px rgba(0, 0, 0, 0.12),
    0 1px 2px rgba(0, 0, 0, 0.24);
}

windowcontrols > button.minimize:hover > image {
  padding: 3px;
  margin-right: -1px;
  margin-left: -1px;
}

windowcontrols > button.maximize > image {
  background-color: #38c76a;
  box-shadow: inset 0 -1px 0 0 alpha(white, 0.2),
    inset 0 1px 0 0 alpha(white, 0.3), inset 1px 0 0 0 alpha(white, 0.07),
    inset -1px 0 0 0 alpha(white, 0.07), 0 1px 3px rgba(0, 0, 0, 0.12),
    0 1px 2px rgba(0, 0, 0, 0.24);
}

windowcontrols > button.maximize:hover > image {
  padding: 3px;
  margin-right: -1px;
  margin-left: -1px;
}

windowcontrols > button.close > image {
  background-color: #fd5f51;
  box-shadow: inset 0 -1px 0 0 alpha(white, 0.2),
    inset 0 1px 0 0 alpha(white, 0.3), inset 1px 0 0 0 alpha(white, 0.07),
    inset -1px 0 0 0 alpha(white, 0.07), 0 1px 3px rgba(0, 0, 0, 0.12),
    0 1px 2px rgba(0, 0, 0, 0.24);
}

windowcontrols > button.close:hover > image {
  padding: 3px;
  margin-right: -1px;
  margin-left: -1px;
}
windowcontrols > button > image {
  padding: 2px;
}