/* NHIP v2.7 — GIAO DIỆN NHẬP LỆNH THỐNG NHẤT (theo mẫu phiếu lệnh: [−] ô số [+] + chip nhanh)
   Áp dụng cho: Lệnh chờ · TP/SL danh mục · Popup đặt lệnh trên biểu đồ · Thêm/gộp vị thế · Ghi tay.
   Nạp SAU cùng các css khác nên ghi đè kiểu cũ, không đổi logic. */
:root{--nx-r:10px;--nx-h:40px;--nx-btn:38px;--nx-gap:4px}

/* ---- Nhãn ô nhập ---- */
body .od-fields label>span,body .pt-fields label>span,body .nx-f>span,body .ol-pop label{font-size:11px;font-weight:700;color:var(--text2,var(--muted));letter-spacing:.03em}

/* ---- Bộ tăng/giảm: lưới 3 cột [−][ô][+] ---- */
body .od-st,body .ol-st,body .nx-step,body .pt-fields .od-st{display:grid;grid-template-columns:var(--nx-btn) minmax(0,1fr) var(--nx-btn);gap:var(--nx-gap)}
body .od-st button,body .ol-st button,body .nx-step button{all:unset;box-sizing:border-box;display:grid;place-items:center;min-height:var(--nx-h);width:auto;border:1px solid var(--line,#e3e8ed);background:var(--surface);color:var(--text);border-radius:var(--nx-r);font-size:18px;font-weight:600;cursor:pointer;user-select:none;-webkit-tap-highlight-color:transparent;transition:background .12s,transform .08s}
body .od-st button:first-child,body .od-st button:last-child,body .ol-st button:first-child,body .ol-st button:last-child{border-radius:var(--nx-r)}
body .od-st button:active,body .ol-st button:active,body .nx-step button:active{transform:scale(.94);background:var(--surface2,rgba(127,127,127,.1))}
body .od-st button:focus-visible,body .ol-st button:focus-visible,body .nx-step button:focus-visible,body .nx-chips button:focus-visible{outline:2px solid var(--brand,#14c29a);outline-offset:1px}
body .od-st .od-in,body .ol-st input,body .nx-step input,body .pt-fields .od-in{box-sizing:border-box;width:100%;min-width:0;min-height:var(--nx-h);height:auto;padding:6px 8px;border:1px solid var(--line,#e3e8ed);border-radius:var(--nx-r);background:var(--surface);color:var(--text);font:inherit;font-size:15px;font-weight:700;text-align:center}
body .od-st .od-in:focus,body .ol-st input:focus,body .nx-step input:focus{outline:2px solid var(--brand,#14c29a);outline-offset:-1px}
body .nx-step input::placeholder,body .od-st .od-in::placeholder{font-weight:500;opacity:.55}

/* ---- Hai ô cạnh nhau (số lượng | giá) ---- */
body .od-fields,body .pt-fields,body .nx-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}
body .nx-f{display:flex;flex-direction:column;gap:4px;min-width:0}
body .nx-f>input:not([type=checkbox]),body .nx-f>select{box-sizing:border-box;width:100%;min-height:var(--nx-h);padding:6px 10px;border:1px solid var(--line,#e3e8ed);border-radius:var(--nx-r);background:var(--surface);color:var(--text);font:inherit;font-size:14px}
@media(max-width:340px){body .od-fields,body .pt-fields,body .nx-grid{grid-template-columns:1fr}}

/* ---- Chip nhanh dạng viên thuốc ---- */
body .od-chips,body .pt-chips,body .ol-chips,body .nx-chips{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
body .od-chips button,body .pt-chips button,body .ol-chips button,body .nx-chips button{all:unset;box-sizing:border-box;display:inline-grid;place-items:center;min-height:32px;padding:4px 12px;border:1px solid var(--line,#e3e8ed);background:var(--surface);color:var(--text);border-radius:16px;font-family:inherit;font-size:12.5px;font-weight:600;line-height:1;cursor:pointer;-webkit-tap-highlight-color:transparent}
body .od-chips button:active,body .pt-chips button:active,body .ol-chips button:active,body .nx-chips button:active{background:var(--surface2,rgba(127,127,127,.12))}
body .pt-chips button:disabled{opacity:.4;cursor:not-allowed}
body .od-cl,body .ol-chips .ol-cl,body .pt-chips>b{font-size:11.5px;font-weight:800;padding:0 2px}

/* ---- Hộp chứa form: bo góc, viền nhẹ như phiếu lệnh ---- */
body .od-add,body .pt-form{border-radius:12px;gap:10px}
body .ol-pop{border-radius:12px;gap:10px;width:260px}

/* ---- Nút hành động chính cùng cỡ với nút Mua/Bán ---- */
body .od-go,body .pt-go,body .ol-ok{min-height:44px;border-radius:12px;font-weight:800;font-size:15px}

/* ---- Hàng chọn loại lệnh (TP/SL, chờ mua...) cùng kiểu thanh Mua/Bán ---- */
body .od-kinds,body .pt-kinds{display:grid;grid-auto-flow:column;grid-auto-columns:1fr;gap:6px;padding:3px;border-radius:12px;background:var(--surface2,rgba(127,127,127,.08))}
body .od-kinds button,body .pt-kinds button{min-height:40px;border-radius:10px}

/* ---- Ô tick/checkbox ---- */
body .nx-chk{display:flex;align-items:center;gap:8px;font-size:13px;cursor:pointer;min-height:36px}
body .nx-chk input{width:18px;height:18px;min-height:0;flex:none}

/* ---- Form Danh mục (Thêm/gộp vị thế, Ghi tay) ---- */
body .nx-form{display:flex;flex-direction:column;gap:10px;margin:8px 0}
body .nx-form .nx-f>span{font-size:11px}
body .nx-form .btn{min-height:44px;border-radius:12px;font-weight:800}
body .nx-form .nx-wide{grid-column:1/-1}
@media(prefers-reduced-motion:reduce){body .od-st button,body .ol-st button,body .nx-step button{transition:none}}
