.scrollbar {
  overflow-y: auto;
  overscroll-behavior: contain;
  scroll-behavior: smooth;
  &::-webkit-scrollbar {
    width: 0;
  }
}

.scrollbar-thin {
  overflow-y: auto;
  /* overscroll-behavior: contain; */
  scroll-behavior: smooth;
  --w: 7px;
  &::-webkit-scrollbar {
    width: var(--w);
  }
  &::-webkit-scrollbar-thumb {
    background-color: rgba(0, 0, 0, 0.2);
    border-radius: 3px;
  }
  &::-webkit-scrollbar-track {
    background-color: rgba(0, 0, 0, 0.1);
    border-radius: 3px;
  }
  /* 滚动条滑块悬停效果 */
  &::-webkit-scrollbar-thumb:hover {
    background: #555; /* 滑块悬停时的背景色 */
    cursor: grabbing;
  }
  &::-webkit-scrollbar-button {
    display: none; /* 隐藏滚动条按钮 */
  }
}

.multi-line-ellipsis {
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  line-clamp: var(--line);
  -webkit-line-clamp: var(--line);
}

@layer components {
  .tooltip-container {
    position: relative;
    display: inline-block;
  }

  .tooltip {
    position: fixed;
    z-index: 9999;
    padding: 6px 8px;
    border-radius: 4px;
    font-size: 14px;
    line-height: 1.4;
    color: #fff;
    background-color: rgba(0, 0, 0, 0.8);
    pointer-events: none;
    opacity: 0;
    transition: opacity 0.2s;
  }

  .tooltip.show {
    opacity: 1;
  }
}