{
  config,
  fonts,
  accentColour,
  ...
}: {
  programs.wlogout = {
    enable = true;
    layout = [
      {
        label = "reboot";
        action = "systemctl reboot";
        text = "Reboot";
        keybind = "r";
      }
      {
        label = "shutdown";
        action = "systemctl poweroff";
        text = "Shutdown";
        keybind = "s";
      }
      {
        label = "logout";
        action = "swaymsg exit";
        text = "Logout";
        keybind = "l";
      }
    ];
    style = with config.scheme.withHashtag; let
      accent = config.scheme.withHashtag.${accentColour};
      shutdownIcon = ./icons/shutdown.png;
      rebootIcon = ./icons/reboot.png;
      logoutIcon = ./icons/logout.png;
    in ''
      * {
        font-size: ${toString fonts.sizes.popups}px;
        font-family: "${fonts.sansSerif.name}";
      }

      window {
        border: none;
        background-color: transparent;
      }

      button {
        border: ${accent};
        background-color: ${base00};
        background-repeat: no-repeat;
        background-position: center;
        background-size: 25%;
        box-shadow: none;
        margin: 5px;
        color: ${base05};
      }

      button:hover {
        background-color: ${base01};
        color: ${base05};
      }

      button:focus {
        background-color: ${base03};
        color: ${base05};
      }

      #shutdown {
        background-image: url("${shutdownIcon}");
      }

      #reboot {
        background-image: url("${rebootIcon}");
      }

      #logout {
        background-image: url("${logoutIcon}");
      }
    '';
  };
}