window.background.chromium {
  background-color: gtk("@theme_base_color");
  border-color: gtk("@borders");
  menubar,
  .menubar {
    color: gtk("@theme_fg_color");
    background-color: gtk("@theme_bg_color");
    &:backdrop {
      background-color: gtk("@theme_unfocused_bg_color");
      color: gtk("@theme_unfocused_fg_color");
    }
  }
  entry {
    background-color: gtk("@theme_base_color");
  }
  &.csd {
    menubar,
    .menubar {
      color: gtk("@theme_titlebar_foreground");
      background-color: gtk("@theme_titlebar_background");
      &:backdrop {
        background-color: gtk("@theme_titlebar_background_backdrop");
        color: gtk("@theme_titlebar_foreground_backdrop");
      }
    }
  }

  headerbar,
  .titlebar {
    button.titlebutton {
      &.close {
        color: transparent;
        background-image: -gtk-scaled(
          url("../assets/titlebutton-close.png"),
          url("../assets/titlebutton-close@2.png")
        );
        &:hover {
          background-image: -gtk-scaled(
            url("../assets/titlebutton-close-hover.png"),
            url("../assets/titlebutton-close-hover@2.png")
          );
        }
        &:active {
          background-image: -gtk-scaled(
            url("../assets/titlebutton-close-active.png"),
            url("../assets/titlebutton-close-active@2.png")
          );
        }
        &:backdrop {
          background-image: -gtk-scaled(
            url("../assets/titlebutton-close-backdrop.png"),
            url("../assets/titlebutton-close-backdrop@2.png")
          );
        }
      }

      &.maximize {
        color: transparent;
        background-image: -gtk-scaled(
          url("../assets/titlebutton-maximize.png"),
          url("../assets/titlebutton-maximize@2.png")
        );
        &:hover {
          background-image: -gtk-scaled(
            url("../assets/titlebutton-maximize-hover.png"),
            url("../assets/titlebutton-maximize-hover@2.png")
          );
        }
        &:active {
          background-image: -gtk-scaled(
            url("../assets/titlebutton-maximize-active.png"),
            url("../assets/titlebutton-maximize-active@2.png")
          );
        }
        &:backdrop {
          background-image: -gtk-scaled(
            url("../assets/titlebutton-maximize-backdrop.png"),
            url("../assets/titlebutton-maximize-backdrop@2.png")
          );
        }
      }
      &.minimize {
        color: transparent;
        background-image: -gtk-scaled(
          url("../assets/titlebutton-minimize.png"),
          url("../assets/titlebutton-minimize@2.png")
        );
        &:hover {
          background-image: -gtk-scaled(
            url("../assets/titlebutton-minimize-hover.png"),
            url("../assets/titlebutton-minimize-hover@2.png")
          );
        }
        &:active {
          background-image: -gtk-scaled(
            url("../assets/titlebutton-minimize-active.png"),
            url("../assets/titlebutton-minimize-active@2.png")
          );
        }
        &:backdrop {
          background-image: -gtk-scaled(
            url("../assets/titlebutton-minimize-backdrop.png"),
            url("../assets/titlebutton-minimize-backdrop@2.png")
          );
        }
      }
    }

    @at-root window.background.chromium.maximized headerbar,
      .maximized .titlebar {
      button.titlebutton {
        &.maximize {
          color: transparent;
          background-image: -gtk-scaled(
            url("../assets/titlebutton-maximize-maximized.png"),
            url("../assets/titlebutton-maximize-maximized@2.png")
          );
          &:hover {
            background-image: -gtk-scaled(
              url("../assets/titlebutton-maximize-maximized-hover.png"),
              url("../assets/titlebutton-maximize-maximized-hover@2.png")
            );
          }
          &:active {
            background-image: -gtk-scaled(
              url("../assets/titlebutton-maximize-maximized-active.png"),
              url("../assets/titlebutton-maximize-maximized-active@2.png")
            );
          }
          &:backdrop {
            background-image: -gtk-scaled(
              url("../assets/titlebutton-maximize-maximized-backdrop.png"),
              url("../assets/titlebutton-maximize-maximized-backdrop@2.png")
            );
          }
        }
      }
    }
  }
}
