style.css

@import "colors/base16-tokyo-night-terminal-dark.css";

@define-color background  @base00;
@define-color foreground  @base02;

@define-color yellow      @base0A;
@define-color orange      @base09;
@define-color red         @base08;
@define-color magenta     @base0F;
@define-color violet      @base0E;
@define-color blue        @base0D;
@define-color cyan        @base0C;
@define-color green       @base0B;


* {
  border: none;
  border-radius: 0;
  font-family: Iosevka Nerd Font;
  font-size: 14px;
  min-height: 0;
}

window#waybar {
  background: @background;
  color: white;
}


#workspaces {
  background-color: @foreground;
  margin: 5px;
  margin-left: 10px;
  border-radius: 5px;
}
#workspaces button {
  padding: 2px 10px;
  color: @base07;
}

#workspaces button.focused {
  color: @base00;
  background-color: @base05;
  border-radius: 5px;
}

#workspaces button:hover {
  color: @red;
  border-radius: 5px;
}

#language {
    color: @base00;
    background-color: @base0F;
    border-radius: 5px;
    margin-right: 5px;
    margin-top: 5px;
    margin-bottom: 5px;
    margin-left: 0px;
    padding: 0px 10px;
}

#custom-date,
#clock,
#battery,
#pulseaudio,
#pulseaudio.microphone,
#network,
#memory,
#cpu, 
#tray {
  background-color: @foreground;
  padding: 2px 10px;
  margin: 5px 0px;
}

#clock {
  color: @blue;
  border-radius: 0px 5px 5px 0px;
  margin-right: 6px;
}

#battery {
  color: @green;
  margin-left: 5px;
  margin: 5px 0px;
  padding: 0 10px;
  border-top-left-radius: 5px;
  border-bottom-left-radius: 5px;
}

#battery.charging {
  color: @green;
}

#battery.warning:not(.charging) {
  background-color: #f7768e;
  color: #24283b;
  border-radius: 5px;
}

#battery.critical:not(.charging) {
  background-color: #fb4934;
  color: #24283b;
  border-radius: 5px;
}

#network {
  color: @magenta;
  border-radius: 5px 5px 5px 5px;
}


#pulseaudio {
  color: #e0af68;
  margin: 5px 0;
  padding: 0 10px;
  margin-left: 3px;
  border-top-left-radius: 5px;
  border-bottom-left-radius: 5px;
}

#pulseaudio.microphone {
  color: @base0F;
  margin: 5px 0;
  padding: 0 10px;
  border-radius: 0 5px 5px 0;
}


#memory {
  color: @base09;
  margin-left: 5px;
  margin: 5px 0;
  padding: 0 10px;
  margin-left: 3px;
  border-top-left-radius: 5px;
  border-bottom-left-radius: 5px;
}

#cpu {
  margin: 5px 0;
  padding: 0 10px;
  color: @base08;
  border-top-right-radius: 5px;
  border-bottom-right-radius: 5px;
  margin-right: 6px;
}


#tray {
  margin: 5px;
  margin-left: 0px;
  margin-right: 6px;
  border-radius: 5px;
  padding: 0 10px;
}

#tray > * {
  padding: 0 2px;
  margin: 0 2px;
}