{pkgs, ...}: {
  programs.waybar = {
    enable = true;
    settings = { 
      mainBar = {
        "layer" = "top";
        "position" = "top";
        "mode" = "dock";
        "reload_style_on_change" = true;
        "gtk-layer-shell" = true;

        "modules-left" = [
          "hyprland/workspaces"
        ];

        "modules-center" = [
          "clock"
        ];

        "modules-right" = [
          "tray"
          "battery"
        ];

        "tray" = {
          "icon-size" = 12;
          "spacing" = 4;
        };

        "hyprland/workspaces" = {
          "persistent-workspaces" = {
            "1" = [];
            "2" = [];
            "3" = [];
            "4" = [];
            "5" = [];
          };
        };

        # "clock" = {
        #   "format" = "{ =%m-%d %H =%M}";
        # };

        "battery" = {
          "states" = {
            "warning" = 30;
            "critical" = 15;
            };

            "format" = "{icon} {capacity}%";
            "format-icons" = ["󰁼" "󰁽" "󰁾" "󰁿" "󰂀" "󰂁" "󰂂"];
            "format-warning" = "󰁻 {capacity}%";
            "format-critical" = "󱃍 {capacity}%";
            "format-charging" = "󱘖 {capacity}%";

            "interval" = 1;
            "min-length" = 6;
            "max-length" = 6;
        };
      };
    };
    style = "
    * {
      font-family: \"JetBrainsMono Nerd Font\";
      font-weight: bold;
      font-size: 12px;
      min-height: 0;
      padding: 0;
      border: none;
      margin: 2px;
    }

    /* === Main Background === */

    window#waybar {
      background: transparent;
    }

    /* === Workspace Buttons === */

    #workspaces button {
      border-radius: 8px;
      box-shadow: none;
      margin: 2px 0;
      padding: 0 2px;
      transition: none;
    }
    #workspaces button:hover {
      color: #11111b;
      background: #c7a4de;
      text-shadow: none;
      box-shadow: none;
    }
    #workspaces button.active {
      color: #11111b;
      background: #885ab0;
      margin: 3px 0;
      padding: 0 6px;
    }

    /* == Workspaces == */

    #workspaces {
      background: #11111b;
      padding: 0 4px;
      border-radius: 7px;
    }

    /* == Time == */

    #clock {
      background: #11111b;
      padding: 0 8px;
      border-radius: 7px;
    }

    /* == Battery == */

    #battery {
      background: #11111b;
      padding: 0 8px;
      border-radius: 7px;
    }

    /* == Tray == */

    #tray {
      background: #11111b;
      padding: 0 4px;
      border-radius: 7px;
    }
  ";
  };
}