/* SP v325: PC - thân trang card bài viết 3 card ngang, lấy 100% dữ liệu/card từ app điện thoại, chỉ đổi cách hiển thị. */
.homeHcmPosts__nav{display:none;}
@media (min-width:1024px){
  :root{
    --pc-post-list-width:930px; /* SP: chiều rộng khu card bài viết PC */
    --pc-post-card-gap-x:18px; /* SP: khoảng cách ngang giữa 3 card */
    --pc-post-card-gap-y:18px; /* SP: khoảng cách dọc giữa các hàng card */
  }

  body.is-pc-post-list-layout #page-home #homePostList,
  body.is-pc-post-list-layout #page-search-results #searchResultsPostList{
    width:min(100%, var(--pc-post-list-width));
    max-width:var(--pc-post-list-width);
    margin-left:auto;
    margin-right:auto;
  }

  body.is-pc-post-list-layout #page-home .homeSection--latest,
  body.is-pc-post-list-layout #page-search-results .homeSection--latest{
    width:100%;
    margin-left:auto;
    margin-right:auto;
  }

  body.is-pc-post-list-layout #page-home .homePostsGrid,
  body.is-pc-post-list-layout #page-search-results .homePostsGrid,
  .homePostsGrid.pcPostCardGrid{
    display:grid !important;
    grid-template-columns:repeat(3, minmax(0, 1fr)) !important;
    gap:var(--pc-post-card-gap-y) var(--pc-post-card-gap-x) !important;
    align-items:start !important;
    width:100%;
    margin-left:auto;
    margin-right:auto;
  }

  body.is-pc-post-list-layout #page-home .postCard,
  body.is-pc-post-list-layout #page-search-results .postCard{
    min-width:0;
    width:100%;
  }

  body.is-pc-post-list-layout #page-home .postCard--boxed,
  body.is-pc-post-list-layout #page-search-results .postCard--boxed{
    width:100%;
    height:100%;
  }

  /* SP: Cụm Thành Phố Hồ Chí Minh vẫn nằm trọn 1 hàng riêng trong lưới PC. */
  body.is-pc-post-list-layout #page-home .homeHcmPosts{
    grid-column:1 / -1;
    width:100%;
  }



  /* SP v329: PC - cụm nút qua lại Thành Phố Hồ Chí Minh dạng nút dài bo tròn, mũi tên căn tâm tuyệt đối. */
  body.is-pc-post-list-layout #page-home .homeHcmPosts__head{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:16px;
    margin:0 0 12px 0;
  }

  body.is-pc-post-list-layout #page-home .homeHcmPosts__title{
    margin:0;
    text-align:left;
    font-size:20px;
    line-height:38px;
    font-weight:588;
  }

  body.is-pc-post-list-layout #page-home .homeHcmPosts__nav{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    flex:0 0 auto;
  }

  body.is-pc-post-list-layout #page-home .homeHcmPosts__navPill{
    width:112px; /* SP: chiều ngang nút qua/lại TP.HCM bản PC */
    height:38px; /* SP: chiều cao nút qua/lại TP.HCM bản PC */
    display:grid;
    grid-template-columns:1fr 1px 1fr;
    align-items:center;
    justify-items:stretch;
    border:1px solid rgba(0,0,0,.22);
    border-radius:999px;
    background:#fff;
    overflow:hidden;
  }

  body.is-pc-post-list-layout #page-home .homeHcmPosts__navBtn{
    position:relative;
    width:100%;
    height:38px;
    display:block;
    border:0;
    border-radius:0;
    background:transparent;
    color:#111;
    font-size:0;
    line-height:0;
    cursor:pointer;
    padding:0;
    margin:0;
    -webkit-tap-highlight-color:transparent;
  }

  body.is-pc-post-list-layout #page-home .homeHcmPosts__navBtn::before{
    content:"";
    position:absolute;
    left:50%;
    top:50%;
    width:7px; /* SP: độ lớn mũi tên nút qua/lại TP.HCM */
    height:7px; /* SP: độ lớn mũi tên nút qua/lại TP.HCM */
    border-top:2px solid #111;
    border-right:2px solid #111;
    transform-origin:center;
  }

  body.is-pc-post-list-layout #page-home .homeHcmPosts__navBtn--prev::before{
    transform:translate(-40%, -50%) rotate(-135deg);
  }

  body.is-pc-post-list-layout #page-home .homeHcmPosts__navBtn--next::before{
    transform:translate(-60%, -50%) rotate(45deg);
  }

  body.is-pc-post-list-layout #page-home .homeHcmPosts__navDivider{
    width:1px;
    height:22px;
    background:rgba(0,0,0,.16);
    align-self:center;
    justify-self:center;
  }

  body.is-pc-post-list-layout #page-home .homeHcmPosts__navBtn:hover{
    background:#f7f7f7;
  }

  body.is-pc-post-list-layout #page-home .homeSection__moreBtn,
  body.is-pc-post-list-layout #page-search-results .homeSection__moreBtn{
    margin-top:22px;
  }
}
