@import "mocha.css";
#waybar {
  font-family:
    BlexMono Nerd Font,
    sans-serif;
  font-size: 16px;
}

#window {
  padding: 0 4px;
}

.modules-center {
  padding-right: 20px;
}

window#waybar {
  border: none;
  border-radius: 0;
  box-shadow: none;
  text-shadow: none;
  transition-duration: 0s;
  color: @text;
  background: @base;
}

#workspaces {
  margin: 0 5px;
}

#workspaces button {
  padding: 0 8px;
  color: @text;
  border-bottom: 2px solid @subtext0;
  border-radius: 0px;
  min-width: 25px;
  margin-right: 8px;
}

#workspaces button.visible {
  color: @subtext0;
}

#workspaces button.focused {
  border-bottom: 3px solid @mauve;
  font-weight: bold;
}

#workspaces button.urgent {
  border: 2px solid @red;
}

#workspaces button:hover {
  border-color: @blue;
  color: @blue;
}

/* Repeat style here to ensure properties are overwritten as there's no !important and button:hover above resets the colour */

#workspaces button.focused {
  color: @subtext0;
}
#workspaces button.focused:hover {
  color: @text;
}

#tray,
#mode,
#battery,
#temperature,
#cpu,
#memory,
#network,
#wireplumber,
#clock,
#idle_inhibitor,
#sway-language,
#backlight {
  padding: 2px 8px;
  margin: 2px 5px;
  color: @text;
}

#mode:hover,
#battery:hover,
#temperature:hover,
#cpu:hover,
#memory:hover,
#network:hover,
#wireplumber:hover,
#clock:hover,
#idle_inhibitor:hover,
#sway-language:hover,
#backlight:hover {
  background-color: @subtext1;
  color: @base;
}

#clock {
  font-weight: bold;
}

#battery.warning {
  color: @yellow;
}

#battery.critical {
  color: @red;
}

#battery.charging,
#battery.full {
  color: @green;
}

#battery.warning:hover,
#battery.critical:hover,
#battery.charging:hover,
#battery.full:hover {
  color: @base;
}

@keyframes blink {
  to {
    background-color: #ffffff;
    color: black;
  }
}