@import "./colors.css";

* {
  border: none;
  border-radius: 0;
  font-family: 'DepartureMono Nerd Font';
  font-size: 10px;
  font-weight: bold;
  min-height: 10px;
}
window#waybar {
  background: rgba(0, 0, 0, 0);
}
/*
adds a margin around the edge of the taskbar, surrounding the modules,
spacing it out from the edge of the screen and windows below
*/
window#waybar > box {
  margin: 0px 12px;
}

tooltip {
  background: @colorbg;
  color: @colorfg;
  opacity: 0.9;
  padding: 4px;
  border-radius: 12px;
  border: 1px solid @color01;
}
tooltip label {
  background: rgba(0, 0, 0, 0);
  color: @colorfg;
}

#clock,
#memory,
#network,
#workspaces,
#taskbar,
#cpu,
#pulseaudio,
#privacy,
#tray,
#custom-media {
  background: @colorbg;
  color: @colorfg;
  opacity: 0.9;
  padding: 4px 16px;
  border-radius: 32px;
  border: 1px solid @color01;
}

/*
left-side modules
*/
#workspaces,
#taskbar,
#custom-media {
  margin: 4px 4px 4px 0px;
}

/*
center modules
*/
#clock {
  margin: 4px 0px 4px 0px;
}

/*
right-side modules
*/
#memory,
#network,
#cpu,
#pulseaudio,
#tray,
#privacy {
  margin: 4px 0px 4px 4px;
}

#workspaces,
#taskbar {
  padding: 0px;
}

#taskbar.empty {
  opacity: 0;
  padding: 0px;
  margin: 0px;
  border: none;
}
#tray.empty {
  opacity: 0;
  padding: 0;
  margin: 0;
  border: none;
}

/*
  connects the workspace and taskbar together :3
*/
/*
#workspaces {
  margin: 4px 0px 4px 12px;
  padding: 0px 8px 0px 0px;
  border-radius: 100px 0px 0px 100px;
  border-width: 1px 0px 1px 1px;
}
#taskbar {
  margin: 4px 0px 4px 0px;
  padding: 0px 0px 0px 8px;
  border-radius: 0px 100px 100px 0px;
}
*/

#cpu {
  margin: 4px 0 4px 0;
  border-radius: 32px 0px 0px 32px;
}
#memory {
  margin: 4px 0 4px 0;
  border-radius: 0px;
  border-width: 1px 0px 1px 0px;
}
#network {
  margin: 4px 0 4px 0;
  border-radius: 0px 32px 32px 0px;
}

#workspaces button {
  padding: 2px 4px;
  border-radius: 32px;
  color: @colorfg;
}
#workspaces button:hover {
  background: @colorfg;
  color: @colorbg;
  opacity: 0.8;
}
#workspaces button.active {
  background: @colorfg;
  color: @colorbg;
}

#taskbar button {
  padding: 2px 4px;
  border-radius: 32px;
  color: @colorfg;
}
#taskbar button:hover {
  background: @colorfg;
  color: @colorbg;
  opacity: 0.8;
}
#taskbar button.active {
  background: @colorfg;
  color: @colorbg;
}
/*
  icons in each button on the taskbar to correct
  for them not being properly centred sometimes :3
*/
#taskbar button box image {
  padding-left: 2px;
}