@define-color foreground #eff0f1;
@define-color foreground-inactive #7f8c8d;
@define-color background #161616;
@define-color background-alt #31363b;

* {
    font-family: "NotoSans Nerd Font";
	font-size: 16px;
}
window#waybar {
    background-image: linear-gradient(to right, 
    #161616 0%, 
    #31363b  51%, 
    #161616  100%);
    
    color: #ffffff;
    transition-property: background-color;
    transition-duration: .5s;
}
#waybar {
	background-color: @background;
	color: @foreground;
}

#workspaces button {
	padding-left: 1em;
    padding-right: 1.3em;
    color: @foreground-inactive;
}

#workspaces button.focused {
    background-color: @background-alt;
    color: @foreground;
    border-radius: 1px;
}

#taskbar {
    color: @foreground;
}

#clock, #battery, #cpu, #memory, #network, #pulseaudio, #tray, #mode, #custom-poweroff {
    padding-left: 0.25em;
    padding-right: 0.25em;
}

#window {
    padding-left: 0.25em;
    padding-right: 0.5em;
}

#custom-poweroff {
    padding-left: 0;
    font-size: 22;
}
#custom-poweroff:hover {
    color: red;
}