/* THANH CÔNG CỤ DÍNH DÙNG CHUNG + cột nội dung trả phí dùng chung (partials/toolbar-filter.ejs, partials/paid-aside.ejs, partials/paid-strip.ejs).
   Lớp gốc .jbar/.jdd/.jchip/.jside/.pb/.jcard nằm ở p-jobs.css (mẫu Tuyển dụng); tệp này chỉ thêm phần dùng chung cho các trang danh sách khác.
   JS: assets/js/p-toolbar.js · đo lường: assets/js/p-paid.js. Màu bản sắc theo trang: --tb-c (mặc định mint; labo xanh; vật tư tím). */

/* ---------- bố cục: danh sách rộng + cột phải trả phí ---------- */
.tlay{display:grid;grid-template-columns:minmax(0,1fr) 304px;gap:16px;align-items:start}
.tmain{min-width:0}
@media (max-width:1000px){.tlay{grid-template-columns:minmax(0,1fr) 260px}}
@media (max-width:720px){.tlay{grid-template-columns:minmax(0,1fr);gap:10px}}

/* ---------- thanh công cụ: khe phải (nút Danh sách / Khối / Bản đồ) đứng cạnh số kết quả ---------- */
.jf-r{display:flex;align-items:center;gap:6px;flex:none}
.jf-r .vt{border-radius:var(--r-s)}
.jf-r .vt button{width:30px;height:28px;font-size:15px}
@media (min-width:761px){
  .jf-top .jf-r{order:4;margin-left:auto}
  .jf-top:has(.jf-r) .cnt{margin-left:0}
}
@media (max-width:760px){
  .jf-top .jf-r{order:1}
  .jf-top .jf-open{order:2}
  .jf-r .vt button{width:34px;height:34px}
}
.jdd-wide{min-width:280px}
.jdd-p .ck .ph-fill{font-size:15px;flex:none}
.jsort .tab[disabled]{opacity:.55;cursor:wait}

/* màu bản sắc theo loại hồ sơ (chỉ nhấn nhẹ, phần lớn vẫn là mint/xanh chung) */
.jbar.t-blue .jdd.act .jdd-b,.jbar.t-blue .jf-open{border-color:var(--blue)}
.jbar.t-violet .jdd.act .jdd-b{border-color:#7c5cd6;background:#f1ecfc}
.jbar.t-violet .jdd .n,.jbar.t-violet .jf-open .n{background:#7c5cd6}

/* ---------- khối trả phí trong cột phải (khối chung của partials/paid-aside.ejs) ---------- */
.pb.pq-b header .pb-tag{margin-left:auto}
.pb-emp .nm b{font-size:14px}
.pb-emp .nm small{font-size:12px}
.pb-emp .bdg{white-space:nowrap}
.pb-off a{display:flex;gap:10px;align-items:flex-start;padding:9px 0;color:inherit}
.pb-off li+li{border-top:1px solid var(--line-2)}
.pb-off{list-style:none;margin:0;padding:0}
.pb-off .amt{flex:none;min-width:52px;text-align:center;font-size:12px;font-weight:800;line-height:1.2;padding:6px 6px;border-radius:var(--r-s);background:var(--orange-s);color:var(--orange-ink);border:1px dashed #f1cfa6}
.pb-off .amt.fl{background:var(--rose-s,#fdeaf0);color:#b42a56;border-color:#f3c3d3}
.pb-off .nm{min-width:0;flex:1}
.pb-off b{display:block;font-size:14px;font-weight:700;line-height:1.35;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.pb-off small{display:block;font-size:12px;color:var(--ink-3);margin-top:1px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pb-off a:hover b{color:var(--blue)}
.pb-ppl .lg{border-radius:50%}
.pb-theme-blue{border-top-color:var(--blue)}
.pb-theme-violet{border-top-color:#7c5cd6}
.pb-theme-blue .pb-tag{background:var(--blue-s);color:var(--blue)}
.pb-theme-violet .pb-tag{background:#f1ecfc;color:#5136b3}
.pb-cta .btn+.btn{margin-top:6px}
.pb-cta .btn-ghost{background:#fff;border:1px solid var(--line);color:var(--ink)}
.pb-cta .pb-note{margin-top:10px;font-size:12px;line-height:1.5;color:var(--ink-2);background:var(--bg-2);border-radius:var(--r-s);padding:8px 10px;display:flex;gap:7px}
.pb-cta .pb-note i{color:var(--orange-ink);font-size:15px;flex:none;margin-top:1px}
.pb-cta .pb-note a{color:var(--blue);font-weight:600}
.btn-violet{background:#7c5cd6;color:#fff;box-shadow:inset 0 -2px 0 rgba(0,0,0,.16)}
.btn-violet:hover{background:#6a49c2}
/* điện thoại, thanh có khe phải (Danh sách/Khối/Bản đồ): hàng 1 = số kết quả + nút Bộ lọc; hàng 2 = sắp xếp (vuốt ngang) + nút dạng xem */
@media (max-width:760px){
  .jf-top:has(.jf-r){flex-wrap:wrap;row-gap:6px}
  .jf-top:has(.jf-r) .cnt{order:1;flex:1 1 calc(100% - 130px);font-size:13px}
  .jf-top:has(.jf-r) .jf-open{order:2}
  .jf-top:has(.jf-r) .jsort{order:3;flex:1 1 calc(100% - 124px);min-width:0;max-width:calc(100% - 118px)}
  .jf-top:has(.jf-r) .jf-r{order:4}
  .jf-top:has(.jf-r) .cnt-x{display:none}
}
@media (max-width:760px){
  /* dải sắp xếp vuốt ngang: không thanh cuộn, mép mờ báo còn nữa */
  .jf-top .jsort{-webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 22px),transparent);mask-image:linear-gradient(90deg,#000 calc(100% - 22px),transparent);padding-right:14px}
}