/* SP v348: PC - thanh đường dẫn breadcrumb toàn app, không đụng mobile */
.pcBreadcrumb{
  display:none;
}

@media (min-width:1024px){
  :root{
    --pc-breadcrumb-height:36px; /* SP chỉnh chiều cao thanh đường dẫn PC tại đây */
  }

  .pcBreadcrumb{
    position:fixed;
    left:0;
    right:0;
    top:var(--pc-topbar-height, 62px);
    z-index:8990;
    height:var(--pc-breadcrumb-height);
    display:block;
    background:#fff;
    border-bottom:1px solid rgba(0,0,0,.08);
  }

  .pcBreadcrumb__inner{
    max-width:1180px; /* SP chỉnh chiều rộng ruột breadcrumb PC tại đây */
    height:100%;
    margin:0 auto;
    padding:0 18px;
    display:flex;
    align-items:center;
    gap:7px;
    overflow:hidden;
    white-space:nowrap;
    box-sizing:border-box;
    font-size:16px; /* SP chỉnh cỡ chữ breadcrumb PC tại đây */
    font-weight:500;
    line-height:1;
  }

  .pcBreadcrumb__item{
    appearance:none;
    -webkit-appearance:none;
    border:0;
    background:transparent;
    padding:0;
    margin:0;
    color:#ff2f86;
    font:inherit;
    line-height:1;
    cursor:pointer;
    max-width:220px;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
  }

  .pcBreadcrumb__item:hover{
    text-decoration:underline;
  }

  .pcBreadcrumb__item.is-current{
    color:#111;
    cursor:default;
    text-decoration:none;
    font-weight:588;
  }

  .pcBreadcrumb__sep{
    color:rgba(0,0,0,.38);
    font-size:15px;
    font-weight:500;
    line-height:1;
    flex:0 0 auto;
  }

  .pageShell{
    padding-top:calc(var(--pc-topbar-height, 62px) + var(--pc-breadcrumb-height)) !important;
  }

  body.is-create-route .pageShell{
    padding-top:calc(var(--pc-topbar-height, 62px) + var(--pc-breadcrumb-height)) !important;
  }

  /* SP v369: PC - ẩn thanh đường dẫn chỉ ở trang chủ, các trang khác giữ nguyên. */
  body.is-pc-breadcrumb-home .pcBreadcrumb{
    display:none !important;
  }

  body.is-pc-breadcrumb-home .pageShell{
    padding-top:var(--pc-topbar-height, 62px) !important;
  }

}

/* SP v351: PC - chốt đúng trang xem tin, đặt sau cùng để không bị file khác đè.
   Chỉ áp dụng PC, không ảnh hưởng mobile, không đụng logic. */
@media (min-width:1024px){
  body.is-post-detail-route #pageShell.pageShell > #page-post-detail.routePage[data-route-page="postDetail"].is-active,
  html body.is-post-detail-route main#pageShell > section#page-post-detail.routePage[data-route-page="postDetail"].is-active{
    width:800px !important; /* SP chỉnh chiều ngang trang xem tin PC tại đây */
    max-width:800px !important;
    min-width:800px !important;
    margin-left:auto !important;
    margin-right:auto !important;
    padding-left:0 !important;
    padding-right:0 !important;
    box-sizing:border-box !important;
  }

  body.is-post-detail-route #page-post-detail.routePage[data-route-page="postDetail"].is-active .detailPage,
  body.is-post-detail-route #page-post-detail.routePage[data-route-page="postDetail"].is-active .detailGallery,
  body.is-post-detail-route #page-post-detail.routePage[data-route-page="postDetail"].is-active .detailGallery__main,
  body.is-post-detail-route #page-post-detail.routePage[data-route-page="postDetail"].is-active .detailGallery__stage,
  body.is-post-detail-route #page-post-detail.routePage[data-route-page="postDetail"].is-active .detailPage__contentWrap{
    width:100% !important;
    max-width:100% !important;
    box-sizing:border-box !important;
  }

  body.is-post-detail-route #page-post-detail.routePage[data-route-page="postDetail"].is-active .detailPage__content,
  body.is-post-detail-route #page-post-detail.routePage[data-route-page="postDetail"].is-active .detailPage__content *{
    font-size:18px !important; /* SP chỉnh cỡ chữ nội dung tin đăng PC tại đây */
    line-height:1.6 !important;
  }
}

/* SP v363: PC only - chốt trang xem tin canh trái bằng mép logo top bar.
   Đặt ở cuối pc-breadcrumb.css để thắng đoạn v351 đang canh giữa bằng margin auto.
   Chỉ đổi vị trí layout PC, không đụng mobile, không đụng logic/chức năng. */
@media (min-width:1024px){
  :root{
    --pc-detail-logo-left-align:max(18px, calc((100vw - 1180px) / 2 + 18px)); /* SP: mép trái logo/top bar PC */
  }

  body.is-post-detail-route #pageShell.pageShell > #page-post-detail.routePage[data-route-page="postDetail"].is-active,
  html body.is-post-detail-route main#pageShell > section#page-post-detail.routePage[data-route-page="postDetail"].is-active,
  #page-post-detail.routePage.is-active,
  .routePage[data-route-page="postDetail"].is-active{
    margin-left:var(--pc-detail-logo-left-align) !important;
    margin-right:auto !important;
  }
}

/* SP v392: PC - ẩn thanh đường dẫn chỉ ở trang video, không đụng trang khác. */
@media (min-width:1024px){
  body.is-video-route .pcBreadcrumb{
    display:none !important;
  }

  body.is-video-route .pageShell{
    padding-top:var(--pc-topbar-height, 62px) !important;
  }

  body.is-video-route .videoReelList,
  body.is-video-route .videoTabPane,
  body.is-video-route .videoTabScroller{
    height:calc(100dvh - var(--pc-topbar-height, 62px)) !important;
  }

  body.is-video-route .videoReelItem{
    min-height:calc(100dvh - var(--pc-topbar-height, 62px)) !important;
    height:calc(100dvh - var(--pc-topbar-height, 62px)) !important;
  }

  body.is-video-route .videoReelFrame{
    width:min(560px, calc((100dvh - var(--pc-topbar-height, 62px) - 36px) * 9 / 16), calc(100vw - 32px)) !important;
    max-height:calc(100dvh - var(--pc-topbar-height, 62px) - 36px) !important;
  }
}
