/* Cửa sổ PC nhóm forge (game/js/pcwin/forge.js): Cường hoá (equipenhance.ini), Lễ Quan, Đồ bộ · Hồn Thạch, Trang bị phụ, Tu Luyện.
   Khung equipenhance: ảnh game/assets/ui/pc/forge/enh.webp (tools/build_pcwin_forge.py) 294×394, toạ độ ini − (6, 28). docs/ui.md §9 */

/* hàng nút trang (page_button.spr: tab / tab1 rê / tab2 đang mở) */
.pf-tabs{display:flex;flex-wrap:wrap;gap:2px;margin:0 0 4px;justify-content:center}
.pf-tab,.pf-wrap .sys-gear-sub button,.pf-wrap .sys-power-sub button{flex:1 1 0;min-width:64px;min-height:24px;padding:2px 3px;border:0;border-radius:0;
  background:#1d3a35 content-box;border-image:url(../../assets/ui/pc/tab.webp) 4 fill / 4px stretch;color:#cfe3d8;font:12px/1.15 var(--font,inherit);
  text-shadow:0 1px 1px #000;cursor:pointer;white-space:normal;overflow-wrap:normal}   /* nhãn dài («Tu Luyện Châu») xuống dòng, không cắt «…» */
.pf-tab:hover,.pf-wrap .sys-gear-sub button:hover,.pf-wrap .sys-power-sub button:hover{border-image-source:url(../../assets/ui/pc/tab1.webp);filter:none}
.pf-tab.on,.pf-wrap .sys-gear-sub button.on,.pf-wrap .sys-power-sub button.on{border-image-source:url(../../assets/ui/pc/tab2.webp);background-color:#2c5a3a;color:#fff}

/* khung equipenhance */
.pf-enh{position:relative;width:294px;height:394px;margin:0 auto;background:url(../../assets/ui/pc/forge/enh.webp) 0 0/294px 394px no-repeat;flex:0 0 auto}
.pf-eq{position:absolute;left:128px;top:29px;width:38px;height:38px;display:flex;align-items:center;justify-content:center;cursor:pointer}
.pf-eq[hidden]{display:none}
.pf-eq.drop{outline:2px solid var(--title);outline-offset:1px}
.pf-cell{position:absolute;width:38px;height:38px;display:flex;align-items:center;justify-content:center;cursor:pointer}
.pf-cell.pre,.pf-eq .pre{opacity:.72}
.pf-cell.miss .slot{filter:grayscale(.8) brightness(.8)}
.pf-enh .slot.pf-s{width:36px;height:36px;aspect-ratio:auto;border:0;border-image:none;background:none}
.pf-enh .slot.pf-s .ic{width:32px;height:32px}
.pf-enh .slot.pf-s.q1{outline:1px solid #3f86d8;outline-offset:-2px}.pf-enh .slot.pf-s.q2{outline:1px solid #b072e8;outline-offset:-2px}
.pf-enh .slot.pf-s.q3{outline:1px solid #f09a3a;outline-offset:-2px}.pf-enh .slot.pf-s.q4{outline:1px solid #e8c06a;outline-offset:-2px}
.pf-n{position:absolute;right:1px;bottom:0;font-size:10px;line-height:1;color:#fff;text-shadow:0 0 2px #000,0 0 2px #000}
.pf-n.no{color:var(--red-t)}
.pf-ph{font-size:10px;line-height:1.05;color:#8f9a92;text-align:center;pointer-events:none}
.pf-msg{position:absolute;left:24px;top:86px;width:245px;height:82px;box-sizing:border-box;padding:2px 4px;overflow:auto;font-size:12px;line-height:14px;color:#a0c8b4;overscroll-behavior:contain}
.pf-msg.half{height:46px}
.pf-lst{position:absolute;left:24px;top:132px;width:245px;height:38px;box-sizing:border-box;padding:0 4px;overflow:auto;font-size:12px;line-height:15px;color:#dcdcdc;border-top:1px solid #3c403b}
.pf-li{display:flex;align-items:center;gap:4px;cursor:pointer;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-height:18px}
.pf-li.on{color:#ff8000}
.pf-li input{margin:0;flex:0 0 auto}
.pf-li small{color:var(--dim)}
.pf-ul{display:flex;justify-content:space-between;gap:6px;color:#8a8f8a;white-space:nowrap}
.pf-ul span{overflow:hidden;text-overflow:ellipsis}
.pf-ul.on{color:#dcdcdc}.pf-ul.on b{color:var(--gold)}
.pf-btns{position:absolute;left:10px;right:20px;top:366px;height:23px;display:flex;align-items:center;gap:4px}
.pf-btns .sp{flex:1}
.pf-btns .pf-ok,.pf-btns .pf-cancel{width:63px;min-height:21px;height:21px;padding:0;font-size:12px}
.pf-btns .pf-cancel{margin-left:28px}
.pf-btns .pf-x{min-height:21px;height:21px;padding:0 6px;font-size:12px}
.pf-chk{display:flex;align-items:center;gap:3px;font-size:12px;color:#141414;white-space:nowrap}
.pc-yellow{color:#ffe14a}.pc-red{color:#ff6a5a}.pc-green{color:#7be07b}.pc-gold{color:#ffc84a}.pc-blue{color:#7ab8ff}
.pf-msg .pc-red:first-child{display:block}

/* bảng chọn (vật phẩm / nguyên liệu) phủ trên khung chữ + lưới */
.pf-pick{position:absolute;left:14px;right:14px;top:80px;bottom:34px;z-index:2;overflow:auto;background:#0d1210f2;border:1px solid #6e726d;padding:4px 6px;font-size:12px;overscroll-behavior:contain}
.pf-pk-h{display:flex;align-items:center;gap:6px;margin-bottom:4px;color:var(--title)}
.pf-pk-h .sp{flex:1}
.pf-pk-r{display:flex;align-items:center;gap:4px;padding:2px 0;border-bottom:1px solid #26302b}
.pf-pk-r .n{flex:1;min-width:0;line-height:1.2;overflow:hidden;text-overflow:ellipsis}
.pf-pk-r .n small{color:var(--dim)}
.pf-pk-r .btn{min-width:28px;min-height:24px;padding:0 4px}
.pf-pk-g{display:grid;grid-template-columns:repeat(auto-fill,minmax(44px,1fr));gap:4px}
.pf-pk-i{display:flex;flex-direction:column;align-items:center;cursor:pointer;min-width:0}
.pf-pk-i .slot{width:36px;height:36px}
.pf-pk-i small{font-size:10px;color:var(--dim)}
.pf-pk-i.on .slot{outline:2px solid var(--title);outline-offset:-1px}
.pf-pk-t{display:flex;justify-content:space-between;gap:6px;color:#8a8f8a;padding:1px 0}
.pf-pk-t.on{color:#7be07b}

/* chân cửa sổ: tiền + nút sang cửa sổ khác */
.pf-foot{display:flex;flex-wrap:wrap;align-items:center;gap:4px;margin:4px auto 0;width:294px;max-width:100%;font-size:12px}
.pf-foot .sp{flex:1}
.pf-foot .btn{min-height:24px;padding:2px 6px;font-size:12px}
.pf-foot .money{display:inline-flex;align-items:center;gap:3px;color:var(--gold)}
.pf-note{color:var(--dim);font-size:12px}

/* nội dung kiểu danh sách (Đồ bộ, danh vọng, Trang bị phụ, Tu Luyện) */
.pf-list,.pf-wrap{min-width:0;font-size:12px}
.pf-list .sys-forge-row,.pf-list .sys-forge-suit{min-width:0}
.pf-list .sys-forge-row .n{min-width:0;overflow-wrap:anywhere}
.pf-wrap .sys-gear-sub,.pf-wrap .sys-power-sub{gap:2px;margin-bottom:4px}
.pf-wrap .sys-gear-box,.pf-wrap .sys-power-box,.pf-list .sys-forge-box{background:#0d1210;border-color:#4b514a;border-radius:0}

@media (max-width:820px),(max-height:500px){
  .pf-enh{transform-origin:top center}
  .pf-tab{min-height:30px}
  .pf-foot .btn{min-height:30px}
}
