::deep {
    .mud-appbar {
        // Add margins to allow resizing the window.
        $resize-marging: 4px;
        height: var(--mud-appbar-min-height);

        .mud-toolbar-appbar {
            // Electron titlebar drag
            -webkit-app-region: drag;
            -webkit-user-select: none;
            min-height: var(--mud-appbar-min-height);
            margin: $resize-marging $resize-marging 0 $resize-marging;
            padding-left: 0;
            // Flatten the right side icons and make them match Windows' style.
            padding-right: 0;

            // Menu Icon.
            > button:first-child {
                right: 0;
                margin-left: calc(-#{$resize-marging} + 2px);
            }

            // Window icon.
            .icon {
                width: var(--mud-appbar-min-height);
                height: var(--mud-appbar-min-height);
                margin-top: calc(-#{$resize-marging} * 2);
                margin-right: 2px;
                padding: 0 5px;

                img {
                    display: block;
                    width: 100%;
                    height: 100%;
                    object-fit: contain;
                    image-rendering: -webkit-optimize-contrast;
                }
            }

            // Window title.
            p {
                margin-top: -8px;
            }

            // Window buttons.
            button {
                -webkit-app-region: no-drag;
                margin: 0;
                top: -#{$resize-marging};
                right: -#{$resize-marging};
                width: calc(var(--mud-appbar-min-height) * 1.4);
                height: var(--mud-appbar-min-height);
                border-radius: 0;
                cursor: default;

                &.close-button:hover {
                    color: var(--mud-palette-error-text);
                    background-color: var(--mud-palette-error);
                }
            }
        }
    }
}
