@import "mocha.css";

* {
	font-family: Cantarell, "Font Awesome 6 Free", SymbolsNerdFont;
	font-weight: bold;
	font-size: 14px;
	min-height: 0px;
}

window#waybar {
	background-color: @transparent;
	transition-property: background-color;
	transition-duration: .5s;
	border-radius: 0px;
}

#workspaces {
	background-color: @mantle;
	margin: 4px 5px 4px 4px;
    padding: 3px;
	border-radius: 14px;
    border-color: @red;
    border-width: 3px;
    border-style: solid;
}
#workspaces button,
#workspaces button:hover,
#workspaces button.active {
	padding: 0px 4px;
	margin: 1px;
	border-radius: 10px;
}
#workspaces button {
    background-color: @mantle;
	color: @text;
}
#workspaces button:hover {
    background-color: @maroon;
	color: @base;
}
#workspaces button.active {
    background-color: @red;
    color: @base
}
#workspaces button.active:hover {
    background-color: @red;
	color: @base;
}

#custom-power, #custom-runner, #battery,
#backlight, #wireplumber, #wireplumber.muted,
#tray, #language, #clock, #cpu, #memory, #custom-spotify {
    background: @mantle;
    border-radius: 14px;
    border-color: @red;
    border-width: 3px;
    border-style: solid;
    color: @text;
    margin: 3px 2.5px 3px 2.5px;
}

#cpu, #memory, #custom-spotify, #battery {
	padding: 0px 10px;
}

#tray {
    margin: 3px 5px 3px 5px;
	padding: 0px 10px;
}

#backlight, #wireplumber, #wireplumber.muted {
	padding: 0px 10px;
    min-width: 55px;
}
#wireplumber.muted {
  color: @error;
}

#language {
	padding: 0px 10px;
    min-width: 40px;
}

#clock {
	padding: 0px 10px;
    margin: 3px 5px 3px 2.5px;
    font-size: 15px;
    min-width: 40px;
}