/*
 Theme Name:   GeneratePress Child
 Theme URI:    https://generatepress.com
 Description:  Default GeneratePress child theme
 Author:       Tom Usborne
 Author URI:   https://tomusborne.com
 Template:     generatepress
 Version:      0.1
*/

/* Bật sticky sidebar khi cuộn lên top */
/* Chỉ bật sticky sidebar trên màn hình rộng (khi sidebar nằm cạnh content) */
@media (min-width: 768px) {
  /* Tạo biến mặc định: khoảng cách từ đỉnh trình duyệt đến nơi sidebar “dính” */
  :root { --gp-sticky-top: 50px; } /* chỉnh số này nếu header bạn cao/thấp hơn */

  /* GP thường dùng #right-sidebar / #left-sidebar cho cột sidebar */
  #right-sidebar,
  #left-sidebar {
    position: sticky;
    top: var(--gp-sticky-top);
    align-self: start; /* đảm bảo sticky hoạt động trong layout dạng flex/grid */
  }

  /* Phòng khi wrapper của sidebar vô tình cắt sticky */
  .sidebar,
  .widget-area {
    overflow: visible;
  }
}

/* Khi đang đăng nhập WP Admin có thanh admin bar 32px (hoặc 46px trên mobile) */
@media (min-width: 768px) {
  body.admin-bar #right-sidebar,
  body.admin-bar #left-sidebar {
    top: calc(var(--gp-sticky-top) + 32px);
  }
}
/* END Bật sticky sidebar khi cuộn lên top */


.breadcrumb-bar {
  background-color: #6bbdce;
  padding: 15px 20px;
}

.breadcrumb-inner {
  display: flex;
  justify-content: space-between;
  align-items: center;
  max-width: 1200px;
  margin: 0 auto;
}

.breadcrumb-left, .breadcrumb-left a {
  color: #333;
  font-size: 14px;
  word-break: break-word;
}

.breadcrumb-left strong {
  font-weight: 600;
  margin-right: 4px;
}

.breadcrumb-right .breadcrumb-back {
  background-color: #c9302c;
  color: #fff;
  padding: 8px 15px;
  border-radius: 4px;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: 5px;
  box-shadow: 0 2px 3px rgba(0,0,0,0.2);
  min-width: 71px;
  font-weight: 400;
}

.breadcrumb-right .breadcrumb-back:hover {
  background-color: #E60000;
}


/* Khối footer chứa DMCA + copyright (căn TRÁI) */
.site-footer .inside-site-info {
    justify-content: left;
    padding: 10px 20px;
}
.copyright-bar,
.vnjp-footer {
    display: flex;
    justify-content: flex-start; /* căn TRÁI */
    align-items: center;         /* thẳng hàng dọc */
    gap: 12px;                   /* khoảng cách giữa icon và chữ */
    padding: 10px 0;
}

/* Icon DMCA */
.dmca-badge img {
    height: 32px;
    width: auto;
    display: block;
}

/* Chữ copyright */
.copyright-bar span,
.vnjp-footer span {
    font-size: 14px;
    color: #ffffff;
}


/* =========================================================
   FIX: Hở khoảng trắng khi giao thoa menu chính <-> sticky
   + Giữ cơ chế sticky ổn định
   + Tắt toàn bộ transition/animation (transition: none)
   ========================================================= */
/* 1) GIỮ placeholder để tránh layout nhảy
      Nhưng ép nó có chiều cao đúng (bạn chỉnh 50px theo header thực tế) */
#sticky-placeholder{
  display:block !important;
  height:50px !important;          /* <-- đổi 60px theo chiều cao menu thật */
  margin:0 !important;
  padding:0 !important;
  border:0 !important;
}
/* 2) Tắt hiệu ứng để sticky không “trượt / fade” */
#sticky-navigation,
#sticky-navigation *{
  transition:none !important;
  animation:none !important;
}
/* 3) Không phá transform (bỏ transform:none)
      Chỉ giảm tối ưu kiểu will-change nếu cần */
#sticky-navigation{
  will-change:auto !important;
}


/* =========================================================
    Phần footer tự viết
    Hook ở Elements
   ========================================================= */
.vnjp-footer-block{
  background:#1c1c1c;
  color:#fff;
  padding:40px 0;
}

.vnjp-footer-grid{
  width:min(1200px,92%);
  margin:0 auto;
  display:grid;
  grid-template-columns: 1.2fr 1fr 1.2fr;
  gap:40px;
}

.vnjp-footer-h{
  margin:0 0 10px;
  font-size:22px;
}

.vnjp-footer-line{
  height:1px;
  background:rgba(255,255,255,.2);
  margin-bottom:18px;
}

.vnjp-footer-p{margin:0 0 14px; line-height:1.8; opacity:.9;}

.vnjp-footer-ul{list-style:none; padding:0; margin:0;}
.vnjp-footer-ul li{margin:10px 0;}
.vnjp-footer-ul a,
.vnjp-footer-social a{color:#fff; text-decoration:none; opacity:.9;}
.vnjp-footer-ul a:hover,
.vnjp-footer-social a:hover{opacity:1; text-decoration:underline;}

.vnjp-footer-social{display:flex; gap:14px; flex-wrap:wrap;}

@media (max-width: 900px){
  .vnjp-footer-grid{grid-template-columns:1fr; gap:24px;}
}



.vnjp-ad-slot{
  width:100%;
  display:block;
  box-sizing:border-box;
  overflow:hidden;
}
.vnjp-ad-slot::before{
  content:"";
  display:block;
  width:100%;
  height:100%;
  background-size: 200% 100%;
  animation: vnjp-ad-shimmer 1.4s infinite linear;
}
.vnjp-ad-slot.is-loaded::before{ display:none; }

@keyframes vnjp-ad-shimmer{
  0%{ background-position: 0% 0; }
  100%{ background-position: -200% 0; }
}

/* ===== 3 vị trí ===== */
/* 1) Trước content (in-article top) */
/*.vnjp-ad-before-content{ min-height: 180px; }*/

/* 2) Sau content (in-article bottom) */
/*.vnjp-ad-after-content{ min-height: 180px; }*/

/* 3) Bottom sidebar (desktop) */
/*.vnjp-ad-sidebar-bottom{ min-height: 150px; }*/

/* Responsive */
@media (min-width: 768px){
  .vnjp-ad-before-content,
  .vnjp-ad-after-content,
  .vnjp-ad-sidebar-bottom { min-height: 250px; }
}

/* Nếu sidebar bị hẹp trên mobile, cho sidebar-slot ẩn (tùy bạn) */
/*@media (max-width: 767px){
  .vnjp-ad-sidebar-bottom{ display:none; }
}*/

/* CLS: ESSB dưới bài (icon load / flex wrap) */
.essb_displayed_bottom.essb_links.essb_content_responsive,
ul.essb_links_list.essb_force_hide_name {
  min-height: 44px;
}

/* CLS: khối widget đầu sidebar (search / block) trên desktop */
@media (min-width: 768px) {
  .inside-right-sidebar > aside.widget_block:first-of-type,
  .inside-left-sidebar > aside.widget_block:first-of-type {
    min-height: 48px;
  }
  .inside-right-sidebar > aside.widget_block.widget_search,
  .inside-left-sidebar > aside.widget_block.widget_search {
    min-height: 52px;
  }
}