/* =============================================================================
 * TÚI ĐỒ › SỐ DƯ VÍ VỪA KHUNG Ở MÁY HẸP 320px — build 875 (worker 1/5, 13/10)
 * -----------------------------------------------------------------------------
 * PHẠM VI: CHỈ `.sf-panel.mode-bag` (túi đồ) và CHỈ `@media (max-width: 359px)`.
 * KHÔNG đụng tệp CSS cửa hàng, KHÔNG đụng 44px vùng chạm của `.sf-plus` /
 * `#sf-close`, KHÔNG đụng cỡ chữ, KHÔNG đụng logic vàng / kim cương.
 *
 * ───────────────────────────── LỖI THẬT ĐÃ ĐO ────────────────────────────────
 * Bộ đo `scripts/_qa_invfit_w1/qa_invfit.py` (Chromium thật, 9 khổ × 5 tiếng ×
 * 2 CỬA VÀO) ra **10 FAIL, tất cả ở 320×568**, và chỉ ở 3 thứ tiếng có đơn vị
 * rút gọn DÀI: ô số dư `.sf-wal b` là `overflow:hidden` nên con số bị cắt
 *
 *     tiếng   vàng               kim cương            thiếu
 *     es      '1,2 M'   34/36px  '98,7 mil' 48/53px   2 + 5 px
 *     pt      '1,2 mi'  34/40px  '98,7 mil' 47/53px   6 + 6 px
 *     ja      '123.4万' 47/49px  '9.8万'    34/34px   2 + 0 px
 *
 * (vi/en 0px — vì thế quét một tiếng là TRƯỢT SẠCH lỗi này.)
 * Từ 360px trở lên: 0px thiếu ở cả 5 tiếng ⇒ đây đúng là lỗi của riêng dải hẹp.
 *
 * ───────────────────── NGÂN SÁCH 300px CỦA HÀNG TRÊN ────────────────────────
 * `scripts/_qa_invfit_w1/diag_walbudget.py` in ra từng px ở 320×568:
 *
 *     .sf-top / .sf-wallets .................................. 300px
 *     − nút X `#sf-close` (SÀN vùng chạm, không hạ) ...........  44
 *     − 2 khe của `.sf-wallets` (787:7 · 6px) .................  12
 *     ─────────────────────────────────────────────────────────────
 *       còn cho 2 viên ví ..................................... 244
 *     Mỗi viên ví tốn CỐ ĐỊNH: padding 6+2 (787:8) + icon 18
 *       + 2 khe 6px (847:542 `max(--sw-gap,4px)`) + nút "+" 44 =  82
 *     ⇒ hai ô số dư chỉ còn 244 − 2×82 = 80px, mà pt cần 93px.
 *
 * `.sf-title` ĐÃ bị inventory-bagfit-872.css đưa ra khỏi luồng (sr-only ở
 * ≤479px) nên không còn px nào lấy lại được từ tiêu đề — đo lại: tiêu đề chiếm
 * đúng 1px. Phần thiếu phải lấy từ KHE và PADDING, hai thứ duy nhất còn dư.
 *
 * ─────────────────────────────── CÁCH VÁ ────────────────────────────────────
 *     khe `.sf-wallets`  6 → 4px  ........................... +4px (2 khe)
 *     khe trong viên ví  6 → 4px  ........................... +4px/viên (2 khe)
 *     padding-left viên  6 → 3px  ........................... +3px/viên
 *     ───────────────────────────────────────────────────────────────────
 *     tổng thu về .......................................... +18px
 *     ⇒ hai ô số dư có 98px, tiếng tốn nhất (pt) cần 93px ⇒ dư 5px.
 *
 * VÌ SAO KHÔNG hạ cỡ chữ `--sfz-wal`: đó là tệp CHỮ của cửa hàng
 * (shop-text-836.css:66, dùng chung cả hai mặt) — hạ ở đây là nới phạm vi bản
 * vá sang cửa hàng. Khe/padding là trang trí của riêng viên ví túi đồ.
 * VÌ SAO KHÔNG hạ icon 18px: `.sf-wal-ic` bị 847:537 khoá `flex:0 0 auto` cho
 * cả <span> và <svg> con; đổi cỡ icon là đổi hai phần tử ở hai lớp khác nhau
 * để lấy 4px mà bản vá khe/padding đã dư 5px rồi.
 * VÌ SAO KHÔNG nới `.sf-wallets`: nới là đẩy nút X ra khỏi thanh — chính điều
 * shop-textwrap-847.css:535 đã ghi là CỐ Ý KHÔNG LÀM.
 *
 * KHÔNG lồng thêm `body.rot90`: ở rot90 khung nhìn báo 896×414 nên media query
 * 359px KHÔNG bao giờ khớp — và đo được rot90 đã 0 FAIL, không cần vá.
 *
 * 7 lần `#shopframe`: phải thắng `column-gap` của shop-textwrap-847.css (6 lần
 * id) và `padding`/`gap` của mobile-shop-bag-787.css (2 lần id). KHÔNG dùng
 * `!important` — không cần, và để lớp sau còn chỉnh được.
 * ========================================================================== */

#shopframe#shopframe#shopframe#shopframe#shopframe#shopframe#shopframe {
  /* Dấu nhận biết cho harness: bộ đo đọc biến này để chắc chắn đang đo BẢN ĐÃ
     VÁ (chuỗi <link> từng bị một chú thích HTML nuốt 5 tệp cuối mà vẫn 0 FAIL). */
  --iwf-walfit: 1;
}

@media (max-width: 359px) {
  /* (1) Khe GIỮA hai viên ví và nút X. */
  #shopframe#shopframe#shopframe#shopframe#shopframe#shopframe#shopframe .sf-panel.mode-bag .sf-wallets {
    column-gap: 4px;
  }

  /* (2) Khe TRONG viên ví (icon ↔ số ↔ nút "+") và lề trái viên ví.
     Giữ nguyên lề phải 2px của 787: nút "+" 44px đã sát mép, cắt thêm là nút
     dính vào viền pill. */
  #shopframe#shopframe#shopframe#shopframe#shopframe#shopframe#shopframe .sf-panel.mode-bag .sf-wal {
    column-gap: 4px;
    padding-left: 3px;
    padding-right: 2px;
  }
}