There is an empty space between collapsed sidebar and the content body. How to resolve it?

Question

I am trying to make a web app using the shinydashboardPlus package, but I am encountering a layout challenge. Upon collapsing the left sidebar, an obvious gap persists between the navigation panel and the content body. I have been paid much efforts, although it didn't works.

My css code as follows:

tags$head(
tags$style(HTML('
    /* 修改整个 header 的高度 */
    .main-header .navbar {
      height: 70px !important;  /* 自定义高度（示例值） */
      min-height: 70px !important; /* 防止收缩 */
    }
    /* 调整标题和图标的位置 */
    .main-header .navbar .nav,
    .main-header .logo {
      height: 70px !important;
      line-height: 70px !important; /* 垂直居中 */
    }
    .sidebar-collapse {
      padding-left: 10px !important;
    }
    
    /* 确保内容区域左移彻底 */
    .sidebar-collapse .content-wrapper,
    .sidebar-collapse .main-footer {
      padding-left: 0px !important;
      padding-right: 100px !important;
      margin-left: -15px !important;  /* 与折叠后侧边栏宽度严格一致 */
    }
    
    .sidebar-collapse .sidebar-menu li > a {
      width: 50px; 
      text-align: center;
    }
    
    /* 折叠之后的header logo */
    .sidebar-collapse .main-header .logo {
       width: 80px !important; /* 与侧边栏折叠宽度一致 */
       padding-left: 0 !important; /* 清除默认内边距 */
       margin-left: -15px !important; /* 微调对齐 */
    }
    .sidebar-collapse .logo a {
       font-size: 0 !important;          /* 隐藏文字 */
    }
    .sidebar-collapse .logo img {
       height: 40px !important;          /* 图片缩小 */
    }
    
    /*** 修正sidebar ***/
    .main-sidebar {
      width: 250px !important;
      top: 20px !important;
    }
    .content-wrapper {
      margin-top: 70px !important;
    }
    .sidebar-toggle {
      width: auto !important;
      height: 100% !important;
      padding-left: 20px !important;
      padding-right: 20px !important;
      display: flex !important;
      align-items: center !important;
      transition: background 0.3s !important;
    }
    /* 折叠状态下的样式变化 */
    .sidebar-collapse .sidebar-toggle {
      width: auto !important;
      height: 100% !important;
      margin-left: -15px !important;
      padding-left: 20px !important;
      padding-right: 20px !important;
      display: flex !important;
      align-items: center !important;
      transition: background 0.3s !important;
    }
  ')))

I want to known which css element works.