如何更改bootstrap的分页颜色

<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css">
<link rel="stylesheet" href="custom.css">

/* 更改分页链接的背景颜色 */
.page-link {
  background-color: #your_color;
  color: #fff;
}

/* 更改分页链接的悬停背景颜色 */
.page-link:hover {
  background-color: #your_hover_color;
  color: #fff;
}

/* 更改分页链接的选中背景颜色 */
.page-item.active .page-link {
  background-color: #your_active_color;
  color: #fff;
}

<nav aria-label="Page navigation">
  <ul class="pagination">
    <li class="page-item"><a class="page-link" href="#">1</a></li>
    <li class="page-item"><a class="page-link" href="#">2</a></li>
    <li class="page-item"><a class="page-link" href="#">3</a></li>
    <!-- 更多分页链接 -->
  </ul>
</nav>