.tabbarWrapper {
  display: flex;
  height: 50px;
  margin-bottom: constant(safe-area-inset-bottom); /* 兼容 iOS < 11.2 */
  margin-bottom: env(safe-area-inset-bottom); /* 兼容 iOS >= 11.2 */
  background-color: red;

  .tabbarItem {
    flex: 1;
    justify-content: center;
    align-items: center;
    display: flex;
    flex-direction: column;
    cursor: pointer;

    .tabbarTitle {
      font-size: 10px;
      color: var(--color-text-1);
    }

    .tabbarIcon {
      font-size: 24px;
      color: var(--color-text-1);
      line-height: 24px;
    }

    .tabbarIconImage {
      width: 24px;
      height: 24px;
    }
  }

  .tabbarItemActive {
    .tabbarTitle {
      color: var(--mtbird-primary-6);
    }

    .tabbarIcon {
      color: var(--mtbird-primary-6);
    }
  }
}