{ inputs, pkgs, ... }:

{
    programs.waybar = {
        enable = true;
        package = inputs.waybar.packages.${pkgs.system}.waybar;
        settings = {
            mainBar = {
                layer = "top";
                height = pkgs.lib.mkDefault 35;
                spacing = 4;
                # output = "DP-2"; # Fill in with host-specific config!
                modules-left = [ "wlr/taskbar" ];
                modules-center = [ "hyprland/workspaces" ];
                modules-right = [
                    "tray"
                    "wireplumber"
                    "battery"
                    "cpu#cpu2"
                    "cpu"
                    "memory"
                    "custom/temperature"
                    "clock"
                    "clock#clock2"
                ];
                "wlr/taskbar" = {
                    on-click = "activate";
                    on-click-right = "close";
                    format = "{icon}  {title:.20}";
                    all-outputs = true;
                };
                "wireplumber" = {
                    format = "{icon}   {volume}%";
                    format-muted = "";
                    on-click = "wpctl set-mute @DEFAULT_AUDIO_SINK@ toggle";
                    format-icons = [ "" "" "" ];
                };
                "hyprland/workspaces" = {
                    disable-scroll = true;
                    all-outputs = true;
                    warp-on-scroll = false;
                    format = "{name}";
                };
                "hyprland/window" = { max-length = 50; };
                tray = { spacing = 10; };
                "clock#clock2" = {
                    timezone = "Europe/Brussels";
                    format = "{:%H:%M:%S}";
                    interval = 1;
                };
                clock = {
                    timezone = "Europe/Brussels";
                    format = "{:%Y-%m-%d}";
                    interval = 3600;
                };
                cpu = {
                    format = "{max_frequency}GHz";
                    tooltip = false;
                    interval = 5;
                };
                "cpu#cpu2" = {
                    format = "CPU {usage}%";
                    tooltip = false;
                    interval = 5;
                };
                memory = {
                    interval = 5;
                    format = "{used:0.2f}G";
                };
                "custom/temperature" = {
                    interval = 5;
                    exec = pkgs.lib.mkDefault "echo TODO";
                };
                battery = {
                    states = {
                        warning = 30;
                        critical = 15;
                    };
                    format = "{icon}";
                    tooltip-format = "{capacity}% ({time})";
                    format-icons = [ " " " " " " " " " " ];
                    format-charging = "{capacity}% ";
                    format-full = "{capacity}% ";
                    format-alt = "{capacity}% {time} [{power:.2} W]";
                };
            };
        };
        style = ''
      * {
          /* `otf-font-awesome` is required to be installed for icons */
          font-size: 14px;
          font-weight: 500;
          font-family: "Noto Sans", "FontAwesome";
      }

      window#waybar {
          background-color: rgba(0, 0, 0, 0.2);
          color: #ffffff;
          transition-property: background-color;
          transition-duration: .5s;
      }

      button {
          border: none;
          border-radius: 0;
      }

      button:hover {
          background: inherit;
          box-shadow: inset 0 0 #ffffff;
      }
      #workspaces button {
          padding: 0 5px;
          background-color: transparent;
          color: #ffffff;
          border-radius: 2px;
      }

      #workspaces button:hover {
          background-color: #023269;
      }

      #workspaces button.focused {
          background-color: #023269;
      }

      #workspaces button.active {
          background-color: #023269;
      }

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


      #window,
      #clock.clock2,
      #clock,
      #memory,
      #disk,
      #custom-temperature,
      #backlight,
      #network,
      #pulseaudio,
      #wireplumber,
      #cpu.cpu2,
      #cpu,
      #battery,
      #memory,
      #tray {
          padding: 0 12px;
          border-radius: 7px;
          color: #ffffff;
          background-color: #1f2430;
          margin-left:2px;
          margin-right:2px;
      }

      #clock.clock2,
      #tray,
      #cpu,
      #battery,
      #custom-temperature {
          background-color: #023269;
      }

      #taskbar button {
          padding: 0 12px;
          border-radius: 7px;
          color: #ffffff;
          background-color: #1f2430;
          margin-left:3px;
          margin-right:3px;
      }
      #taskbar button.active {
          background-color: #023269;
      }

      #window {
          font-weight:400;
          margin-left:0;
      }
      window#waybar.empty #window {
          background-color: transparent;
      }

      #clock {
          margin-right:0;
      }

      /* 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;
      }

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

      #battery.critical:not(.charging) {
          background-color: #f53c3c;
          color: #ffffff;
          animation-name: blink;
          animation-duration: 0.5s;
          animation-timing-function: linear;
          animation-iteration-count: infinite;
          animation-direction: alternate;
      }

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

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

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