{ config, pkgs, ... }:
{
	programs.waybar = {
		enable = true;
		settings = {
			mainBar = {
				layer = "top";
				position = "top";
				height = 30;
				modules-left = [ "hyprland/workspaces" "hyprland/mode" "hyprland/window" ];
				modules-center = [ "clock" ];
				modules-right = [
					"mpd"
					"idle_inhibitor"
					"pulseaudio"
					"network"
					"power-profiles-daemon"
					"cpu"
					"memory"
					"temperature"
					"backlight"
					"keyboard-state"
					"battery"
					"tray"
					"clock"
					"custom/power"
				];

				"hyprland/workspaces" = {
					format = "{name}";
				};
				"hyprland/window" = {
					max-length = 50;
				};
				clock = {
					format = "{:%Y-%m-%d %H:%M}";
					tooltip = false;
				};
				cpu = { format = "{usage}%"; };
				memory = { format = "{}%"; };
				network = {
					format-wifi = "{essid} ({signalStrength}%)";
					format-ethernet = "{ifname}: {ipaddr}/{cidr}";
				};
				battery = {
					format = "{capacity}%";
					format-charging = "⚡ {capacity}%";
				};
			};
		};
		style = ''
			* {
				/* `otf-font-awesome` is required to be installed for icons */
color: #565f89;
			 font-family: 'Font Awesome 6 Free Solid', Roboto, Helvetica, Arial, sans-serif;
			 font-size: 15px;
			 border-radius: 10px;
margin: 0px 5px 0px 5px;
				background-color: #1f2335
			}

		window#waybar {
			background-color: rgba(43, 48, 59, 0.5);
			border-bottom: 3px solid rgba(100, 114, 125, 0.5);
color: #ffffff;
			 transition-property: background-color;
			 transition-duration: .5s;
		}

		window#waybar.hidden {
opacity: 0.2;
		}

		/*
			 window#waybar.empty {
			 }
			 window#waybar.solo {
			 }
		 */

		window#waybar.termite {
		}

		window#waybar.chromium {
border: none;
		}

		button {
			/* Use box-shadow instead of border so the text isn't offset */
			box-shadow: inset 0 -3px transparent;
			/* Avoid rounded borders under each button name */
border: none;
				border-radius: 0;
		}

		/* https://github.com/Alexays/Waybar/wiki/FAQ#the-workspace-buttons-have-a-strange-hover-effect */
button:hover {
background: inherit;
						box-shadow: inset 0 -3px #ffffff;
			 }

			 /* you can set a style on hover for any module like this */

#workspaces button {
padding: 0 5px;
				 background-color: transparent;
color: #ffffff;
}

#workspaces button:hover {
background: rgba(0, 0, 0, 0.2);
}

#workspaces button.focused {
	background-color: #64727D;
	box-shadow: inset 0 -3px #ffffff;
}

#workspaces button.urgent {
	background-color: #eb4d4b;
}

#mode {
	/* background-color: #64727D; */
	box-shadow: inset 0 -3px #ffffff;
}

#clock,
#battery,
#cpu,
#memory,
#disk,
#temperature,
#backlight,
#network,
#pulseaudio,
#wireplumber,
#custom-media,
#tray,
#mode,
#idle_inhibitor,
#scratchpad,
#power-profiles-daemon,
#mpd {
padding: 0 10px;
				 /* color: #ffffff; */
}

#window,
#workspaces {
margin: 0 4px;
}

/* If workspaces is the leftmost module, omit left margin */
.modules-left > widget:first-child > #workspaces {
	margin-left: 0;
}

/* If workspaces is the rightmost module, omit right margin */
.modules-right > widget:last-child > #workspaces {
	margin-right: 0;
}

#clock {
	/* background-color: #64727D; */
}

#battery {
	/* background-color: #ffffff; */
	/* color: #000000; */
}

#battery.charging, #battery.plugged {
color: #4fd6be;
			 /* background-color: #26A65B; */
}

@keyframes blink {
	to {
		/* background-color: #ffffff; */
color: #000000;
	}
}

/* Using steps() instead of linear as a timing function to limit cpu usage */
#battery.critical:not(.charging) {
	/* background-color: #f53c3c; */
color: #ff007c;
			 animation-name: blink;
			 animation-duration: 0.5s;
			 animation-timing-function: steps(12);
			 animation-iteration-count: infinite;
			 animation-direction: alternate;
}

#power-profiles-daemon {
	padding-right: 15px;
}

#power-profiles-daemon.performance {
	/* background-color: #f53c3c; */
color: #c53b53;
}

#power-profiles-daemon.balanced {
	/* background-color: #2980b9; */
color: #565f89;
}

#power-profiles-daemon.power-saver {
	/* background-color: #2ecc71; */
color: #9d7cd8;
}

label:focus {
				/* background-color: #000000; */
			}

#cpu {
	/* background-color: #2ecc71; */
	/* color: #000000; */
}

#memory {
	/* background-color: #9b59b6; */
}

#disk {
	/* background-color: #964B00; */
}

#backlight {
	/* background-color: #90b1b1; */
}

#network {
	/* background-color: #2980b9; */
}

#network.disconnected {
	/* background-color: #f53c3c; */
}


#wireplumber {
	/* background-color: #fff0f5; */
	/* color: #000000; */
}

#wireplumber.muted {
	/* background-color: #f53c3c; */
}

#custom-media {
	/* background-color: #66cc99; */
color: #2a5c45;
			 min-width: 100px;
}

#custom-media.custom-spotify {
	background-color: #66cc99;
}

#custom-media.custom-vlc {
	background-color: #ffa000;
}

#temperature {
	/* background-color: #f0932b; */
}

#temperature.critical {
	background-color: #eb4d4b;
}

#tray {
	/* background-color: #2980b9; */
}

#tray > .passive {
	-gtk-icon-effect: dim;
}

#tray > .needs-attention {
	-gtk-icon-effect: highlight;
color: #eb4d4b;
}

#idle_inhibitor {
color: #2d3436;
}

#idle_inhibitor.activated {
	/* background-color: #ecf0f1; */
color: #2d3436;
}

#mpd {
	/* background-color: #66cc99; */
color: #2a5c45;
}

#mpd.disconnected {
	/* background-color: #f53c3c; */
}

#mpd.stopped {
	/* background-color: #90b1b1; */
}

#mpd.paused {
	/* background-color: #51a37a; */
}

#language {
background: #00b093;
color: #740864;
padding: 0 5px;
				 min-width: 16px;
}

#keyboard-state {
	/* background: #97e1ad; */
color: #000000;
padding: 0 0px;
				 min-width: 16px;
}

#keyboard-state > label {
padding: 0 5px;
}

#keyboard-state > label.locked {
background: rgba(0, 0, 0, 0.2);
}

#scratchpad {
	/* background: rgba(0, 0, 0, 0.2); */
}

#scratchpad.empty {
	background-color: transparent;
}

#privacy {
padding: 0;
}

#privacy-item {
padding: 0 5px;
color: white;
}

#privacy-item.screenshare {
	background-color: #cf5700;
}

#privacy-item.audio-in {
	background-color: #1ca000;
}

#privacy-item.audio-out {
	background-color: #0069d4;
}


#waybar {
	font-family: "SF Pro Display", Cantarell, Noto Sans, sans-serif;
	font-size: 16px;
}

#window {
padding: 0 10px;
}

window#waybar {
border: none;
				border-radius: 0;
				box-shadow: none;
				text-shadow: none;
				transition-duration: 0s;
color: rgba(217, 216, 216, 1);
background: #1a1b26; 
} 

#workspaces {
margin: 0 5px;
}

#workspaces button {
padding: 0 8px;
color: #565f89;
border: 3px solid rgba(9, 85, 225, 0);
				border-radius: 10px;
				min-width: 33px;
}

#workspaces button.visible {
color: #a9b1d6;
}

#workspaces button.active {
	border-top: 3px solid #7aa2f7;
	border-bottom: 3px solid #7aa2f7;
}

#workspaces button.urgent {
	background-color: #a96d1f;
color: white;
}

#workspaces button:hover {
	box-shadow: inherit;
	border-color: #bb9af7;
color: #bb9af7;
}

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

#workspaces button.focused {
color: #7aa2f7;
}
#workspaces button.focused:hover {
color: #bb9af7;
}

#pulseaudio:hover {
color: #565f89;
}

#pulseaudio {
	/* font-size: 26px; */
	/* background-color: #545c73; */
	/* color: #000000; */
}

#pulseaudio.muted {
	/* background-color: #c53b53; */
color: #c53b53;
}

#custom-recorder {
	font-size: 18px;
color:#ee2e24;
}

#tray,
#mode,
#battery,
#temperature,
#cpu,
#memory,
#network,
#pulseaudio,
#idle_inhibitor,
#sway-language,
#backlight,
#custom-storage,
#custom-cpu_speed,
#custom-powermenu,
#custom-spotify,
#custom-weather,
#custom-mail,
#custom-media {
padding: 0 5px;
				 /* border-top: 3px solid rgba(217, 216, 216, 0.5); */
}

#clock {
margin:     0px 5px 0px 5px;
						min-width:  30px;
}

#battery.warning {
color: rgba(255, 210, 4, 1);
}

#battery.critical {
color: rgba(238, 46, 36, 1);
}

#battery.charging {
color: rgba(217, 216, 216, 1);
}

#custom-storage.warning {
color: rgba(255, 210, 4, 1);
}

#custom-storage.critical {
color: rgba(238, 46, 36, 1);
}

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

		'';
	};
}