/* 定位分页容器下的所有li标签，应用基础样式（核心修改border-radius） */
  .flex.space-x-2>li {
      width: 40px;
      /* 对应w-10 */
      height: 40px;
      /* 对应h-10 */
      display: flex;
      align-items: center;
      justify-content: center;
      border-radius: 6px;
      /* 圆角值，可根据需求调整（比如8px/4px），替代原来的50%圆形 */
      background-color: #ffffff;
      color: #4b5563;
      /* 对应text-neutral-600 */
      transition: background-color 0.3s, color 0.3s;
      /* 过渡动画保留 */
      cursor: pointer;
  }

  /* 非激活态li的hover效果 */
  .flex.space-x-2>li:not(.active):hover {
      background-color: #FFD700;
      /* 金色背景 */
      color: #ffffff;
      /* 白色文字 */
  }

  /* 激活态li的样式（active类） */
  .flex.space-x-2>li.active {
      background-color: #FFD700;
      color: #ffffff;
      font-weight: 500;
      /* 对应font-medium */
  }

  /* 让a标签完全填充li，保证点击区域完整 */
  .flex.space-x-2>li>a {
      width: 100%;
      height: 100%;
      display: flex;
      align-items: center;
      justify-content: center;
      text-decoration: none;
      /* 去除a标签默认下划线 */
      color: inherit;
      /* 继承li的文字颜色 */
  }

  /* 激活态下a标签的hover不生效 */
  .flex.space-x-2>li.active:hover {
      background-color: #FFD700;
      color: #ffffff;
  }

  .procat {
    position: relative;
  }
  .bottles-subcategories {
    position: absolute;
    left: -13%;
    flex-direction: column;
    top: 3vw;
    padding: 2rem 1rem;
    border: 1px solid #efefef;
  }
  .pro_cont p,.pro_cont span {
    text-wrap-mode: initial !important;
  }

@media (max-width: 1441px) {
    .bottles-subcategories {
        position: relative;
        left: inherit;
        flex-direction: inherit;
        top: inherit;
        padding: inherit;
        border: inherit;
    }
    .bottles-subcategories.shadow-card {
        --tw-shadow: inherit;
        --tw-shadow-colored: inherit;
        box-shadow: inherit;
    }
    .first-cate.justify-end,.bottles-subcategories.justify-end {
        justify-content: center;
    }
}