/* Phần DANH MỤC – khớp category() trong gen.py (đo 26/10 ở 1440 và 390). Nạp khi hk_v2("danhmuc"); mọi luật có tiền tố .hk-dm. */
.hk-dm .hk-khung{max-width:1240px;margin:0 auto;padding:0 24px}
.hk-dm .category-page-row{max-width:1240px;margin:0 auto;padding:0 24px 64px}
.hk-dm .category-page-row>.col{padding:0;max-width:100%;flex-basis:100%}
.hk-dm #main{background:#FFFFFF}
.hk-dm .hk-khung,.hk-dm .category-page-row{font-size:15px;line-height:1.55;color:var(--hk-chu)}
.hk-dm .duong-dan{font-size:13px;line-height:20.15px;color:var(--hk-chu-phu);display:flex;flex-wrap:wrap;gap:6px;padding:14px 0;margin:0;text-transform:none;letter-spacing:0;font-weight:400}
.hk-dm .duong-dan a{color:var(--hk-chu-phu)}
.hk-dm .dm-banner img{width:100%;height:auto;aspect-ratio:16/5;object-fit:cover;border-radius:8px;display:block;margin-bottom:18px}
.hk-dm .hk-dm-dau h1{margin:0;font-size:28px;line-height:43.4px;font-weight:600;color:var(--hk-chu);text-transform:none;letter-spacing:0}
.hk-dm .dm-gioi-thieu{margin:6px 0 0;color:var(--hk-chu-phu);max-width:820px;font-size:15px;line-height:23.25px}
.hk-dm .o-loai{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:14px;padding-top:20px}
.hk-dm .o-loai a{display:flex;flex-direction:column;gap:8px;color:var(--hk-chu);font-size:14px;line-height:21.7px;font-weight:500}
.hk-dm .o-loai img,.hk-dm .o-loai .o-trong{width:100%;height:auto;aspect-ratio:1;object-fit:cover;background:var(--hk-xam);border-radius:8px;display:block}
.hk-dm .o-loai span:not(.o-trong){color:var(--hk-chu-phu);font-weight:400;font-size:12.5px;line-height:19.375px}
.hk-dm .hk-dm-dau+.category-page-row{padding-top:24px}
.hk-dm .category-page-row .woocommerce-notices-wrapper:empty{display:none}

/* thanh lọc */
.hk-dm .thanh-loc{display:flex;flex-wrap:wrap;gap:10px;justify-content:space-between;align-items:center;border-top:1px solid var(--hk-vien);border-bottom:1px solid var(--hk-vien);padding:12px 0;margin:0 0 16px}
.hk-dm .loc-nhom{flex:1 1 auto;min-width:0}
.hk-dm .loc-phai{display:flex;align-items:center;gap:10px;color:var(--hk-chu-phu);font-size:14px;line-height:21.7px;margin-left:auto}
.hk-dm .loc-phai .woocommerce-result-count{margin:0;font-size:14px;color:var(--hk-chu-phu);display:inline}
.hk-dm .loc-phai .woocommerce-ordering{margin:0}
.hk-dm .loc-phai select.orderby{width:165px;height:38px;margin:0;font-size:14px;padding:8px 32px 8px 12px;border:1px solid #C9D0DB;border-radius:8px;background:#FFFFFF url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%231A1F29%22 stroke-width=%222%22%3E%3Cpath d=%22M6 9l6 6 6-6%22/%3E%3C/svg%3E") right 10px center/16px no-repeat;color:var(--hk-chu);box-shadow:none;-webkit-appearance:none;appearance:none}
.hk-dm .yith-wcan-filters{margin:0;padding:0;background:transparent}
.hk-dm .yith-wcan-filters .filters-container form{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin:0}
.hk-dm .loc-nhom .yith-wcan-filters,.hk-dm .loc-nhom .filters-container{margin:0!important;padding:0!important}
.hk-dm .yith-wcan-filters.horizontal .yith-wcan-filter{margin:0!important;position:relative}
.hk-dm .yith-wcan-filters.horizontal .yith-wcan-filter .filter-title{font-size:14px!important;line-height:21.7px!important;font-weight:400;color:var(--hk-chu)!important;text-transform:none;letter-spacing:0;padding:8px 32px 8px 12px!important;margin:0;border:1px solid #C9D0DB!important;border-radius:8px!important;background:#FFFFFF url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%231A1F29%22 stroke-width=%222%22%3E%3Cpath d=%22M6 9l6 6 6-6%22/%3E%3C/svg%3E") right 10px center/14px no-repeat;cursor:pointer;white-space:nowrap}
.hk-dm .yith-wcan-filters.horizontal .yith-wcan-filter .filter-title:after{display:none}
.hk-dm .yith-wcan-filters.horizontal .yith-wcan-filter.active .filter-title,.hk-dm .yith-wcan-filters.horizontal .yith-wcan-filter .filter-title.with-active{border-color:var(--hk-navy);color:var(--hk-navy);font-weight:600;background-color:#F7F9FC}
.hk-dm .yith-wcan-filters.horizontal .yith-wcan-filter .filter-content{position:absolute;top:calc(100% + 6px);left:0;z-index:20;min-width:240px;background:#FFFFFF;border:1px solid var(--hk-vien);border-radius:12px;box-shadow:0 12px 28px rgba(25,47,90,0.14);padding:8px}
.hk-dm .yith-wcan-filters .filter-items{margin:0;padding:0;display:flex;flex-direction:column}
.hk-dm .yith-wcan-filters .filter-item{margin:0;padding:0;list-style:none}
.hk-dm .yith-wcan-filters .filter-item label,.hk-dm .yith-wcan-filters .filter-item>a{display:flex;align-items:center;gap:10px;font-size:14.5px;line-height:22.475px;padding:9px 10px;border-radius:8px;color:var(--hk-chu);margin:0;cursor:pointer}
.hk-dm .yith-wcan-filters .filter-item label:hover{background:var(--hk-xam)}
.hk-dm .yith-wcan-filters .filter-item input[type=checkbox]{width:18px;height:18px;margin:0;border:1.5px solid #9AA3AF;border-radius:4px;flex-shrink:0;accent-color:var(--hk-navy)}
.hk-dm .yith-wcan-filters .filter-item .term-label{flex:1}
.hk-dm .yith-wcan-filters .filter-item .item-count{font-style:normal;color:#7A828E;font-size:13px;margin-left:auto}
.hk-dm .yith-wcan-filters .apply-filters,.hk-dm .yith-wcan-filters .filter-content .yith-wcan-filter-apply{margin-top:6px;width:100%;font-weight:600;font-size:14px;padding:9px;border:0;border-radius:8px!important;background:var(--hk-navy)!important;color:#FFFFFF;text-transform:none;letter-spacing:0;min-height:0;line-height:21.7px}
.hk-dm .yith-wcan-active-filters{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin:-4px 0 18px;font-size:14px;color:var(--hk-chu-phu)}
.hk-dm .yith-wcan-active-filters .active-filter{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin:0}
.hk-dm .yith-wcan-active-filters .active-filter-label{font-size:13.5px;padding:6px 10px;border-radius:999px;border:1px solid var(--hk-navy);background:#F7F9FC;color:var(--hk-navy);text-decoration:none}
.hk-dm .yith-wcan-reset-filters{border:0!important;background:transparent!important;text-decoration:underline;color:var(--hk-chu-phu)!important;font-size:14px;padding:0;text-transform:none;min-height:0;margin:0}
.hk-dm .yith-wcan-filters-opener{display:none}

/* lưới: 4 cột (hoặc 3) / tablet 3 / điện thoại 2 */
.hk-dm .products.row{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px 20px;margin:0!important;width:100%}
.hk-dm.hk-cot-3 .products.row{grid-template-columns:repeat(3,minmax(0,1fr))}
.hk-dm .products.row:before,.hk-dm .products.row:after{display:none}
.hk-dm .products.row>.product-small.col{width:auto;max-width:none;flex:none;padding:0;margin:0}

/* phân trang */
.hk-dm nav.woocommerce-pagination{padding:28px 0 0;margin:0}
.hk-dm .woocommerce-pagination ul.page-numbers{display:flex;gap:6px;justify-content:center;margin:0;padding:0;border:0}
.hk-dm .woocommerce-pagination ul.page-numbers li{margin:0;border:0}
.hk-dm .woocommerce-pagination .page-number i{font-size:16px;line-height:1}
.hk-dm .woocommerce-pagination .page-number{min-width:38px;height:38px;display:flex;align-items:center;justify-content:center;border:1px solid #C9D0DB;border-radius:6px!important;color:var(--hk-chu);font-size:14px;line-height:21.7px;font-weight:400;background:#FFFFFF;padding:0 6px}
.hk-dm .woocommerce-pagination .page-number.current{background:var(--hk-navy);border-color:var(--hk-navy);color:#FFFFFF}

/* cuối trang: SEO + FAQ, danh mục liên quan */
.hk-dm .muc{padding:44px 0 0}
.hk-dm .dm-cuoi{display:flex;flex-wrap:wrap;gap:32px}
.hk-dm .dm-cuoi .seo{flex:1 1 520px;min-width:0;color:#3A414C;max-width:820px}
.hk-dm .seo-noi{max-height:236px;overflow:hidden;position:relative}
.hk-dm .seo-noi:after{content:"";position:absolute;left:0;right:0;bottom:0;height:80px;background:linear-gradient(rgba(255,255,255,0),#FFFFFF)}
.hk-dm .seo.mo .seo-noi{max-height:none}.hk-dm .seo.mo .seo-noi:after{display:none}
.hk-dm .seo h2{font-size:20px;line-height:31px;font-weight:600;margin:0 0 8px}
.hk-dm .seo h3{font-size:16px;font-weight:600;margin:16px 0 6px}
.hk-dm .seo p{margin:0 0 10px}
.hk-dm .nut.vien{display:inline-flex;align-items:center;justify-content:center;margin-top:12px;padding:8px 16px;font-size:14px;font-weight:600!important;border:1.5px solid var(--hk-navy);border-radius:6px!important;background:#FFFFFF;color:var(--hk-navy);text-transform:none;letter-spacing:0;min-height:0;line-height:21.7px}
.hk-dm .dm-cuoi .faq{flex:1 1 360px;min-width:0}
.hk-dm .faq h2{font-size:20px;line-height:31px;font-weight:600;margin:0 0 4px}
.hk-dm .faq details{border-bottom:1px solid var(--hk-vien);padding:14px 0}
.hk-dm .faq summary{font-weight:500;cursor:pointer;font-size:15px;line-height:23.25px}
.hk-dm .faq details p{margin:8px 0 0;color:var(--hk-chu-phu)}
.hk-dm .dm-lien-quan h2{font-size:18px;font-weight:600;margin:0 0 12px}
.hk-dm .dm-lien-quan div{display:flex;flex-wrap:wrap;gap:8px}
.hk-dm .dm-lien-quan a{padding:7px 12px;border:1px solid var(--hk-vien);border-radius:6px;color:var(--hk-chu);font-size:14px;line-height:21.7px}

@media (max-width:1100px){
  .hk-dm .products.row,.hk-dm.hk-cot-3 .products.row{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media (max-width:849px){
  .hk-dm .hk-khung{padding:0 14px}
  .hk-dm .category-page-row{padding:0 14px 48px}
  .hk-dm .dm-banner{display:none}
  .hk-dm .hk-dm-dau h1{font-size:24px;line-height:37.2px}
  .hk-dm .yith-wcan-filters-opener{display:flex;align-items:center;gap:6px;font-size:14px;line-height:21.7px;padding:8px 12px;border:1px solid #C9D0DB;border-radius:8px!important;background:#FFFFFF!important;color:var(--hk-chu)!important;text-transform:none;letter-spacing:0;min-height:0;margin:0;font-weight:400}
  .hk-dm .yith-wcan-filters-opener i{display:none}
  .hk-dm .yith-wcan-filters-opener:before{content:"";width:16px;height:16px;background:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%222%22%3E%3Cpath d=%22M4 6h16M7 12h10M10 18h4%22/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23000%22 stroke-width=%222%22%3E%3Cpath d=%22M4 6h16M7 12h10M10 18h4%22/%3E%3C/svg%3E") center/contain no-repeat}
  .hk-dm .muc{padding-top:32px}
}
@media (max-width:849px){
  .hk-dm .thanh-loc{flex-wrap:nowrap}
  /* WP Rocket hoãn JS tới lần chạm đầu: trước đó YITH chưa đổi bộ lọc thành bảng -> ẩn, chỉ hiện khi bảng mở */
  .hk-dm .thanh-loc .yith-wcan-filters:not(.open){display:none!important}
  .hk-dm .loc-nhom{flex:0 0 auto}
  .hk-dm .yith-wcan-filters-opener,.hk-dm .loc-phai .woocommerce-result-count{white-space:nowrap;flex-shrink:0}
  .hk-dm .loc-phai{min-width:0}
  .hk-dm .loc-phai .woocommerce-ordering{min-width:0;flex:0 1 165px}
  .hk-dm .loc-phai select.orderby{width:100%}
  /* #main có z-index:30 (style.css cũ) -> bảng lọc không nổi lên trên header/thanh đáy; bỏ trong lúc bảng mở */
  .hk-dm.yith-wcan-preset-modal-open #main{z-index:auto}
  .hk-dm .filters-modal,.hk-dm .filters-modal .yith-wcan-filter,.hk-dm .filters-modal h3.mobile-only,.hk-dm .yith-wcan-filters.filters-modal .yith-wcan-filter .filter-title{text-align:left!important}
  .hk-dm .filters-modal .filters-container,.hk-dm .filters-modal form,.hk-dm .yith-wcan-filters.filters-modal .yith-wcan-filter{background:#FFFFFF!important}
  /* bảng lọc toàn màn hình (YITH .filters-modal) – khớp .loc-sheet của bản demo */
  .hk-dm .yith-wcan-filters.filters-modal{background:#FFFFFF!important;padding:0!important;margin:0!important;overflow:auto;z-index:100000;border-radius:0;box-shadow:none}
  .hk-dm .yith-wcan-filters.filters-modal.open{display:flex!important;flex-direction:column}
  .hk-dm .filters-modal .close-button{position:absolute;top:16px;right:16px;width:40px;height:40px;border-radius:50%;background:var(--hk-xam);font-size:0;display:flex;align-items:center;justify-content:center;color:#000000;z-index:2}
  .hk-dm .filters-modal .close-button:before{content:"✕";font-size:16px;line-height:1}
  .hk-dm .filters-modal .filters-container{flex:1 0 auto}
  .hk-dm .filters-modal h3.mobile-only{position:static!important;margin:0;padding:16px;border-bottom:1px solid var(--hk-vien);font-size:18px;font-weight:700;line-height:27.9px;color:var(--hk-chu);text-transform:none;letter-spacing:0}
  .hk-dm .filters-modal .filters-container form{display:block!important}
  .hk-dm .yith-wcan-filters.filters-modal .yith-wcan-filter{padding:16px!important;border-bottom:1px solid var(--hk-vien);display:flex;flex-direction:column;gap:10px}
  .hk-dm .yith-wcan-filters.filters-modal .yith-wcan-filter .filter-title{border:0!important;padding:0!important;background:none!important;font-weight:600!important;font-size:15px!important;line-height:23.25px!important;cursor:default}
  .hk-dm .yith-wcan-filters.filters-modal .yith-wcan-filter .filter-content{display:block!important;position:static!important;border:0;box-shadow:none;padding:0;min-width:0;background:transparent}
  .hk-dm .filters-modal .filter-items{flex-direction:row!important;flex-wrap:wrap;gap:8px}
  .hk-dm .yith-wcan-filters.filters-modal .filter-item label,.hk-dm .yith-wcan-filters.filters-modal .filter-item>a{padding:8px 12px!important;border:1px solid #C9D0DB;border-radius:999px!important;font-size:14px!important;line-height:21.7px!important;gap:4px!important;background:#FFFFFF}
  .hk-dm .filters-modal .filter-item input[type=checkbox]{display:none}
  .hk-dm .filters-modal .filter-item.active label,.hk-dm .filters-modal .filter-item.active>a{border-color:var(--hk-navy);background:var(--hk-navy);color:#FFFFFF}
  .hk-dm .filters-modal .filter-item .item-count{opacity:.7;font-size:12.5px;margin-left:0;color:inherit}
  .hk-dm .filters-modal .hk-ls-chan{position:sticky;bottom:0;display:flex;gap:10px;padding:12px 16px;background:#FFFFFF;border-top:1px solid var(--hk-vien);margin-top:auto}
  .hk-dm .filters-modal .hk-ls-chan .nut{flex:1;margin:0;padding:12px 22px;font-size:15px}
  .hk-dm .filters-modal .hk-ls-chan .main-modal-button{flex:1;position:static!important;display:flex!important;align-items:center;justify-content:center;margin:0;padding:12px 22px;border:1.5px solid var(--hk-navy);border-radius:6px!important;background:var(--hk-navy)!important;color:#FFFFFF!important;font-size:15px;font-weight:600!important;line-height:21.7px;text-transform:none;letter-spacing:0;min-height:0;width:auto}
}
@media (max-width:760px){
  .hk-dm .o-loai{grid-auto-flow:column;grid-template-columns:none;grid-auto-columns:30%;overflow-x:auto;scrollbar-width:none}
  .hk-dm .products.row,.hk-dm.hk-cot-3 .products.row{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px 12px}
}