/* MU World V2 pages/support — Hỗ trợ (/support.shtml, slug "support"; JS: pages/support.js, template ajax/support/support_v2.tpl).
   Một khung hình: #sp2Page có data-mu-fill → v2.js cho #index_content cao 100%; mọi danh sách dài cuộn TRONG thẻ.
   Màn: mặc định = điện thoại đứng (1 cột). ≥701px hoặc ngang = 2 cột (thẻ giới thiệu | danh sách, chi tiết | hội thoại,
   mô tả | ảnh + gửi). Ngang thấp (≤520px cao) = gọn thêm. Luật display chỉ đặt trên phần tử KHÔNG mang [hidden]
   (v2.css đã ẩn [hidden] bằng !important — không đè). Ô nhập ≥16px (iOS không tự phóng to), nút ≥44px.
   Cuối file: badge chưa đọc cho thẻ "Hỗ trợ" ở hub Ví và chấm ở tab Ví (dùng ở MỌI trang, không scope theo slug). */

/* ------------------------------------------------------------------ */
/* 1. Khung trang                                                       */
/* ------------------------------------------------------------------ */
body[data-mu-preview][data-mu-page="support"] #index_content.mu-v2-fill:not([hidden]) {
  display: flex;
  flex-direction: column;
  min-height: 0;
  overflow: hidden;
}
body[data-mu-preview][data-mu-page="support"] #index_content > .mu-v2-notice-float { flex: none; }
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-page {
  flex: 1 1 auto;
  min-height: 0;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
  color: #f5f0e6;
  font-family: var(--mu-font-body);
}
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-heading { flex: none; margin: 0 !important; }
/* Vỏ V2 (navigation-core) focus vào khối header (tabindex=-1) sau mỗi lần chuyển trang cho trình đọc màn hình: khối không
   bấm được nên không vẽ vòng focus (Chrome viền trắng, Safari vạch xanh). Tiêu đề của trang này cũng vậy. */
body[data-mu-preview][data-mu-page="support"] #index_content :is(.sp2-heading, #sp2Title)[tabindex="-1"]:focus { outline: none !important; }
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-heading .mu-v2-page-heading-title p {
  display: flex !important;
  align-items: center;
  flex-wrap: wrap;
  gap: 4px 6px;
  min-width: 0;
}
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-heading h1 {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-body {
  flex: 1 1 auto;
  min-height: 0;
  display: flex;
  flex-direction: column;
}
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-view {
  flex: 1 1 auto;
  min-height: 0;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-loading { display: grid; gap: 8px; align-content: start; }
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-loading .mu-v2-skeleton { height: 64px; border-radius: 8px; }
/* Đổi màn: mờ + trượt nhẹ (tiến từ phải, lùi từ trái) */
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-in.is-fwd { animation: sp2In .2s cubic-bezier(.2,.8,.2,1) both; }
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-in.is-back { animation: sp2InBack .2s cubic-bezier(.2,.8,.2,1) both; }
@keyframes sp2In { from { opacity: 0; transform: translateX(10px); } to { opacity: 1; transform: none; } }
@keyframes sp2InBack { from { opacity: 0; transform: translateX(-10px); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) {
  body[data-mu-preview][data-mu-page="support"] #index_content .sp2-in { animation: none !important; }
}

/* ------------------------------------------------------------------ */
/* 2. Thành phần chung: thẻ, tiêu đề khối, chip, ô nhập, nút           */
/* ------------------------------------------------------------------ */
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-card {
  min-width: 0;
  min-height: 0;
  display: flex;
  flex-direction: column;
  border: 1px solid #77634270;
  border-radius: 8px;
  background: #1a2026;
  color: #f5f0e6;
  overflow: hidden;
}
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-card-head {
  flex: none;
  display: flex;
  align-items: center;
  gap: 8px;
  min-height: 40px;
  padding: 8px 12px;
  border-bottom: 1px solid #2c3338;
}
body[data-mu-preview][data-mu-page="support"] :is(#index_content, .mu-v2-popup-layer) .sp2-h {
  flex: none;
  min-width: 0;
  margin: 0 !important;
  color: #f6f1e8 !important;
  font: 700 14px/1.3 var(--mu-font-head) !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
}
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-card-head > .sp2-h { flex: 1 1 auto; }
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-count {
  flex: none;
  min-width: 24px;
  height: 22px;
  padding: 0 7px;
  border: 1px solid #3a3f45;
  border-radius: 11px;
  color: #c9c4ba;
  font: 700 11.5px/20px var(--mu-font-body);
  text-align: center;
  font-variant-numeric: tabular-nums;
}
body[data-mu-preview][data-mu-page="support"] :is(#index_content, .mu-v2-popup-layer) .sp2-muted { color: #a9adb1; font-weight: 500; }
body[data-mu-preview][data-mu-page="support"] :is(#index_content, .mu-v2-popup-layer) .sp2-svg { display: inline-grid; place-items: center; flex: none; }
body[data-mu-preview][data-mu-page="support"] :is(#index_content, .mu-v2-popup-layer) .sp2-svg svg { width: 100%; height: 100%; fill: currentColor; }

/* Chip trạng thái (yêu cầu + giao dịch) */
body[data-mu-preview][data-mu-page="support"] :is(#index_content, .mu-v2-popup-layer) .sp2-chip {
  display: inline-flex;
  align-items: center;
  flex: none;
  height: 21px;
  padding: 0 8px;
  border: 1px solid #3a3f45;
  border-radius: 11px;
  background: #1a2026;
  color: #d6d1c6;
  font: 700 10.5px/1 var(--mu-font-body) !important;
  letter-spacing: 0 !important;
  white-space: nowrap;
  vertical-align: middle;
}
body[data-mu-preview][data-mu-page="support"] :is(#index_content, .mu-v2-popup-layer) .sp2-chip.is-answered {
  border-color: #f0d5a0;
  background: linear-gradient(110deg,#f2d7a2,#c9a468);
  color: #251d12;
}
body[data-mu-preview][data-mu-page="support"] :is(#index_content, .mu-v2-popup-layer) .sp2-chip.is-closed,
body[data-mu-preview][data-mu-page="support"] :is(#index_content, .mu-v2-popup-layer) .sp2-chip.is-tx-ok { border-color: #3f5a47; background: #1b2620; color: #a6cfb2; }
body[data-mu-preview][data-mu-page="support"] :is(#index_content, .mu-v2-popup-layer) .sp2-chip.is-tx-wait { border-color: #7a6440; background: #2a261d; color: #ecd09a; }
body[data-mu-preview][data-mu-page="support"] :is(#index_content, .mu-v2-popup-layer) .sp2-chip.is-tx-fail { border-color: #6b4343; background: #2b2222; color: #eab0b0; }
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-heading .sp2-code { color: #cfcac0; font-weight: 700; letter-spacing: .02em; font-variant-numeric: tabular-nums; }

/* Ô nhập (đè luật chung của v2.css có !important bằng specificity cao hơn) */
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-page :is(input.sp2-input, select.sp2-input, textarea.sp2-input) {
  width: 100%;
  min-width: 0;
  min-height: 44px;
  padding: 9px 11px !important;
  border: 1px solid #776342 !important;
  border-radius: 7px !important;
  background: #10151b !important;
  color: #f5f0e6 !important;
  box-shadow: none !important;
  font: 400 16px/1.4 var(--mu-font-body) !important;
  -webkit-appearance: none;
  appearance: none;
}
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-page :is(input.sp2-input, select.sp2-input, textarea.sp2-input)::placeholder { color: #80868c; opacity: 1; }
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-page :is(input.sp2-input, select.sp2-input, textarea.sp2-input):focus {
  border-color: #e7c78d !important;
  outline: none !important;
  box-shadow: 0 0 0 2px #e7c78d33 !important;
}
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-page select.sp2-input.sp2-select {
  padding-right: 34px !important;
  background: #10151b url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23e4c386' d='M4.5 8 6 6.5l6 6 6-6L19.5 8 12 15.5z'/%3E%3C/svg%3E") no-repeat right 10px center / 16px 16px !important;
  color-scheme: dark;
}
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-page textarea.sp2-input { resize: none; }
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-label {
  display: block;
  margin: 0;
  color: #d0cbc1;
  font: 600 12px/1.35 var(--mu-font-body);
}
/* Ô chọn tệp ẩn trong <label> (bấm nhãn = mở trình chọn ảnh, chạy cả Safari iOS) */
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-file {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  min-height: 0 !important;
  padding: 0 !important;
  margin: -1px !important;
  border: 0 !important;
  opacity: 0;
  overflow: hidden;
  clip: rect(0 0 0 0);
  pointer-events: none;
}
/* Nút riêng của trang (hàng danh sách, thẻ chọn): tự vẽ đủ, không nhận kiểu nút của V1 */
body[data-mu-preview][data-mu-page="support"] #index_content :is(.sp2-trow,.sp2-cat,.sp2-tx,.sp2-ev,.sp2-ref-toggle,.sp2-img,.sp2-thumb-x,.sp2-ibtn,.sp2-newmsg) {
  margin: 0;
  font-family: var(--mu-font-body);
  text-align: left;
  cursor: pointer;
  touch-action: manipulation;
  -webkit-tap-highlight-color: transparent;
  box-shadow: none;
  text-transform: none;
  letter-spacing: 0;
}
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-card-foot {
  flex: none;
  display: grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  gap: 8px;
  padding: 8px;
  border-top: 1px solid #2c3338;
  background: #1a2026;
}
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-card-foot > :only-child,
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-card-foot > .is-solo { grid-column: 1 / -1; }
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-card-foot .mu-v2-btn { min-height: 44px; padding: 8px 10px !important; }
body[data-mu-preview][data-mu-page="support"] :is(#index_content, .mu-v2-popup-layer) .sp2-pin { margin: 0; padding: 8px 10px; font-size: 12px; line-height: 1.45; }
body[data-mu-preview][data-mu-page="support"] :is(#index_content, .mu-v2-popup-layer) .sp2-pin > svg { width: 16px; height: 16px; }
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-err { margin: 0; padding: 8px 10px; font-size: 12.5px; line-height: 1.4; }
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-err > svg { width: 16px; height: 16px; }
body[data-mu-preview][data-mu-page="support"] :is(#index_content, .mu-v2-popup-layer) .sp2-link { color: var(--mu-popup-gold) !important; text-decoration: underline; text-underline-offset: 2px; overflow-wrap: anywhere; }
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-empty { min-height: 0; flex: 1 1 auto; border: 0; padding: 18px 12px; }
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-empty svg { width: 30px; height: 30px; }
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-retry-row { display: grid; place-items: center; padding: 10px; list-style: none; }

/* Danh sách cuộn trong thẻ (thanh cuộn mảnh vàng trầm như .mu-page-window) */
body[data-mu-preview][data-mu-page="support"] #index_content :is(.sp2-tlist,.sp2-txlist,.sp2-evgrid,.sp2-fields,.sp2-msgs,.sp2-info,.sp2-ref-body) {
  overflow-y: auto;
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
  scrollbar-color: #776342 transparent;
}

/* ------------------------------------------------------------------ */
/* 3. Màn danh sách                                                     */
/* ------------------------------------------------------------------ */
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-tickets { flex: 1 1 auto; }
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-tlist {
  flex: 1 1 auto;
  min-height: 0;
  display: flex;
  flex-direction: column;
  gap: 6px;
  margin: 0;
  padding: 6px;
  list-style: none;
}
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-titem { margin: 0; padding: 0; list-style: none; }
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-trow {
  width: 100%;
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 64px;
  padding: 9px 10px;
  border: 1px solid #30373c;
  border-radius: 7px;
  background: #1f262b;
  color: #f5f0e6;
}
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-trow:hover { border-color: #665438; background: #242b2f; }
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-trow.has-unread {
  border-color: #9b7e50;
  background: linear-gradient(90deg,#2d2b23,#1f262b 60%);
  box-shadow: inset 3px 0 #e7c78d;
}
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-trow.is-closed { background: #1c2226; }
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-trow.is-closed .sp2-trow-name { color: #cfcac0; }
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-trow-ico {
  width: 34px;
  height: 34px;
  padding: 7px;
  border: 1px solid #5d5040;
  border-radius: 7px;
  background: #2c2a24;
  color: #e4c386;
}
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-trow.is-closed .sp2-trow-ico { color: #9ea3a8; border-color: #3a3f45; background: #23292d; }
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-trow-main { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-trow-l1 { display: flex; align-items: center; gap: 8px; min-width: 0; }
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-trow-name {
  flex: 1 1 auto;
  min-width: 0;
  overflow: hidden;
  color: #f6f1e8;
  font: 700 13.5px/1.3 var(--mu-font-body);
  text-overflow: ellipsis;
  white-space: nowrap;
}
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-trow-l2 {
  display: block;
  min-width: 0;
  overflow: hidden;
  color: #c9c4ba;
  font: 400 12px/1.4 var(--mu-font-body);
  text-overflow: ellipsis;
  white-space: nowrap;
}
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-trow-l2:empty { display: none; }
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-trow-l2.is-sys { color: #a9adb1; font-style: italic; }
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-trow.has-unread .sp2-trow-l2 { color: #efe6d3; font-weight: 600; }
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-trow-l3 {
  display: flex;
  align-items: center;
  gap: 6px;
  min-width: 0;
  color: #9ea3a8;
  font: 500 11px/1.3 var(--mu-font-body);
}
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-trow-l3 .sp2-code { font-variant-numeric: tabular-nums; letter-spacing: .02em; }
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-trow-l3 time { white-space: nowrap; }
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-unread {
  margin-left: auto;
  min-width: 20px;
  height: 20px;
  padding: 0 6px;
  border-radius: 10px;
  background: #e7c78d;
  color: #251d12;
  font: 800 11px/20px var(--mu-font-body);
  text-align: center;
  font-variant-numeric: tabular-nums;
}
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-trow-arrow { width: 12px; height: 12px; color: #8d9196; }

/* Thẻ giới thiệu: 2 loại hỗ trợ + PIN + Tạo yêu cầu */
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-intro { flex: none; gap: 10px; padding: 12px; }
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-intro.is-closed { padding: 10px; }
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-intro.is-closed .mu-v2-notice { margin: 0; }
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-types { display: grid; grid-template-columns: minmax(0,1fr); gap: 10px; margin: 0; padding: 0; list-style: none; }
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-type { display: flex; align-items: flex-start; gap: 10px; min-width: 0; margin: 0; list-style: none; }
/* Trạng thái trống (điện thoại đứng): biểu tượng + 1 câu, phía trên phần giải thích */
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-hero { display: none; }
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-hero-ico {
  width: 58px;
  height: 58px;
  padding: 14px;
  border: 1px solid #6d5a3d;
  border-radius: 50%;
  background: #2a2720;
  color: #e7c78d;
}
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-hero p { margin: 0; color: #f6f1e8; font: 700 15px/1.35 var(--mu-font-head); }
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-hero .sp2-muted { color: #b9b8b5; font: 400 12.5px/1.45 var(--mu-font-body); max-width: 32ch; }
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-type-ico {
  width: 34px;
  height: 34px;
  padding: 7px;
  border: 1px solid #6d5a3d;
  border-radius: 7px;
  background: #342d22;
  color: #e7c78d;
}
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-type-txt { display: flex; flex-direction: column; gap: 1px; min-width: 0; }
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-type-txt strong { color: #f6f1e8; font: 700 13.5px/1.3 var(--mu-font-body); }
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-type-txt span { color: #b9b8b5; font: 400 12px/1.4 var(--mu-font-body); }
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-intro-foot { display: grid; gap: 6px; margin-top: auto; }
body[data-mu-preview][data-mu-page="support"] #index_content .mu-v2-btn.sp2-create { width: 100%; min-height: 46px; font-size: 14px !important; }
body[data-mu-preview][data-mu-page="support"] #index_content .mu-v2-btn.sp2-create i { font-size: 14px; }
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-lock { margin: 0; color: #ecd09a; font: 500 12px/1.4 var(--mu-font-body); text-align: center; }

/* Điện thoại đứng: có yêu cầu → danh sách chiếm khung, phần giới thiệu thành chân gọn (PIN + nút);
   chưa có yêu cầu → chỉ thẻ giới thiệu (giải thích 2 loại + PIN), nút ở đáy thẻ. */
@media (max-width: 700px) and (orientation: portrait) {
  body[data-mu-preview][data-mu-page="support"] #index_content .sp2-v-list:not(.is-empty) > .sp2-intro {
    padding: 0;
    gap: 8px;
    border: 0;
    background: none;
    overflow: visible;
  }
  body[data-mu-preview][data-mu-page="support"] #index_content .sp2-v-list:not(.is-empty) > .sp2-intro > :is(.sp2-h,.sp2-types) { display: none; }
  body[data-mu-preview][data-mu-page="support"] #index_content .sp2-v-list:not(.is-empty) > .sp2-intro .sp2-pin { padding: 6px 9px; font-size: 11.5px; }
  body[data-mu-preview][data-mu-page="support"] #index_content .sp2-v-list.is-empty > .sp2-tickets { display: none; }
  body[data-mu-preview][data-mu-page="support"] #index_content .sp2-v-list.is-empty > .sp2-intro { flex: 1 1 auto; gap: 14px; padding: 14px; overflow-y: auto; }
  body[data-mu-preview][data-mu-page="support"] #index_content .sp2-v-list.is-empty .sp2-hero {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;
    padding: 10px 0 6px;
    text-align: center;
  }
  body[data-mu-preview][data-mu-page="support"] #index_content .sp2-v-list.is-empty .sp2-intro > .sp2-h { margin-top: 4px !important; padding-top: 12px; border-top: 1px solid #2c3338; }
  body[data-mu-preview][data-mu-page="support"] #index_content .sp2-v-list.is-empty .sp2-types { gap: 14px; }
}

/* ------------------------------------------------------------------ */
/* 4. Tạo yêu cầu                                                       */
/* ------------------------------------------------------------------ */
/* B1: hai thẻ lớn */
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-cats { display: grid; gap: 10px; }
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-cat {
  width: 100%;
  display: flex;
  align-items: center;
  gap: 12px;
  min-height: 92px;
  padding: 14px;
  border: 1px solid #665438;
  border-radius: 9px;
  background: linear-gradient(125deg,#23292d,#161b20);
  color: #f5f0e6;
}
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-cat:is(:hover,.is-picked) { border-color: #e7c78d; background: linear-gradient(125deg,#2c2f2c,#181d21); }
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-cat-ico {
  width: 46px;
  height: 46px;
  padding: 10px;
  border: 1px solid #8d7448;
  border-radius: 9px;
  background: #3b3020;
  color: #f0d29a;
}
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-cat-txt { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; gap: 3px; }
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-cat-txt strong { color: #f8f3e9; font: 800 16px/1.25 var(--mu-font-head); }
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-cat-txt span { color: #b9b8b5; font: 400 12.5px/1.4 var(--mu-font-body); }
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-cat-arrow { width: 13px; height: 13px; color: #c9b58c; }
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-v-cat > .sp2-pin { flex: none; }

/* B2: danh sách chọn (giao dịch / sự kiện) */
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-pick-card { flex: 1 1 auto; }
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-txlist {
  flex: 1 1 auto;
  min-height: 0;
  display: grid;
  align-content: start;
  gap: 6px;
  margin: 0;
  padding: 6px;
  list-style: none;
}
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-txlist > li { margin: 0; list-style: none; min-width: 0; }
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-tx-sk .mu-v2-skeleton { height: 58px; border-radius: 7px; }
body[data-mu-preview][data-mu-page="support"] #index_content :is(.sp2-tx,.sp2-ev) {
  width: 100%;
  display: flex;
  align-items: flex-start;
  gap: 10px;
  min-height: 58px;
  padding: 9px 10px;
  border: 1px solid #30373c;
  border-radius: 7px;
  background: #1f262b;
  color: #f5f0e6;
}
body[data-mu-preview][data-mu-page="support"] #index_content :is(.sp2-tx,.sp2-ev):hover { border-color: #665438; }
body[data-mu-preview][data-mu-page="support"] #index_content :is(.sp2-tx,.sp2-ev).is-picked {
  border-color: #e7c78d;
  background: #2a2922;
  box-shadow: inset 0 0 0 1px #e7c78d66;
}
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-tx.is-priority:not(.is-picked) { border-color: #6d5a3d; }
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-radio {
  position: relative;
  flex: none;
  width: 18px;
  height: 18px;
  margin-top: 1px;
  border: 2px solid #7a6a50;
  border-radius: 50%;
}
body[data-mu-preview][data-mu-page="support"] #index_content .is-picked > .sp2-radio { border-color: #e7c78d; }
body[data-mu-preview][data-mu-page="support"] #index_content .is-picked > .sp2-radio::after {
  content: "";
  position: absolute;
  inset: 3px;
  border-radius: 50%;
  background: #e7c78d;
}
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-tx-main { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; gap: 3px; }
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-tx-l1 { display: flex; align-items: center; gap: 6px; min-width: 0; }
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-tx-gw {
  flex: 0 1 auto;
  min-width: 0;
  overflow: hidden;
  color: #f6f1e8;
  font: 700 13.5px/1.3 var(--mu-font-body);
  text-overflow: ellipsis;
  white-space: nowrap;
}
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-tx-amt {
  flex: none;
  margin-left: auto;
  color: #f2d49b;
  font: 800 14px/1.2 var(--mu-font-head);
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
}
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-tag {
  flex: none;
  height: 18px;
  padding: 0 6px;
  border: 1px solid #d5b77a;
  border-radius: 4px;
  color: #f2d49b;
  font: 700 10px/16px var(--mu-font-body);
  white-space: nowrap;
}
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-tx-l2 { display: flex; align-items: center; gap: 8px; min-width: 0; }
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-tx-meta {
  flex: 1 1 auto;
  min-width: 0;
  overflow: hidden;
  color: #a9adb1;
  font: 500 11.5px/1.35 var(--mu-font-body);
  text-overflow: ellipsis;
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
}
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-tx-hint { color: #e4c386; font: 500 11.5px/1.35 var(--mu-font-body); }
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-pick-card > .sp2-err { margin: 0 8px 8px; }

body[data-mu-preview][data-mu-page="support"] #index_content .sp2-evgrid {
  flex: 1 1 auto;
  min-height: 0;
  display: grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  align-content: start;
  gap: 6px;
  padding: 6px;
}
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-ev { align-items: center; min-height: 48px; padding: 8px 10px; }
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-ev-name { min-width: 0; font: 600 12.5px/1.3 var(--mu-font-body); overflow-wrap: anywhere; }
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-ev.is-other .sp2-ev-name { color: #c9c4ba; }

/* B2 nhập tay */
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-form-card { flex: 1 1 auto; }
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-form-note { flex: none; margin: 0; padding: 10px 12px 0; font: 500 12px/1.45 var(--mu-font-body); }
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-fields {
  flex: 1 1 auto;
  min-height: 0;
  display: grid;
  align-content: start;
  gap: 10px;
  padding: 10px 12px 12px;
}
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-field { display: grid; gap: 5px; margin: 0; min-width: 0; }

/* B3: mô tả + ảnh + gửi */
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-v-desc > .sp2-col { display: flex; flex-direction: column; gap: 7px; min-width: 0; min-height: 0; }
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-col-a { flex: 1 1 auto; }
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-col-b { flex: none; }
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-sum {
  flex: none;
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
  padding: 7px 7px 7px 10px;
  border: 1px solid #665438;
  border-radius: 8px;
  background: #1e2528;
}
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-sum-ico {
  width: 30px;
  height: 30px;
  padding: 6px;
  border: 1px solid #5d5040;
  border-radius: 7px;
  background: #2c2a24;
  color: #e4c386;
}
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-sum-txt { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; gap: 1px; }
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-sum-lbl { color: #a9adb1; font: 600 10.5px/1.3 var(--mu-font-body); }
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-sum-txt strong {
  overflow: hidden;
  color: #f6f1e8;
  font: 700 13.5px/1.3 var(--mu-font-body);
  text-overflow: ellipsis;
  white-space: nowrap;
}
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-sum-meta {
  display: flex;
  align-items: center;
  gap: 6px;
  min-width: 0;
  overflow: hidden;
  color: #a9adb1;
  font: 500 11px/1.35 var(--mu-font-body);
  white-space: nowrap;
  text-overflow: ellipsis;
}
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-sum-ref { flex: 0 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-sum-meta > .sp2-chip { flex: none; }
body[data-mu-preview][data-mu-page="support"] #index_content .mu-v2-btn.sp2-change { flex: none; min-height: 36px; padding: 6px 12px !important; font-size: 12.5px !important; }
body[data-mu-preview][data-mu-page="support"] #index_content .mu-v2-btn.sp2-change::before { content: ""; position: absolute; left: 50%; top: 50%; width: max(calc(100% + 10px), 44px); height: max(calc(100% + 10px), 44px); transform: translate(-50%, -50%); }
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-page textarea.sp2-input.sp2-desc { flex: 1 1 auto; min-height: 96px; }
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-counter {
  flex: none;
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: -2px;
  color: #9ea3a8;
  font: 500 11px/1.3 var(--mu-font-body);
}
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-counter.is-short .sp2-min { color: #eab0b0; }
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-num { margin-left: auto; font-variant-numeric: tabular-nums; }
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-photos { display: grid; gap: 6px; }
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-tiles { display: flex; flex-wrap: wrap; gap: 8px; }
body[data-mu-preview][data-mu-page="support"] #index_content :is(.sp2-thumb,.sp2-add) {
  position: relative;
  flex: none;
  width: 64px;
  height: 64px;
  border-radius: 8px;
}
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-thumb { border: 1px solid #3a3f45; background: #10151b; overflow: hidden; }
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-thumb img { display: block; width: 100%; height: 100%; object-fit: cover; }
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-thumb-x {
  position: absolute;
  top: 3px;
  right: 3px;
  width: 24px;
  height: 24px;
  min-height: 0;
  display: grid;
  place-items: center;
  padding: 0;
  border: 1px solid #ffffff40;
  border-radius: 50%;
  background: #0b0f13d9;
  color: #fff;
  font-size: 12px;
  line-height: 1;
}
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-thumb-x::after { content: ""; position: absolute; inset: -8px; }
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-add {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 4px;
  padding: 4px;
  border: 1px dashed #8d7448;
  background: #1b2025;
  color: #e4c386;
  font: 600 10.5px/1.2 var(--mu-font-body);
  text-align: center;
  cursor: pointer;
  touch-action: manipulation;
  -webkit-tap-highlight-color: transparent;
}
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-add:hover { border-color: #e7c78d; background: #22282c; }
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-add i { font-size: 18px; }
body[data-mu-preview][data-mu-page="support"] #index_content :is(.sp2-photo-err,.sp2-compose-err) { margin: 0; color: #f0b4b4; font: 500 12px/1.35 var(--mu-font-body); }
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-receipt { margin: 0; padding: 8px 10px; font-size: 12px; }
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-receipt > svg { width: 16px; height: 16px; }
body[data-mu-preview][data-mu-page="support"] #index_content .mu-v2-btn.sp2-submit { width: 100%; min-height: 46px; font-size: 14px !important; }

/* ------------------------------------------------------------------ */
/* 5. Hội thoại                                                         */
/* ------------------------------------------------------------------ */
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-info { display: none; }
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-chat { flex: 1 1 auto; }
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-ref { flex: none; border-bottom: 1px solid #2c3338; background: #1e2528; }
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-ref-toggle {
  width: 100%;
  display: flex;
  align-items: center;
  gap: 8px;
  min-height: 44px;
  padding: 6px 12px;
  border: 0;
  border-radius: 0;
  background: none;
  color: #ddd7cb;
  font: 600 12px/1.3 var(--mu-font-body);
}
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-ref-ico { width: 18px; height: 18px; color: #e4c386; }
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-ref-line { flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-ref-chev { flex: none; color: #c9b58c; font-size: 12px; transition: transform .15s; }
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-ref.is-open .sp2-ref-chev { transform: rotate(180deg); }
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-ref-body { max-height: 38vh; padding: 0 12px 10px; }
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-dl { display: grid; gap: 7px; margin: 0; }
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-dl > div { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; min-width: 0; }
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-dl dt { flex: none; margin: 0; color: #a9adb1; font: 500 12px/1.4 var(--mu-font-body); }
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-dl dd {
  min-width: 0;
  margin: 0;
  color: #f5f0e6;
  font: 600 12.5px/1.4 var(--mu-font-body);
  text-align: right;
  overflow-wrap: anywhere;
  font-variant-numeric: tabular-nums;
}
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-dl dd .sp2-chip { vertical-align: middle; }
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-pane { position: relative; flex: 1 1 auto; min-height: 0; display: flex; flex-direction: column; }
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-msgs {
  flex: 1 1 auto;
  min-height: 0;
  display: flex;
  flex-direction: column;
  gap: 2px;
  padding: 10px 10px 8px;
  outline: none;
}
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-tintro {
  flex: none;
  display: flex;
  align-items: flex-start;
  gap: 7px;
  align-self: center;
  max-width: 94%;
  margin: 0 0 6px;
  padding: 7px 11px;
  border: 1px solid #2f363b;
  border-radius: 9px;
  background: #1f262b;
  color: #b9b8b5;
  font: 500 11.5px/1.45 var(--mu-font-body);
}
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-tintro-ico { width: 15px; height: 15px; margin-top: 1px; color: #c9b58c; }
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-tintro.is-fresh { border-color: #3f5a47; background: #1b2620; color: #d3e8d9; }
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-tintro.is-fresh .sp2-tintro-ico { color: #8fc7a0; }
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-msg-sk { flex: none; width: 62%; margin: 8px 0 0; }
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-msg-sk.is-right { align-self: flex-end; }
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-msg-sk .mu-v2-skeleton { height: 46px; border-radius: 14px; }
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-day { flex: none; align-self: center; margin: 10px 0 4px; }
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-day span {
  display: inline-block;
  padding: 3px 10px;
  border-radius: 10px;
  background: #232a2f;
  color: #aeb4bc;
  font: 600 10.5px/1.4 var(--mu-font-body);
}
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-msg {
  flex: none;
  display: flex;
  flex-direction: column;
  max-width: min(84%, 560px);
  margin-top: 2px;
}
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-msg.is-first { margin-top: 8px; }
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-msg.is-user { align-self: flex-end; align-items: flex-end; }
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-msg.is-staff { align-self: flex-start; align-items: flex-start; }
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-msg.is-sending { opacity: .72; }
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-who {
  display: flex;
  align-items: center;
  gap: 5px;
  margin: 0 0 3px 3px;
  color: #e4c386;
  font: 700 11px/1.3 var(--mu-font-body);
}
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-who-ico { width: 12px; height: 12px; }
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-bubble {
  max-width: 100%;
  padding: 8px 11px;
  border-radius: 14px;
  font: 400 14px/1.45 var(--mu-font-body);
  overflow-wrap: anywhere;
}
body[data-mu-preview][data-mu-page="support"] #index_content .is-user > .sp2-bubble {
  border: 1px solid #6d5a3d;
  border-bottom-right-radius: 5px;
  background: #3a3121;
  color: #fbf4e6;
}
body[data-mu-preview][data-mu-page="support"] #index_content .is-staff > .sp2-bubble {
  border: 1px solid #3a4248;
  border-bottom-left-radius: 5px;
  background: #232a2f;
  color: #f1ece2;
}
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-text { white-space: pre-wrap; }
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-text + .sp2-imgs { margin-top: 7px; }
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-bubble.is-media { padding: 4px; }
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-imgs { display: grid; gap: 4px; }
/* Ảnh đơn: rộng tối đa 240px, cao tối đa ~300px — ảnh dọc hẹp lại theo đúng tỉ lệ (--r = w/h do JS gắn) */
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-imgs.n1 { width: min(240px, 60vw, calc(300px * var(--r, 1.3333))); }
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-imgs:not(.n1) { width: min(264px, 64vw); grid-template-columns: repeat(2, minmax(0,1fr)); align-items: start; }
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-img {
  display: block;
  width: 100%;
  min-height: 0;
  padding: 0;
  border: 0;
  border-radius: 10px;
  background: #10151b;
  overflow: hidden;
  aspect-ratio: var(--r, 1.3333);
  cursor: zoom-in;
}
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-img:disabled { cursor: default; opacity: 1; }
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-img img { display: block; width: 100%; height: 100%; object-fit: cover; }
@supports not (aspect-ratio: 1 / 1) {
  body[data-mu-preview][data-mu-page="support"] #index_content .sp2-img { height: 150px; }
  body[data-mu-preview][data-mu-page="support"] #index_content .sp2-imgs:not(.n1) .sp2-img { height: 110px; }
}
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-meta {
  display: flex;
  align-items: center;
  gap: 6px;
  margin: 3px 5px 0;
  color: #8f959b;
  font: 500 10.5px/1.3 var(--mu-font-body);
  font-variant-numeric: tabular-nums;
}
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-edited { font-style: italic; }
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-state { display: inline-flex; align-items: center; gap: 4px; }
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-state i { font-size: 10.5px; }
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-state.is-sent { color: #9cc4a8; }
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-state.is-pending { color: #cdb88c; }
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-state-txt { display: none; }
body[data-mu-preview][data-mu-page="support"] #index_content :is(.sp2-msg.is-last,.sp2-msg.is-sending) .sp2-state-txt { display: inline; }
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-sys { flex: none; align-self: center; max-width: 90%; margin: 10px 0 4px; text-align: center; }
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-sys > span {
  display: inline-block;
  padding: 4px 11px;
  border-radius: 10px;
  background: #1d2327;
  color: #aeb2b6;
  font: 500 11.5px/1.45 var(--mu-font-body);
}
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-sys time { color: #858b91; }
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-msgs > .sp2-err { flex: none; margin: 8px 0 0; }
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-msgs > .sp2-retry { flex: none; align-self: center; margin-top: 8px; }
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-newmsg {
  position: absolute;
  left: 50%;
  bottom: 8px;
  z-index: 2;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 36px;
  padding: 6px 14px;
  border: 1px solid #f0d5a0;
  border-radius: 18px;
  background: linear-gradient(110deg,#f2d7a2,#c9a468);
  color: #251d12;
  font: 700 12.5px/1.2 var(--mu-font-body);
  box-shadow: 0 6px 16px #000a;
  transform: translateX(-50%);
}
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-newmsg::after { content: ""; position: absolute; inset: -5px; }
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-closedbar {
  flex: none;
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 7px 12px;
  border-top: 1px solid #2c3338;
  background: #1b2620;
  color: #d3e8d9;
  font: 600 12px/1.35 var(--mu-font-body);
}
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-closedbar-ico { width: 16px; height: 16px; color: #8fc7a0; }
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-compose { flex: none; padding: 8px; border-top: 1px solid #2c3338; background: #1a2026; }
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-attach { display: flex; gap: 6px; padding: 0 0 8px; overflow-x: auto; }
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-attach .sp2-thumb { width: 52px; height: 52px; }
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-compose-err { padding: 0 4px 6px; }
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-compose-row { display: flex; align-items: flex-end; gap: 6px; }
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-ibtn {
  position: relative;
  flex: none;
  width: 44px;
  height: 44px;
  min-height: 44px;
  display: grid;
  place-items: center;
  padding: 0;
  border: 1px solid #665438;
  border-radius: 22px;
  background: #22292b;
  color: #e4c386;
  font-size: 18px;
  line-height: 1;
}
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-ibtn:hover { border-color: #e7c78d; }
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-ibtn.sp2-send { border-color: #f0d5a0; background: linear-gradient(110deg,#f2d7a2,#c9a468); color: #251d12; font-size: 17px; }
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-ibtn:disabled { opacity: .42; cursor: not-allowed; }
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-pick.is-full { opacity: .5; }
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-pick-n {
  position: absolute;
  top: -4px;
  right: -4px;
  min-width: 18px;
  height: 18px;
  padding: 0 4px;
  border-radius: 9px;
  background: #e7c78d;
  color: #251d12;
  font: 800 10px/18px var(--mu-font-body);
  text-align: center;
}
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-page .sp2-compose textarea.sp2-input.sp2-ta {
  flex: 1 1 auto;
  min-height: 44px;
  max-height: 132px;
  padding: 10px 14px !important;
  border-radius: 22px !important;
  line-height: 1.4 !important;
  overflow-y: auto;
}

/* Xem ảnh lớn (muV2.sheet .sp2-img-sheet) */
body[data-mu-preview][data-mu-page="support"] .sp2-img-sheet .mu-v2-popup-dialog.mu-v2-sheet { width: min(760px, 100%) !important; }
body[data-mu-preview][data-mu-page="support"] .sp2-img-sheet .mu-v2-sheet-body { display: grid; place-items: center; padding: 10px; overflow: hidden; }
/* Kích thước khung do support.js openViewer().fit() tính theo chỗ trống thật của sheet (đúng tỉ lệ, không cuộn) */
body[data-mu-preview][data-mu-page="support"] .sp2-viewer {
  width: 100%;
  height: 50vh;
  max-width: 100%;
  border-radius: 8px;
  background: #0d1115;
  overflow: hidden;
}
body[data-mu-preview][data-mu-page="support"] .sp2-viewer { position: relative; }
body[data-mu-preview][data-mu-page="support"] .sp2-vwrap { position: relative; width: 100%; display: grid; place-items: center; }
body[data-mu-preview][data-mu-page="support"] .sp2-viewer-img { display: block; width: 100%; height: 100%; object-fit: contain; }
body[data-mu-preview][data-mu-page="support"] .sp2-vbtn {
  position: absolute;
  top: 50%;
  z-index: 1;
  width: 44px;
  height: 44px;
  display: grid;
  place-items: center;
  padding: 0;
  border: 1px solid #e7c78d99;
  border-radius: 50%;
  background: #0b0f13cc;
  color: #f2d49b;
  font-size: 16px;
  cursor: pointer;
  transform: translateY(-50%);
  touch-action: manipulation;
  -webkit-tap-highlight-color: transparent;
}
body[data-mu-preview][data-mu-page="support"] .sp2-vbtn.is-prev { left: 6px; }
body[data-mu-preview][data-mu-page="support"] .sp2-vbtn.is-next { right: 6px; }
body[data-mu-preview][data-mu-page="support"] .sp2-vbtn:disabled { opacity: .3; cursor: default; }
body[data-mu-preview][data-mu-page="support"] .sp2-viewer-pos {
  position: absolute;
  left: 50%;
  bottom: 8px;
  padding: 3px 10px;
  border-radius: 11px;
  background: #0b0f13cc;
  color: #f0e9dc;
  font: 700 12px/1.3 var(--mu-font-body);
  font-variant-numeric: tabular-nums;
  transform: translateX(-50%);
  pointer-events: none;
}

/* Bàn phím ảo đang mở (máy cảm ứng, đang gõ): gọn phần phụ để ô gõ + nút gửi vẫn thấy */
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-page.is-kb :is(.sp2-ref,.sp2-tintro,.sp2-form-note) { display: none; }
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-page.is-kb .sp2-v-desc :is(.sp2-sum,.sp2-photos,.sp2-pin,.sp2-receipt) { display: none; }
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-page.is-kb .sp2-v-desc textarea.sp2-input.sp2-desc { min-height: 64px; }

/* ------------------------------------------------------------------ */
/* 6. Màn rộng / điện thoại ngang: 2 cột                                */
/* ------------------------------------------------------------------ */
@media (min-width: 701px), (orientation: landscape) {
  body[data-mu-preview][data-mu-page="support"] #index_content .sp2-v-list {
    display: grid;
    grid-template-columns: minmax(250px, 340px) minmax(0, 1fr);
    grid-template-rows: minmax(0, 1fr);
    grid-template-areas: "intro list";
    gap: 10px;
  }
  body[data-mu-preview][data-mu-page="support"] #index_content .sp2-v-list > .sp2-tickets { grid-area: list; }
  body[data-mu-preview][data-mu-page="support"] #index_content .sp2-v-list > .sp2-intro { grid-area: intro; align-self: start; max-height: 100%; overflow-y: auto; }
  body[data-mu-preview][data-mu-page="support"] #index_content .sp2-v-list > .sp2-intro.is-closed { grid-column: 1 / -1; }

  body[data-mu-preview][data-mu-page="support"] #index_content .sp2-cats { grid-template-columns: repeat(2, minmax(0,1fr)); }
  body[data-mu-preview][data-mu-page="support"] #index_content .sp2-cat { min-height: 112px; padding: 16px; }
  body[data-mu-preview][data-mu-page="support"] #index_content .sp2-evgrid { grid-template-columns: repeat(auto-fill, minmax(168px, 1fr)); }
  body[data-mu-preview][data-mu-page="support"] #index_content .sp2-fields { grid-template-columns: repeat(2, minmax(0,1fr)); gap: 10px 12px; }
  body[data-mu-preview][data-mu-page="support"] #index_content .sp2-card-foot { display: flex; justify-content: flex-end; }
  body[data-mu-preview][data-mu-page="support"] #index_content .sp2-card-foot .mu-v2-btn { min-width: 170px; }
  body[data-mu-preview][data-mu-page="support"] #index_content .sp2-card-foot .mu-v2-btn.sp2-missing,
  body[data-mu-preview][data-mu-page="support"] #index_content .sp2-card-foot .mu-v2-btn.sp2-listbtn { margin-right: auto; }

  body[data-mu-preview][data-mu-page="support"] #index_content .sp2-v-desc {
    display: grid;
    grid-template-columns: minmax(0, 1.3fr) minmax(260px, 1fr);
    grid-template-rows: minmax(0, 1fr);
    gap: 10px;
  }
  body[data-mu-preview][data-mu-page="support"] #index_content .sp2-v-desc > .sp2-col-b { overflow-y: auto; }
  body[data-mu-preview][data-mu-page="support"] #index_content .sp2-v-desc .mu-v2-btn.sp2-submit { margin-top: auto; }

  body[data-mu-preview][data-mu-page="support"] #index_content .sp2-v-thread {
    display: grid;
    grid-template-columns: minmax(220px, 300px) minmax(0, 1fr);
    grid-template-rows: minmax(0, 1fr);
    gap: 10px;
  }
  body[data-mu-preview][data-mu-page="support"] #index_content .sp2-info { display: flex; }
  body[data-mu-preview][data-mu-page="support"] #index_content .sp2-info > .sp2-dl { padding: 10px 12px 12px; }
  body[data-mu-preview][data-mu-page="support"] #index_content .sp2-ref { display: none; }
}
@media (min-width: 760px) {
  body[data-mu-preview][data-mu-page="support"] #index_content .sp2-txlist { grid-template-columns: repeat(2, minmax(0,1fr)); }
}
@media (min-width: 1000px) and (min-height: 521px) {
  body[data-mu-preview][data-mu-page="support"] #index_content .sp2-cat { min-height: 150px; padding: 20px 22px; gap: 16px; }
  body[data-mu-preview][data-mu-page="support"] #index_content .sp2-cat-ico { width: 58px; height: 58px; padding: 13px; }
  body[data-mu-preview][data-mu-page="support"] #index_content .sp2-cat-txt strong { font-size: 18px; }
  body[data-mu-preview][data-mu-page="support"] #index_content .sp2-cat-txt span { font-size: 13px; }
}
@media (min-width: 1000px) {
  body[data-mu-preview][data-mu-page="support"] #index_content .sp2-v-desc .sp2-tiles .sp2-add,
  body[data-mu-preview][data-mu-page="support"] #index_content .sp2-v-desc .sp2-tiles .sp2-thumb { width: 76px; height: 76px; }
}

/* Ngang thấp (iPhone ngang ~844×300): gọn chữ, khoảng cách, chiều cao dòng */
@media (max-height: 520px) and (orientation: landscape) {
  body[data-mu-preview][data-mu-page="support"] #index_content .sp2-page { gap: 6px; }
  body[data-mu-preview][data-mu-page="support"] #index_content .sp2-view,
  body[data-mu-preview][data-mu-page="support"] #index_content :is(.sp2-v-list,.sp2-v-desc,.sp2-v-thread) { gap: 8px; }
  body[data-mu-preview][data-mu-page="support"] #index_content .sp2-card-head { min-height: 34px; padding: 6px 10px; }
  /* B2: header trang đã ghi "Bước 2/3 · Chọn giao dịch/sự kiện" → bỏ tiêu đề thẻ lặp lại, dành chỗ cho danh sách */
  body[data-mu-preview][data-mu-page="support"] #index_content .sp2-pick-card > .sp2-card-head { display: none; }
  body[data-mu-preview][data-mu-page="support"] #index_content .sp2-intro { gap: 7px; padding: 9px 10px; }
  body[data-mu-preview][data-mu-page="support"] #index_content .sp2-types { gap: 6px; }
  body[data-mu-preview][data-mu-page="support"] #index_content .sp2-type-ico { width: 28px; height: 28px; padding: 6px; }
  body[data-mu-preview][data-mu-page="support"] #index_content .sp2-type-txt strong { font-size: 12.5px; }
  body[data-mu-preview][data-mu-page="support"] #index_content .sp2-type-txt span { font-size: 11px; line-height: 1.3; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  body[data-mu-preview][data-mu-page="support"] :is(#index_content, .mu-v2-popup-layer) .sp2-pin { padding: 5px 8px; font-size: 11px; line-height: 1.35; }
  body[data-mu-preview][data-mu-page="support"] #index_content .mu-v2-btn.sp2-create,
  body[data-mu-preview][data-mu-page="support"] #index_content .mu-v2-btn.sp2-submit { min-height: 44px; }
  body[data-mu-preview][data-mu-page="support"] #index_content .sp2-trow { min-height: 56px; padding: 6px 9px; }
  body[data-mu-preview][data-mu-page="support"] #index_content .sp2-trow-ico { width: 30px; height: 30px; padding: 6px; }
  body[data-mu-preview][data-mu-page="support"] #index_content .sp2-cat { min-height: 84px; padding: 12px; }
  body[data-mu-preview][data-mu-page="support"] #index_content .sp2-cat-ico { width: 40px; height: 40px; padding: 9px; }
  body[data-mu-preview][data-mu-page="support"] #index_content :is(.sp2-tx,.sp2-ev) { min-height: 50px; padding: 7px 9px; }
  body[data-mu-preview][data-mu-page="support"] #index_content .sp2-ev { min-height: 44px; }
  body[data-mu-preview][data-mu-page="support"] #index_content .sp2-card-foot { padding: 6px 8px; }
  body[data-mu-preview][data-mu-page="support"] #index_content .sp2-form-note { display: none; }
  body[data-mu-preview][data-mu-page="support"] #index_content .sp2-fields { padding: 8px 10px; gap: 6px 10px; }
  body[data-mu-preview][data-mu-page="support"] #index_content .sp2-sum { padding: 5px 6px 5px 8px; }
  body[data-mu-preview][data-mu-page="support"] #index_content .sp2-sum-ico { width: 26px; height: 26px; padding: 5px; }
  body[data-mu-preview][data-mu-page="support"] #index_content .sp2-v-desc > .sp2-col { gap: 5px; }
  body[data-mu-preview][data-mu-page="support"] #index_content .sp2-page textarea.sp2-input.sp2-desc { min-height: 60px; }
  body[data-mu-preview][data-mu-page="support"] #index_content :is(.sp2-thumb,.sp2-add) { width: 56px; height: 56px; }
  body[data-mu-preview][data-mu-page="support"] #index_content .sp2-info > .sp2-dl { gap: 5px; padding: 8px 10px; }
  body[data-mu-preview][data-mu-page="support"] #index_content .sp2-dl :is(dt,dd) { font-size: 11.5px; }
  body[data-mu-preview][data-mu-page="support"] #index_content .sp2-msgs { padding: 6px 8px; }
  body[data-mu-preview][data-mu-page="support"] #index_content .sp2-tintro { margin-bottom: 2px; padding: 4px 9px; font-size: 11px; }
  body[data-mu-preview][data-mu-page="support"] #index_content .sp2-compose { padding: 6px; }
  body[data-mu-preview][data-mu-page="support"] #index_content .sp2-closedbar { padding: 5px 10px; font-size: 11.5px; }
  body[data-mu-preview][data-mu-page="support"] #index_content .sp2-imgs.n1 { width: min(200px, 34vw, calc(170px * var(--r, 1.3333))); }
  body[data-mu-preview][data-mu-page="support"] #index_content .sp2-imgs:not(.n1) { width: min(220px, 38vw); }
  /* Bàn phím ảo ở ngang thấp chỉ còn ~120-150px: tạm ẩn header và thẻ chi tiết, chỉ giữ ô đang gõ + nút gửi */
  body[data-mu-preview][data-mu-page="support"] #index_content .sp2-page.is-kb > .sp2-heading { display: none !important; }
  body[data-mu-preview][data-mu-page="support"] #index_content .sp2-page.is-kb .sp2-v-thread { grid-template-columns: minmax(0, 1fr); }
  body[data-mu-preview][data-mu-page="support"] #index_content .sp2-page.is-kb .sp2-info { display: none; }
  body[data-mu-preview][data-mu-page="support"] #index_content .sp2-page.is-kb .sp2-v-desc .sp2-label { display: none; }
}

/* ------------------------------------------------------------------ */
/* 7. Badge chưa đọc — thẻ "Hỗ trợ" ở hub Ví + chấm ở tab Ví (v2.js    */
/*    linkCard/syncBadges; số do server in vào link data-mu-badge).    */
/*    Dùng ở mọi trang V2 nên không scope theo slug.                    */
/* ------------------------------------------------------------------ */
body[data-mu-preview] .mu-hub .mu-card > .mu-badge {
  position: absolute;
  top: 50%;
  right: 32px; /* ngay trước mũi tên › (không che mũi tên) */
  transform: translateY(-50%);
  min-width: 20px;
  height: 20px;
  padding: 0 6px;
  border-radius: 10px;
  background: #e7c78d;
  color: #251d12;
  font: 800 11px/20px var(--mu-font-body, 'Be Vietnam Pro', sans-serif);
  text-align: center;
  font-variant-numeric: tabular-nums;
  box-shadow: 0 0 0 2px #151a1f;
  pointer-events: none;
}
body[data-mu-preview] .mu-nav[data-mu-nav] { position: relative; }
body[data-mu-preview] .mu-nav > .mu-nav-dot {
  position: absolute;
  top: 9px;
  left: calc(50% + 7px);
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: #e7c78d;
  box-shadow: 0 0 0 2px #12171c;
  pointer-events: none;
}
@media (max-width: 700px) and (orientation: portrait) and (min-height: 481px) {
  body[data-mu-preview] .mu-nav > .mu-nav-dot { top: 8px; }
}
@media (max-height: 480px) {
  body[data-mu-preview] .mu-nav > .mu-nav-dot { top: 5px; left: calc(50% + 5px); }
}

/* 28/09/2026 — loại Tài khoản (support.js step2Account): mô tả ngắn dưới tên vấn đề + khối liên hệ tuỳ chọn (trường hợp gấp) */
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-acc { align-items: flex-start; }
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-acc > .sp2-radio { margin-top: 2px; }
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-acc-txt { display: flex; flex-direction: column; gap: 2px; min-width: 0; text-align: left; }
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-acc-desc { color: #a9a49a; font: 500 11.5px/1.35 var(--mu-font-body); overflow-wrap: anywhere; }
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-contact { flex: none; display: grid; gap: 6px; padding: 8px 10px 4px; border-top: 1px solid #3a3f45; }
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-contact-row { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 8px; align-items: center; }
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-seg { display: inline-flex; gap: 3px; padding: 3px; border: 1px solid #3a3f45; border-radius: 9px; background: #10151b; }
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-seg-b { display: inline-flex; align-items: center; gap: 6px; min-height: 36px; padding: 0 11px; border: 0; border-radius: 7px; background: transparent; color: #b9b8b5; font: 600 13px/1 var(--mu-font-body); cursor: pointer; white-space: nowrap; }
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-seg-b.is-on { background: #3b3326; color: #e7c78d; box-shadow: inset 0 0 0 1px #776342; }
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-join { display: inline-flex; align-items: center; justify-content: center; gap: 8px; }
body[data-mu-preview][data-mu-page="support"] #index_content .sp2-join i { color: var(--mu-popup-gold); }