* {
  font-family: JetBrains Mono;
  font-size: 11px;
}

@define-color bg_dim #1b1b1b;
@define-color bg0 #282828;
@define-color bg2 #32302f;
@define-color bg3 #45403d;
@define-color bg5 #5a524c;
@define-color fg1 #ddc7a1;
@define-color grey2 #a89984;
@define-color orange #e78a4e;
@define-color yellow #d8a657;
@define-color red #ea6962;
@define-color green #a9b665;
@define-color aqua #89b482;
@define-color blue #7daea3;
@define-color purple #d3869b;

window#waybar {
  background: @bg_dim;
  color: @fg1;
}

window#waybar.hidden {
  opacity: 0.2;
}

button {
  border-radius: 0;
  border: none;
}

#workspaces button,
#mode,
#language,
#custom-swaync {
  margin: 4px 6px 4px 0px;
  padding: 0 8px;
  border: 2px solid;
  border-radius: 4px;
  background: @bg0;
}

#workspaces button {
  padding: 0;
  min-width: 28px;
  border-color: @bg3;
  color: @fg1;
}

#workspaces button:last-child,
#mode,
#clock,
#custom-weather,
#custom-networkicon,
#custom-pulseaudioicon,
#custom-memoryicon,
#battery,
#backlight {
  margin: 4px 0px;
}

#workspaces button:hover,
#mode:hover,
#language:hover,
#custom-swaync:hover,
#clock:hover,
#custom-weather:hover,
#tray:hover,
#cpu:hover,
#memory:hover,
#network:hover,
#pulseaudio:hover,
#backlight:hover {
  background: @bg3;
}

#bluetooth:hover {
  background: @orange;
}

#workspaces button.focused {
  background: @orange;
  color: @bg_dim;
}

#workspaces button.focused:hover {
  background: @yellow;
}

#workspaces button.urgent {
  background: @red;
}

#mode {
  border-color: @red;
  color: @fg1;
}

#language {
  border-color: @grey2;
  color: @fg1;
}

#custom-swaync {
  margin: 4px 0px 4px 6px;
  min-width: 14px;
  border-color: @grey2;
}

#workspaces button

#network,
#cpu,
#memory,
#pulseaudio,
#network,
#tray,
#mpris,
#clock,
#custom-weather,
#battery {
  padding: 0 8px;
}

#network,
#cpu,
#memory,
#pulseaudio,
#tray,
#mpris {
  margin: 4px 6px 4px 0px;
}

#custom-cpuicon,
#custom-memoryicon,
#custom-networkicon,
#custom-pulseaudioicon,
#custom-batteryicon,
#backlight,
#bluetooth {
  color: @bg_dim;
}

#window,
#workspaces {
  margin: 0px 6px;
}

.modules-left > widget:first-child > #workspaces {
  margin-left: 6px;
}

#cpu,
#memory,
#network,
#pulseaudio,
#battery {
  border-top-right-radius: 4px;
  border-bottom-right-radius: 4px;
  border: 2px solid;
  color: @fg1;
}

#cpu,
#memory,
#network,
#pulseaudio,
#tray {
  background: transparent;
}

#clock,
#custom-weather,
#battery {
  background: @bg0;
}

#clock,
#custom-weather {
  border-top: 2px solid @grey2;
  border-bottom: 2px solid @grey2;
}

#clock {
  border-top-left-radius: 4px;
  border-bottom-left-radius: 4px;
  border-left: 2px solid @grey2;
}

#custom-weather {
  border-top-right-radius: 4px;
  border-bottom-right-radius: 4px;
  border-right: 2px solid @grey2;
}

#cpu {
  border-color: @green;
}

#memory {
  border-color: @blue;
}

#network {
  margin: 4px 0px;
  border-color: @purple;
}

#pulseaudio {
  border-color: @orange;
}

#battery {
  border-color: @aqua;
}

#custom-cpuicon,
#custom-memoryicon,
#custom-networkicon,
#custom-pulseaudioicon,
#custom-batteryicon {
  border-top-left-radius: 4px;
  border-bottom-left-radius: 4px;
  padding: 0 8px;
}

#custom-cpuicon,
#custom-batteryicon,
#backlight {
  margin: 4px 0px 4px 6px;
}

#custom-cpuicon {
  background: @green;
}

#custom-memoryicon {
  background: @blue;
}

#custom-networkicon {
  background: @purple;
}

#custom-pulseaudioicon {
  background: @orange;
}

#custom-batteryicon {
  background: @aqua;
}

#network.disconnected,
#pulseaudio.muted {
  color: @red;
}

#tray {
  border-radius: 4px;
  box-shadow: none;
  background: transparent;
}

#tray > .needs-attention {
  -gtk-icon-effect: highlight;
  background: @red;
}

#backlight,
#bluetooth {
  padding: 0 8px;
  border-radius: 4px;
  background: @yellow;
}

#bluetooth,
#workspaces-button {
  margin: 4px 6px 4px 0px;
}

#bluetooth.disabled {
  background: @red;
}
