/* SportBMS (v2) — คืนค่า default ของเบราว์เซอร์ที่ Tailwind preflight รีเซ็ตไป (ของเดิมไม่มี preflight) + จุดที่ต่างจากระบบเดิม */
/*
 * scope = กล่องราก div.pmj-root.pmj-legacy (ทำหน้าที่ body ของเดิม) · <html> มีแค่ .pmj-legacy-root (font-size 18px ของเดิม)
 * โมดัล/ป๊อปอัพของระบบ v2 อยู่นอกกล่อง (Radix portal ไป body) → ไม่โดน CSS เดิม หน้าตาเหมือน layout SPORT ปกติ
 * ค่าพื้นฐานของหน้า = ของเดิม (ตัวอักษรดำ · line-height normal · พื้น --surface-ground #f9fafb) — v2 ตั้งเทา/1.5/ขาวไว้
 */
.pmj-legacy:not(.sbms-v2-island *){font-family:var(--font-family,'Kanit',sans-serif);color:#000;line-height:normal}
/* sport/index.scss ตั้ง body.sport-layout{background-color:...!important} — พื้นนอกกล่องใช้ --surface-ground ของ theme เดิม */
html.pmj-legacy-root body.sport-layout{background-color:var(--surface-ground,#f9fafb)!important}
/* default ของเบราว์เซอร์ที่ Tailwind preflight ลบทิ้ง — :where() = ไม่เพิ่ม specificity ให้ .p-reset / class ของแบรนด์ชนะได้เหมือนของเดิม */
:where(.pmj-legacy) h1:not(.sbms-v2-island *),:where(.pmj-legacy) h2:not(.sbms-v2-island *),:where(.pmj-legacy) h3:not(.sbms-v2-island *),:where(.pmj-legacy) h4:not(.sbms-v2-island *),:where(.pmj-legacy) h5:not(.sbms-v2-island *),:where(.pmj-legacy) h6:not(.sbms-v2-island *){font-weight:bold;margin-block:.67em}
:where(.pmj-legacy) h1:not(.sbms-v2-island *){font-size:2em}
:where(.pmj-legacy) h2:not(.sbms-v2-island *){font-size:1.5em;margin-block:.83em}
:where(.pmj-legacy) h3:not(.sbms-v2-island *){font-size:1.17em;margin-block:1em}
:where(.pmj-legacy) h4:not(.sbms-v2-island *){font-size:1em;margin-block:1.33em}
:where(.pmj-legacy) h5:not(.sbms-v2-island *){font-size:.83em;margin-block:1.67em}
:where(.pmj-legacy) h6:not(.sbms-v2-island *){font-size:.67em;margin-block:2.33em}
:where(.pmj-legacy) p:not(.sbms-v2-island *){margin-block:1em}
:where(.pmj-legacy) ul:not(.sbms-v2-island *),:where(.pmj-legacy) ol:not(.sbms-v2-island *){padding-inline-start:40px;margin-block:1em}
:where(.pmj-legacy) ul:not(.sbms-v2-island *){list-style:disc}
:where(.pmj-legacy) ol:not(.sbms-v2-island *){list-style:decimal}
:where(.pmj-legacy) img:not(.sbms-v2-island *),:where(.pmj-legacy) video:not(.sbms-v2-island *),:where(.pmj-legacy) canvas:not(.sbms-v2-island *){display:inline;vertical-align:baseline;max-width:none;height:auto}
:where(.pmj-legacy) svg:not(.sbms-v2-island *){display:inline;vertical-align:baseline}
/* .p-reset ของ PrimeVue 3 (อยู่ใน primevue.css เดิม ไม่อยู่ใน style ที่ component ฉีด) — ul จุดแบนเนอร์ไม่มี margin */
:where(.pmj-legacy) .p-reset:not(.sbms-v2-island *){margin:0;padding:0;border:0;outline:0;text-decoration:none;font-size:100%;list-style:none}
:where(.pmj-legacy) hr:not(.sbms-v2-island *){border-top:1px solid #dee2e6;margin:1rem 0}
:where(.pmj-legacy) a:not(.sbms-v2-island *){color:LinkText;color:-webkit-link;text-decoration:underline}
:where(.pmj-legacy) small:not(.sbms-v2-island *){font-size:smaller}
:where(.pmj-legacy) b:not(.sbms-v2-island *),:where(.pmj-legacy) strong:not(.sbms-v2-island *){font-weight:bold}
:where(.pmj-legacy) table:not(.sbms-v2-island *){border-collapse:separate}
:where(.pmj-legacy) button:not(.sbms-v2-island *),:where(.pmj-legacy) input:not(.sbms-v2-island *),:where(.pmj-legacy) textarea:not(.sbms-v2-island *),:where(.pmj-legacy) select:not(.sbms-v2-island *){font-family:inherit;font-size:13.3333px;line-height:normal;color:inherit}
.pmj-legacy .p-inputtext:not(.sbms-v2-island *)::placeholder{color:#6c757d}
/* PrimeVue 3.4x ปุ่มโหลด */
.pmj-legacy .p-button-loading-icon:not(.sbms-v2-island *){margin-right:.5rem}
.pmj-legacy .p-button.p-button-icon-only.p-button-loading .p-button-loading-icon:not(.sbms-v2-island *){margin:0}
/* mask ไดอะล็อกของเดิม (primevue core) */
.pmj-legacy .p-component-overlay:not(.sbms-v2-island *){background-color:rgba(0,0,0,.4);transition-duration:.2s}
.pmj-legacy .p-dialog-mask:not(.sbms-v2-island *){padding:0 .75rem}
/* .grid ของ primeflex ชนะ tailwind (display:grid) — ระบุซ้ำเผื่อ tailwind มาทีหลัง */
.pmj-legacy .grid:not(.sbms-v2-island *){display:flex;flex-wrap:wrap;margin-right:-.5rem;margin-left:-.5rem;margin-top:-.5rem}
.pmj-legacy .grid-nogutter:not(.sbms-v2-island *){margin-right:0;margin-left:0;margin-top:0}
.pmj-legacy .grid-nogutter>.col:not(.sbms-v2-island *),.pmj-legacy .grid-nogutter>[class*=col-]:not(.sbms-v2-island *){padding:0}
/* ของระบบ v2 ที่ไม่มีในของเดิม — ซ่อน/ปรับให้กลืนกับดีไซน์เดิม */
.pmj-legacy .sport-layout .sport-loader:not(.sbms-v2-island *),.pmj-legacy #loading-overlay:not(.sbms-v2-island *){display:none!important}
.pmj-root.pmj-legacy:not(.sbms-v2-island *){min-height:100svh;background:var(--surface-ground,#eff3f8)}
/* หน้า auth ของเดิมสูงเต็มจอ */
.pmj-legacy #login-page.layout-wrapper:not(.sbms-v2-island *),.pmj-legacy #register-page.layout-wrapper:not(.sbms-v2-island *){display:flex;flex-direction:column;min-height:100svh}
/* ทำให้ dropdown ที่ทำจาก <select> ดูเหมือน p-dropdown */
.pmj-legacy select.p-dropdown-native:not(.sbms-v2-island *){appearance:none;-webkit-appearance:none;width:100%;border:0;background:transparent;font:inherit;color:inherit;padding:.75rem 2.5rem .75rem .75rem;cursor:pointer;outline:none}
/* Turnstile/แคปช่า ของ v2 จัดกลาง */
.pmj-legacy .cf-turnstile:not(.sbms-v2-island *),.pmj-legacy .captcha-field:not(.sbms-v2-island *){display:flex;justify-content:center}
/* เกาะ v2 (.sbms-v2-island): CSS เดิมไม่แตะของข้างใน (:not(.sbms-v2-island *) ทุก rule — ดู scope-legacy) แต่ค่าที่ "สืบทอด"
   จากกล่อง .pmj-legacy (ฟอนต์ theme เดิม · สีดำ · line-height normal) ยังไหลเข้า → คืนเป็นค่าของ v2 (body: Prompt · 1.5 · --text-primary) */
.pmj-legacy .sbms-v2-island{font-family:var(--font-prompt),sans-serif;line-height:1.5;color:var(--text-primary,inherit)}

/* กันหน้าเด้งยืดตอนลากเลื่อนเลยขอบบน (rubber-band ของ macOS/Android) — ส่วนหัวจะเลื่อนลงมาเห็นพื้นเทาเหนือเว็บ (ผู้ใช้เจอ 2026-09-30) */
html.pmj-legacy-root,
html.pmj-legacy-root body {
  overscroll-behavior-y: none;
}

/* จุด indicator ของแบนเนอร์หน้าแรก: กล่องเนื้อหายกทับแบนเนอร์ (--bms-home-overlap จาก layout) → ดันจุดขึ้นพ้นส่วนที่ถูกทับ */
.pmj-legacy .layout-topbar-main-gallery .p-galleria-indicator-onitem .p-galleria-indicators:not(.sbms-v2-island *) { padding-bottom: calc(1rem + var(--bms-home-overlap, 0px)); }

/* ป้ายเมนูจากหลังบ้าน (จัดการหน้าเว็บ → ป้ายเมนู) บนการ์ดเมนูหน้าแรก — เอฟเฟคเดียวกับ _menu-badge.scss ของธีมอื่น */
/* ริบบิ้นเดิมใช้ฟอนต์ Lato (ไม่มีอักษรไทย → ข้อความไทยหลุดฟอนต์) → ใช้ฟอนต์เว็บ (Kanit) แทน · ตัวหนา ขนาดพอดีริบบิ้น */
.pmj-legacy .pmj-ribbon-box .ribbon span:not(.sbms-v2-island *) { font-family: var(--font-family, 'Kanit', sans-serif); font-size: 11px; line-height: 1.4; letter-spacing: .3px; }
.pmj-legacy .pmj-ribbon-box .pmj-menu-badge-img { position: absolute; top: 4px; left: 4px; width: 36px; height: auto; z-index: 2; pointer-events: none; }
/* ป้ายริบบิ้นของเดิมกางเต็มการ์ด (width/height 100% + absolute) → ทับปุ่มเมนู กดไม่ได้ (ผู้ใช้เจอ 2026-10-05) — ป้ายไม่รับคลิก */
.pmj-legacy .pmj-ribbon-box .ribbon:not(.sbms-v2-island *),
.pmj-legacy .pmj-ribbon-box .ribbon span:not(.sbms-v2-island *) { pointer-events: none; }
.pmj-legacy .ribbon span.-blink, .pmj-legacy .pmj-menu-badge-img.-blink { animation: bms-badge-blink 1s step-end infinite; }
.pmj-legacy .ribbon span.-pulse, .pmj-legacy .pmj-menu-badge-img.-pulse { animation: bms-badge-pulse 1.2s ease-in-out infinite; }
.pmj-legacy .ribbon span.-shake, .pmj-legacy .pmj-menu-badge-img.-shake { animation: bms-badge-shake .8s ease-in-out infinite; }
.pmj-legacy .ribbon span.-bounce, .pmj-legacy .pmj-menu-badge-img.-bounce { animation: bms-badge-bounce 1s ease-in-out infinite; }
.pmj-legacy .ribbon span.-glow, .pmj-legacy .pmj-menu-badge-img.-glow { animation: bms-badge-glow 1.4s ease-in-out infinite; }
.pmj-legacy .ribbon span.-fade, .pmj-legacy .pmj-menu-badge-img.-fade { animation: bms-badge-fade 1.6s ease-in-out infinite; }
.pmj-legacy .ribbon span.-wobble, .pmj-legacy .pmj-menu-badge-img.-wobble { animation: bms-badge-wobble 1s ease-in-out infinite; }
.pmj-legacy .ribbon span.-flip, .pmj-legacy .pmj-menu-badge-img.-flip { animation: bms-badge-flip 2s linear infinite; }
.pmj-legacy .ribbon span.-heartbeat, .pmj-legacy .pmj-menu-badge-img.-heartbeat { animation: bms-badge-heartbeat 1.4s ease-in-out infinite; }
.pmj-legacy .ribbon span.-ring, .pmj-legacy .pmj-menu-badge-img.-ring { animation: bms-badge-ring 1.6s ease-in-out infinite; }
@keyframes bms-badge-blink { 50% { opacity: 0; } }
@keyframes bms-badge-pulse { 0%, 100% { transform: scale(1); } 50% { transform: scale(1.12); } }
@keyframes bms-badge-shake { 0%, 100% { transform: translateX(0); } 25% { transform: translateX(-2px); } 75% { transform: translateX(2px); } }
@keyframes bms-badge-bounce { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-3px); } }
@keyframes bms-badge-glow { 0%, 100% { filter: drop-shadow(0 0 0 rgba(255,255,255,0)); } 50% { filter: drop-shadow(0 0 6px rgba(255,255,255,.9)); } }
@keyframes bms-badge-fade { 0%, 100% { opacity: 1; } 50% { opacity: .35; } }
@keyframes bms-badge-wobble { 0%, 100% { transform: rotate(0); } 25% { transform: rotate(-4deg); } 75% { transform: rotate(4deg); } }
@keyframes bms-badge-flip { 0% { transform: rotateY(0); } 50% { transform: rotateY(180deg); } 100% { transform: rotateY(360deg); } }
@keyframes bms-badge-heartbeat { 0%, 100% { transform: scale(1); } 14% { transform: scale(1.15); } 28% { transform: scale(1); } 42% { transform: scale(1.15); } }
@keyframes bms-badge-ring { 0%, 100% { box-shadow: 0 0 0 0 rgba(255,255,255,.7); } 50% { box-shadow: 0 0 0 4px rgba(255,255,255,0); } }

/* หน้าแนะนำเพื่อน: กล่องลิงก์ + ปุ่มคัดลอกในแถวเดียว (แทน h4.link-truncate ของเดิมที่กว้าง 80% เยื้องซ้าย) */
.pmj-legacy .pmj-refer-link { display: flex; align-items: center; gap: 10px; width: 100%; padding: 5px 5px 5px 14px; border-radius: 999px; background: #fff; border: 1px solid color-mix(in srgb, var(--primary-color, #2196f3) 28%, transparent); box-shadow: 0 2px 10px rgba(0, 0, 0, .06); cursor: pointer; -webkit-tap-highlight-color: transparent; transition: box-shadow .15s ease, transform .1s ease; }
.pmj-legacy .pmj-refer-link:active { transform: scale(.99); box-shadow: 0 1px 4px rgba(0, 0, 0, .08); }
.pmj-legacy .pmj-refer-link:focus-visible { outline: 2px solid var(--primary-color, #2196f3); outline-offset: 2px; }
.pmj-legacy .pmj-refer-link__icon { flex: 0 0 auto; font-size: 15px; color: var(--primary-color, #2196f3); }
.pmj-legacy .pmj-refer-link__text { flex: 1 1 auto; min-width: 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; text-align: left; font-size: 14px; font-weight: 600; line-height: 1.4; color: #333; }
.pmj-legacy .pmj-refer-link .p-button { flex: 0 0 auto; margin: 0; padding: 7px 14px; font-size: 13px; line-height: 1.2; white-space: nowrap; }
.pmj-legacy .pmj-refer-link .p-button .p-button-icon { font-size: 13px; }
.pmj-legacy .pmj-refer-link.-empty { cursor: default; }
.pmj-legacy .pmj-refer-link.-empty .pmj-refer-link__text { font-weight: 400; color: #999; }

/* หน้าตรวจรับเครดิตฟรี: ตารางรายชื่อ (แปลงจากรายการคั่น tab ที่แอดมินวางในบทความ) */
.pmj-legacy .pmj-free-credit-table { width: 100%; border-collapse: collapse; white-space: normal; font-size: 13px; }
.pmj-legacy .pmj-free-credit-table td { padding: 8px 10px; text-align: left; vertical-align: middle; word-break: break-word; border-bottom: 1px solid rgba(0, 0, 0, .06); }
.pmj-legacy .pmj-free-credit-table tr:nth-child(odd) td { background: color-mix(in srgb, var(--primary-color, #2196f3) 6%, transparent); }
.pmj-legacy .pmj-free-credit-table tr:last-child td { border-bottom: 0; }
.pmj-legacy .pmj-free-credit-table td.-amount { text-align: right; font-weight: 600; white-space: nowrap; color: var(--primary-color, #2196f3); font-variant-numeric: tabular-nums; }
.pmj-legacy .pmj-free-credit-table tr td:first-child { border-radius: 8px 0 0 8px; }
.pmj-legacy .pmj-free-credit-table tr td:last-child { border-radius: 0 8px 8px 0; }

/* บทความ (SportBMS — ของเดิมไม่มีหน้านี้): รายการการ์ด + หน้าอ่าน */
.pmj-legacy .pmj-blog-list { display: grid; gap: 14px; margin-top: 12px; }
.pmj-legacy .pmj-blog-card { display: block; overflow: hidden; border-radius: 15px; background: #fff; color: inherit; text-decoration: none; box-shadow: 0 2px 12px rgba(0, 0, 0, .08); border: 1px solid rgba(0, 0, 0, .05); -webkit-tap-highlight-color: transparent; transition: transform .1s ease, box-shadow .15s ease; }
.pmj-legacy .pmj-blog-card:active { transform: scale(.99); box-shadow: 0 1px 5px rgba(0, 0, 0, .1); }
.pmj-legacy .pmj-blog-card__img { display: block; width: 100%; aspect-ratio: 16 / 9; object-fit: cover; }
.pmj-legacy .pmj-blog-card__body { padding: 12px 14px 12px; text-align: left; }
.pmj-legacy .pmj-blog-card__title { margin: 0 0 4px; font-size: 16px; font-weight: 700; line-height: 1.35; color: #222; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.pmj-legacy .pmj-blog-card__desc { margin: 0 0 8px; font-size: 13px; line-height: 1.5; color: #777; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.pmj-legacy .pmj-blog-card__meta { display: flex; align-items: center; justify-content: space-between; gap: 10px; font-size: 12px; color: #999; }
.pmj-legacy .pmj-blog-card__meta .pi { font-size: 11px; }
.pmj-legacy .pmj-blog-card__more { color: var(--primary-color, #2196f3); font-weight: 600; }
.pmj-legacy .pmj-blog-back { display: inline-flex; align-items: center; gap: 4px; margin-bottom: 8px; font-size: 13px; font-weight: 600; color: var(--primary-color, #2196f3); text-decoration: none; }
.pmj-legacy .pmj-blog-title { margin: 0 0 6px; font-size: 22px; line-height: 1.3; text-align: left; }
.pmj-legacy .pmj-blog-cover { display: block; width: 100%; border-radius: 12px; margin-bottom: 14px; }
.pmj-legacy .pmj-blog-content { text-align: left; font-size: 14px; line-height: 1.75; color: #333; overflow-wrap: anywhere; }
.pmj-legacy .pmj-blog-content p { margin: 0 0 12px; }
.pmj-legacy .pmj-blog-content h2, .pmj-legacy .pmj-blog-content h3, .pmj-legacy .pmj-blog-content h4 { margin: 18px 0 8px; line-height: 1.35; color: #222; }
.pmj-legacy .pmj-blog-content h2 { font-size: 18px; } .pmj-legacy .pmj-blog-content h3 { font-size: 16px; } .pmj-legacy .pmj-blog-content h4 { font-size: 15px; }
.pmj-legacy .pmj-blog-content img, .pmj-legacy .pmj-blog-content video, .pmj-legacy .pmj-blog-content iframe { max-width: 100%; height: auto; border-radius: 10px; }
.pmj-legacy .pmj-blog-content ul, .pmj-legacy .pmj-blog-content ol { margin: 0 0 12px; padding-left: 22px; }
.pmj-legacy .pmj-blog-content ul { list-style: disc; } .pmj-legacy .pmj-blog-content ol { list-style: decimal; }
.pmj-legacy .pmj-blog-content a { color: var(--primary-color, #2196f3); text-decoration: underline; }
.pmj-legacy .pmj-blog-content table { display: block; max-width: 100%; overflow-x: auto; border-collapse: collapse; }
.pmj-legacy .pmj-blog-content td, .pmj-legacy .pmj-blog-content th { padding: 6px 8px; border: 1px solid rgba(0, 0, 0, .1); }
.pmj-legacy .pmj-blog-nav { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 20px; padding-top: 14px; border-top: 1px solid rgba(0, 0, 0, .08); }
.pmj-legacy .pmj-blog-nav__item { display: grid; gap: 2px; min-width: 0; padding: 10px 12px; border-radius: 12px; background: color-mix(in srgb, var(--primary-color, #2196f3) 7%, transparent); color: inherit; text-decoration: none; text-align: left; }
.pmj-legacy .pmj-blog-nav__item.-next { text-align: right; }
.pmj-legacy .pmj-blog-nav__item small { font-size: 11px; color: var(--primary-color, #2196f3); font-weight: 600; }
.pmj-legacy .pmj-blog-nav__item span { font-size: 13px; font-weight: 600; color: #333; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.pmj-legacy .pmj-blog-count { margin: -4px 0 0; font-size: 12px; color: #999; }
.pmj-legacy .pmj-blog-paginator { margin-top: 18px; }
.pmj-legacy .pmj-blog-paginator .p-paginator { display: flex; flex-wrap: nowrap; align-items: center; justify-content: center; gap: 2px; padding: 0; }
.pmj-legacy .pmj-blog-paginator .p-paginator-pages { display: flex; align-items: center; gap: 2px; }
.pmj-legacy .pmj-blog-paginator a.p-link { display: inline-flex; align-items: center; justify-content: center; flex: 0 0 auto; min-width: 38px; width: 38px; height: 38px; margin: 0; font-size: 15px; text-decoration: none; }

/* ไอคอนเมนูหน้าแรกแบบเส้น (หมุนวงล้อ/เปิดไพ่/LINE + เมนูฟีเจอร์ v2) บนแบรนด์วงไอคอนพื้นอ่อน:
   รูปขาวเป็น mask แล้วเทสีแบรนด์ (ui.menuLineTone) — ขนาด/ระยะเท่า <img class="img p-2"> เดิม */
.pmj-legacy #home .menu-container .menu-row .menu-item .box .pmj-home-menu .pmj-menu-line-icon {
  display: block;
  width: 100%;
  aspect-ratio: 1 / 1;
  box-sizing: border-box;
  -webkit-mask: var(--bms-line-icon) center / contain no-repeat content-box;
  mask: var(--bms-line-icon) center / contain no-repeat content-box;
}

/* ── สไลด์ "ผู้ให้บริการ" หน้าแรก (SportBmsBoardSlider): แถวเดียว เห็นทีละ 3 · ปัด/ลาก/ลูกศร/จุดบอกหน้า ── */
.pmj-legacy #home .bms-boards { position: relative; }
.pmj-legacy #home .bms-boards-viewport { position: relative; }
/* มีหลายหน้า: เว้นร่องซ้าย/ขวาให้ลูกศร — ไม่ทับรูปแม้จอแคบ (320px) */
.pmj-legacy #home .bms-boards-viewport.-paged { padding: 0 22px; }
.pmj-legacy #home .bms-boards-track {
  display: flex;
  overflow-x: auto;
  overflow-y: hidden;
  scroll-snap-type: x mandatory;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  overscroll-behavior-x: contain;
  padding: 4px 0;
}
.pmj-legacy #home .bms-boards-track::-webkit-scrollbar { display: none; }
.pmj-legacy #home .bms-boards-track.is-dragging { scroll-snap-type: none; cursor: grabbing; user-select: none; }
.pmj-legacy #home .bms-boards-item {
  flex: 0 0 calc(100% / 3);
  min-width: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 0 4px;
  box-sizing: border-box;
}
/* snap ทีละหน้า (ทุก 3 รายการ) */
.pmj-legacy #home .bms-boards-item:nth-child(3n + 1) { scroll-snap-align: start; }
.pmj-legacy #home .bms-boards-item .service-title .pmj-text-mini {
  overflow: hidden;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  word-break: break-word;
}
.pmj-legacy #home .bms-boards-item img { -webkit-user-drag: none; }
/* รูปหมวด: ใหญ่กว่าปุ่มเดิม (70px ของผังตาราง 3×2) แต่เว้นช่องไฟระหว่างรูป — 76px ในช่อง ~111px · จอแคบย่อตามช่อง
   เงานุ่มใต้รูปให้ลอยจากพื้น · ชื่อหมวดเว้นจากรูป */
.pmj-legacy #home .bms-boards-track { padding: 6px 0 10px; }
.pmj-legacy #home .bms-boards-item .pmj-button-avatar-pvd.p-button {
  width: min(calc(100% - 30px), 76px) !important;
  height: auto !important;
  aspect-ratio: 1 / 1;
  padding: 0 !important;
  overflow: visible;
}
.pmj-legacy #home .bms-boards-item .pmj-button-avatar-pvd.p-button img {
  width: 100%;
  height: 100%;
  margin-top: 0 !important;
  object-fit: cover;
  box-shadow: 0 6px 14px rgba(16, 24, 40, 0.16);
  transition: transform 0.15s ease;
}
.pmj-legacy #home .bms-boards-item .pmj-button-avatar-pvd.p-button:active img { transform: scale(0.95); }
.pmj-legacy #home .bms-boards-item .service-title { margin-top: 10px !important; }
.pmj-legacy #home .bms-boards-item .service-title .pmj-text-mini { font-size: 0.85rem; }
/* ลูกศร: วงกลมลอยชิดขอบ กึ่งกลางแนวรูป */
.pmj-legacy #home .bms-boards-nav {
  position: absolute;
  top: 44px;
  transform: translateY(-50%);
  z-index: 2;
  width: 28px;
  height: 28px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: #fff;
  color: var(--primary-color, #0088ff);
  box-shadow: 0 2px 8px rgba(16, 24, 40, 0.22);
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: opacity 0.2s ease, transform 0.15s ease;
}
.pmj-legacy #home .bms-boards-nav.-prev { left: -6px; }
.pmj-legacy #home .bms-boards-nav.-next { right: -6px; }
.pmj-legacy #home .bms-boards-nav:active { transform: translateY(-50%) scale(0.92); }
.pmj-legacy #home .bms-boards-nav:disabled { opacity: 0; pointer-events: none; }
.pmj-legacy #home .bms-boards-nav .pi { font-size: 1rem; }
/* จุดบอกหน้า: หน้าปัจจุบันเป็นขีดยาวสีหลัก · พื้นที่กดกว้างกว่าจุดที่เห็น */
.pmj-legacy #home .bms-boards-dots { display: flex; justify-content: center; align-items: center; gap: 2px; margin-top: 6px; }
.pmj-legacy #home .bms-boards-dot {
  position: relative;
  width: 20px;
  height: 20px;
  padding: 0;
  border: 0;
  background: transparent;
  cursor: pointer;
}
.pmj-legacy #home .bms-boards-dot::before {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  width: 7px;
  height: 7px;
  border-radius: 999px;
  background: #cbd5e1;
  transform: translate(-50%, -50%);
  transition: width 0.25s ease, background-color 0.25s ease;
}
.pmj-legacy #home .bms-boards-dot.-active::before { width: 18px; background: var(--primary-color, #0088ff); }
.pmj-legacy #home .dark-theme .bms-boards-dot::before { background: rgba(255, 255, 255, 0.28); }
.pmj-legacy #home .dark-theme .bms-boards-dot.-active::before { background: var(--primary-color, #fee0ba); }

/* หน้าฝาก — โหมด "เลือกบัญชี": รายการบัญชีร้านที่ขั้นโอน
   การ์ด: โลโก้ | ธนาคาร · เลขบัญชี (เด่น) · ชื่อบัญชี | ปุ่มคัดลอก (อยู่ในการ์ด ไม่ห้อยทับขอบ)
   โชว์ให้คัดลอกเลขอย่างเดียว ไม่ต้องกดเลือก — แนบสลิปแล้วกดยืนยันได้เลย */
.pmj-legacy #deposit .bms-acc-list { display: grid; gap: 10px; margin: 0.5rem 0 1rem; }
.pmj-legacy #deposit .bms-acc-list > h4 { margin: 0.25rem 0 0.125rem !important; }
.pmj-legacy #deposit .bms-acc {
  display: grid;
  grid-template-columns: 48px minmax(0, 1fr) auto;
  align-items: center;
  column-gap: 12px;
  padding: 12px 14px;
  border-radius: 16px;
  border: 1.5px solid rgba(99, 102, 241, 0.16);
  background: rgba(99, 102, 241, 0.06);
  text-align: left;
  transition: border-color 0.15s ease, box-shadow 0.15s ease, background-color 0.15s ease;
}
.pmj-legacy #deposit .bms-acc-logo { width: 48px; height: 48px; border-radius: 50%; object-fit: cover; }
.pmj-legacy #deposit .bms-acc-body { min-width: 0; }
.pmj-legacy #deposit .bms-acc-bank { font-size: 0.85rem; font-weight: 600; opacity: 0.7; line-height: 1.3; }
.pmj-legacy #deposit .bms-acc-no { font-size: 1.2rem; font-weight: 700; letter-spacing: 0.04em; line-height: 1.35; overflow-wrap: anywhere; }
.pmj-legacy #deposit .bms-acc-name { font-size: 0.85rem; line-height: 1.3; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pmj-legacy #deposit .bms-acc-side { display: flex; align-items: center; }
.pmj-legacy #deposit .bms-acc-copy {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 7px 14px;
  border: 0;
  border-radius: 999px;
  background: var(--primary-color, #6366f1);
  color: var(--primary-color-text, #fff);
  font: inherit;
  font-size: 0.8rem;
  font-weight: 600;
  line-height: 1.2;
  white-space: nowrap;
  cursor: pointer;
}
.pmj-legacy #deposit .bms-acc-copy:active { transform: scale(0.96); }
.pmj-legacy #deposit .bms-acc-copy .pi { font-size: 0.8rem; }

/* แนะนำเพื่อน: การ์ดรายได้จากสาย (ค่าแนะนำ/คืนยอดเสีย/คอม) + ปุ่มกดรับ — ทรงเดียวกับการ์ดบัญชีหน้าฝาก */
.pmj-legacy #invite-friend .bms-refpot-list { display: grid; gap: 10px; margin: 0.25rem 0 0.5rem; }
.pmj-legacy #invite-friend .bms-refpot {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  column-gap: 12px;
  padding: 12px 14px;
  border-radius: 16px;
  border: 1.5px solid rgba(99, 102, 241, 0.16);
  background: rgba(99, 102, 241, 0.06);
  text-align: left;
}
.pmj-legacy #invite-friend .bms-refpot-label { font-size: 0.85rem; font-weight: 600; opacity: 0.75; line-height: 1.3; }
.pmj-legacy #invite-friend .bms-refpot-amount { font-size: 1.35rem; font-weight: 700; line-height: 1.3; color: var(--primary-color, #6366f1); }
.pmj-legacy #invite-friend .bms-refpot-amount small { font-size: 0.8rem; font-weight: 600; color: inherit; opacity: 0.8; }
.pmj-legacy #invite-friend .bms-refpot-hint { font-size: 0.78rem; line-height: 1.3; opacity: 0.7; }
.pmj-legacy #invite-friend .bms-refpot-btn { white-space: nowrap; }

/* โปรโมชั่น: ไดอะล็อกรายละเอียด — ของเดิมจัดกลางทั้งก้อน (bullet ลอยกลาง · ช่องว่างใต้เนื้อหาเยอะ) → จัดใหม่ให้อ่านง่าย */
/* ขอบข้าง: ใส่ที่ header/content/footer ตรง ๆ (padding ของ .p-dialog ถูกกฎจอเล็กของเดิมลบทิ้ง → เนื้อหาชิดขอบ) */
.pmj-legacy .bms-promo-dialog.p-dialog { max-width: calc(100vw - 24px); }
.pmj-legacy .bms-promo-dialog .p-dialog-header { padding: 12px 20px 0 !important; }
.pmj-legacy .bms-promo-dialog .p-dialog-content { padding: 0 20px 8px !important; }
.pmj-legacy .bms-promo-dialog .p-dialog-footer { padding: 8px 20px 20px !important; }
.pmj-legacy .bms-promo-detail { text-align: left; }
.pmj-legacy .bms-promo-img { display: block; width: 100%; border-radius: 14px; margin: 0 0 14px; object-fit: cover; }
.pmj-legacy .bms-promo-title { font-size: 1.2rem !important; font-weight: 700; line-height: 1.35; text-align: center; margin: 0 0 10px !important; }
.pmj-legacy .bms-promo-content { font-size: 0.95rem; line-height: 1.55; color: #333; }
.pmj-legacy .bms-promo-content > :first-child { margin-top: 0; }
.pmj-legacy .bms-promo-content > :last-child { margin-bottom: 0; }
.pmj-legacy .bms-promo-content p { margin: 0 0 8px; }
.pmj-legacy .bms-promo-content h1, .pmj-legacy .bms-promo-content h2, .pmj-legacy .bms-promo-content h3, .pmj-legacy .bms-promo-content h4 { font-size: 1rem; font-weight: 700; margin: 10px 0 6px; text-align: left; }
.pmj-legacy .bms-promo-content ul, .pmj-legacy .bms-promo-content ol { margin: 0 0 8px; padding-left: 1.3em; text-align: left; }
.pmj-legacy .bms-promo-content li { margin: 0 0 4px; }
.pmj-legacy .bms-promo-content img { max-width: 100%; height: auto; border-radius: 10px; }
.pmj-legacy .bms-promo-status {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  margin-top: 12px;
  padding: 10px 12px;
  border-radius: 12px;
  font-size: 0.9rem;
  font-weight: 600;
  line-height: 1.4;
}
.pmj-legacy .bms-promo-status .pi { font-size: 1rem; margin-top: 2px; }
.pmj-legacy .bms-promo-status.-ok { background: rgba(34, 197, 94, 0.1); color: #15803d; }
.pmj-legacy .bms-promo-status.-warn { background: rgba(239, 68, 68, 0.08); color: #b91c1c; }
.pmj-legacy .bms-promo-footer .p-button { margin-bottom: 0; }
.pmj-legacy .bms-promo-footer .p-button + .p-button { margin-top: 8px; }

/* รางวัล (แลกพอยท์): เงื่อนไขในรายละเอียด — รายการชิดซ้ายมีไอคอน */
.pmj-legacy .bms-reward-cond { display: inline-grid; gap: 6px; margin: 4px auto 10px; text-align: left; }
.pmj-legacy .bms-reward-cond-row { display: flex; align-items: flex-start; gap: 8px; font-size: 0.95rem; line-height: 1.45; }
.pmj-legacy .bms-reward-cond-row .pi { color: var(--primary-color, #6366f1); font-size: 0.95rem; margin-top: 3px; }

/* Toast: ของเดิมจัดกึ่งกลางแนวตั้งรอบ top:72px (translate -50%, -50%) — ข้อความยาวหลายบรรทัดจึงล้นขึ้นไปนอกจอ ("noti จม")
   ยึดขอบบนแทน: สั้นหรือยาวก็เริ่มที่ระยะเดียวกันและขยายลงล่าง */
html .pmj-legacy .p-toast-top-center:not(.sbms-v2-island *) { top: 24px !important; transform: translateX(-50%) !important; }
/* พื้น toast ของเดิมโปร่ง 70% — ทับหัวหน้าเว็บสีเข้ม/รูปแล้วตัวหนังสือกลืนกับพื้นหลัง → ทึบขึ้นให้อ่านออกทุกพื้น (สีเดิม) */
html .pmj-legacy .p-toast .p-toast-message.p-toast-message-info:not(.sbms-v2-island *) { background: rgba(219, 234, 254, 0.97); }
html .pmj-legacy .p-toast .p-toast-message.p-toast-message-warn:not(.sbms-v2-island *) { background: rgba(255, 242, 226, 0.97); }
html .pmj-legacy .p-toast .p-toast-message.p-toast-message-error:not(.sbms-v2-island *) { background: rgba(255, 231, 230, 0.97); }

/* เมนูล่าง (footer) ลอยทับเนื้อหา — การ์ดเนื้อหาเว้นที่ด้านล่างให้พ้น footer ทุกหน้า (เดิมเนื้อหาท้ายหน้าจมใต้ footer ~40px) */
html .pmj-legacy .layout-main-container > .layout-main:not(.sbms-v2-island *) { padding-bottom: 52px !important; }

/* หน้าฝาก — เลือกรับโปรโมชั่นก่อนฝาก (ช่องเลือกทรงเม็ดยาเข้าชุดกับช่องยอด) */
.pmj-legacy #deposit .bms-dep-promo { margin: 0.5rem 0 1rem; text-align: center; }
/* dropdown ของธีม: ปุ่มทรงเม็ดยา + แผงรายการลอย (เลือกแล้วมีเครื่องหมายถูก · รายการยาวเลื่อนในแผง) */
.pmj-legacy #deposit .bms-dd { position: relative; text-align: left; }
.pmj-legacy #deposit .bms-dd-trigger {
  display: flex;
  align-items: center;
  gap: 10px;
  width: 100%;
  min-height: 48px;
  padding: 0.55rem 1.1rem;
  border: 1px solid #d1d5db;
  border-radius: 2rem;
  background: #fff;
  color: #1f2937;
  font: inherit;
  font-weight: 600;
  text-align: left;
  cursor: pointer;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}
.pmj-legacy #deposit .bms-dd-trigger:hover,
.pmj-legacy #deposit .bms-dd.-open .bms-dd-trigger {
  border-color: var(--primary-color, #6366f1);
  box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.14);
}
.pmj-legacy #deposit .bms-dd-trigger:disabled { opacity: 0.65; cursor: default; }
.pmj-legacy #deposit .bms-dd-icon { flex: 0 0 auto; font-size: 1.05rem; color: var(--primary-color, #6366f1); }
.pmj-legacy #deposit .bms-dd-label { flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pmj-legacy #deposit .bms-dd-label.-placeholder { color: #6b7280; font-weight: 500; }
.pmj-legacy #deposit .bms-dd-caret { flex: 0 0 auto; font-size: 0.8rem; color: var(--primary-color, #6366f1); transition: transform 0.2s ease; }
.pmj-legacy #deposit .bms-dd.-open .bms-dd-caret { transform: rotate(180deg); }
.pmj-legacy #deposit .bms-dd-panel {
  position: absolute;
  z-index: 30;
  top: calc(100% + 6px);
  left: 0;
  right: 0;
  max-height: 264px;
  margin: 0;
  padding: 6px;
  list-style: none;
  overflow-y: auto;
  overscroll-behavior: contain;
  border: 1px solid rgba(15, 23, 42, 0.08);
  border-radius: 18px;
  background: #fff;
  box-shadow: 0 12px 32px rgba(16, 24, 40, 0.18);
  animation: bms-dd-in 0.14s ease-out;
}
@keyframes bms-dd-in {
  from { opacity: 0; transform: translateY(-4px); }
  to { opacity: 1; transform: translateY(0); }
}
.pmj-legacy #deposit .bms-dd-option {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 0.7rem 0.9rem;
  border-radius: 12px;
  color: #1f2937;
  font-size: 0.95rem;
  line-height: 1.35;
  cursor: pointer;
}
.pmj-legacy #deposit .bms-dd-option + .bms-dd-option { margin-top: 2px; }
.pmj-legacy #deposit .bms-dd-option:hover,
.pmj-legacy #deposit .bms-dd-option:focus-visible { background: rgba(99, 102, 241, 0.08); outline: none; }
.pmj-legacy #deposit .bms-dd-option.-selected { background: rgba(99, 102, 241, 0.12); color: var(--primary-color, #6366f1); font-weight: 700; }
.pmj-legacy #deposit .bms-dd-option.-none { color: #6b7280; }
.pmj-legacy #deposit .bms-dd-option.-none.-selected { color: var(--primary-color, #6366f1); }
.pmj-legacy #deposit .bms-dd-option-label { flex: 1 1 auto; min-width: 0; overflow-wrap: anywhere; }
.pmj-legacy #deposit .bms-dd-option .pi-check { flex: 0 0 auto; font-size: 0.9rem; }
.pmj-legacy #deposit .bms-dep-promo-hint { margin: 6px 0 0; font-size: 0.8rem; color: #16a34a; }
.pmj-legacy #deposit .bms-dd.-locked .bms-dd-trigger { background: rgba(0, 0, 0, 0.04); color: #555; cursor: not-allowed; opacity: 1; }
.pmj-legacy #deposit .bms-dd.-locked .bms-dd-icon, .pmj-legacy #deposit .bms-dd.-locked .bms-dd-caret { color: #b45309; }
.pmj-legacy #deposit .bms-dep-promo-hint.-locked { color: #b45309; }
.pmj-legacy #deposit .bms-dep-promo-active {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 0.6rem 1.1rem;
  border-radius: 2rem;
  background: rgba(22, 163, 74, 0.1);
  color: #15803d;
  font-weight: 600;
  font-size: 0.9rem;
}

/* ระดับสมาชิก + รางวัลตามระดับ (/privileges/rank) — การ์ดรายขั้น · แท็บรางวัล · ป้ายสถานะ */
/* ความคืบหน้าระดับ (ย้ายจากไดอะล็อกของบัตรสมาชิก) */
.pmj-legacy #rankPrivileges .bms-rank-progress {
  padding: 12px 14px;
  border-radius: 16px;
  border: 1.5px solid rgba(99, 102, 241, 0.16);
  background: rgba(99, 102, 241, 0.06);
  margin-bottom: 4px;
}
.pmj-legacy #rankPrivileges .bms-rank-progress-head { display: flex; align-items: center; gap: 12px; margin-bottom: 10px; }
.pmj-legacy #rankPrivileges .bms-rank-progress-img { width: 48px; height: 48px; object-fit: contain; }
.pmj-legacy #rankPrivileges .bms-rank-progress-name { font-size: 1.1rem; font-weight: 700; line-height: 1.3; }
.pmj-legacy #rankPrivileges .bms-rank-progress-meta { font-size: 0.85rem; opacity: 0.7; line-height: 1.3; }
.pmj-legacy #rankPrivileges .bms-rank-progress-bar { height: 10px; border-radius: 999px; background: rgba(0, 0, 0, 0.08); overflow: hidden; }
.pmj-legacy #rankPrivileges .bms-rank-progress-bar > div { height: 100%; border-radius: 999px; background: var(--primary-color, #6366f1); transition: width 0.4s ease; }
.pmj-legacy #rankPrivileges .bms-rank-progress-foot { display: flex; justify-content: space-between; gap: 10px; margin-top: 8px; font-size: 0.85rem; line-height: 1.4; }
.pmj-legacy #rankPrivileges .bms-rank-progress-foot .tabular { font-variant-numeric: tabular-nums; font-weight: 700; color: var(--primary-color, #6366f1); }
.pmj-legacy #rankPrivileges .bms-rank-list { display: grid; gap: 10px; }
.pmj-legacy #rankPrivileges .bms-rank {
  position: relative;
  display: grid;
  grid-template-columns: 56px minmax(0, 1fr);
  column-gap: 12px;
  align-items: start;
  padding: 12px 14px;
  border-radius: 16px;
  border: 1.5px solid rgba(99, 102, 241, 0.14);
  background: rgba(99, 102, 241, 0.05);
}
.pmj-legacy #rankPrivileges .bms-rank.-mine { border-color: var(--primary-color, #6366f1); background: rgba(99, 102, 241, 0.1); box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.12); }
.pmj-legacy #rankPrivileges .bms-rank.-ready { border-color: #16a34a; background: rgba(22, 163, 74, 0.07); }
.pmj-legacy #rankPrivileges .bms-rank.-done { opacity: 0.85; }
.pmj-legacy #rankPrivileges .bms-rank-no {
  position: absolute;
  top: -8px;
  left: -6px;
  min-width: 22px;
  height: 22px;
  padding: 0 6px;
  border-radius: 999px;
  background: var(--primary-color, #6366f1);
  color: #fff;
  font-size: 0.75rem;
  font-weight: 700;
  line-height: 22px;
  text-align: center;
  box-shadow: 0 2px 6px rgba(16, 24, 40, 0.2);
}
.pmj-legacy #rankPrivileges .bms-rank-img { width: 56px; height: 56px; object-fit: contain; border-radius: 12px; }
.pmj-legacy #rankPrivileges .bms-rank-img.-empty { background: rgba(99, 102, 241, 0.12); }
.pmj-legacy #rankPrivileges .bms-rank-body { min-width: 0; }
.pmj-legacy #rankPrivileges .bms-rank-name { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; font-size: 1rem; font-weight: 700; line-height: 1.3; }
.pmj-legacy #rankPrivileges .bms-rank-tag {
  display: inline-block;
  padding: 1px 8px;
  border-radius: 999px;
  background: var(--primary-color, #6366f1);
  color: #fff;
  font-size: 0.7rem;
  font-weight: 600;
  line-height: 1.5;
}
.pmj-legacy #rankPrivileges .bms-rank-tag.-ready { background: #16a34a; }
.pmj-legacy #rankPrivileges .bms-rank-tag.-done { background: #6b7280; }
.pmj-legacy #rankPrivileges .bms-rank-meta { margin-top: 2px; font-size: 0.8rem; color: #6b7280; line-height: 1.4; }
.pmj-legacy #rankPrivileges .bms-rank-priv { margin: 6px 0 0; padding-left: 1.1rem; font-size: 0.85rem; line-height: 1.5; }
.pmj-legacy #rankPrivileges .bms-rank-priv li + li { margin-top: 2px; }
.pmj-legacy #rankPrivileges .bms-rank-locked { margin-top: 8px; font-size: 0.8rem; color: #6b7280; }
.pmj-legacy #rankPrivileges .bms-rank-locked .pi { font-size: 0.75rem; margin-right: 4px; }
.pmj-legacy #rankPrivileges .bms-rank-tabs { display: flex; gap: 6px; padding: 4px; border-radius: 999px; background: rgba(99, 102, 241, 0.08); }
.pmj-legacy #rankPrivileges .bms-rank-tab {
  flex: 1 1 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 8px 10px;
  border: 0;
  border-radius: 999px;
  background: transparent;
  color: #4b5563;
  font: inherit;
  font-size: 0.9rem;
  font-weight: 600;
  cursor: pointer;
}
.pmj-legacy #rankPrivileges .bms-rank-tab.-active { background: #fff; color: var(--primary-color, #6366f1); box-shadow: 0 2px 8px rgba(16, 24, 40, 0.12); }
.pmj-legacy #rankPrivileges .bms-rank-count { min-width: 18px; padding: 0 5px; border-radius: 999px; background: #16a34a; color: #fff; font-size: 0.7rem; line-height: 18px; text-align: center; }
.pmj-legacy #rankPrivileges .bms-rank-skeleton { height: 96px; border-radius: 16px; background: linear-gradient(90deg, rgba(99, 102, 241, 0.08), rgba(99, 102, 241, 0.16), rgba(99, 102, 241, 0.08)); background-size: 200% 100%; animation: bms-rank-shimmer 1.2s linear infinite; }
@keyframes bms-rank-shimmer { from { background-position: 200% 0; } to { background-position: -200% 0; } }

/* โมดัลคูปอง (/redeem) — ป้ายโค้ด + เนื้อหารายละเอียด */
.pmj-legacy .bms-coupon-code { display: inline-flex; align-items: center; gap: 6px; margin: 4px 0 12px; padding: 4px 14px; border-radius: 999px; background: rgba(99, 102, 241, 0.1); color: var(--primary-color, #6366f1); font-weight: 700; letter-spacing: 0.06em; }
.pmj-legacy .bms-coupon-desc { font-size: 0.95rem; line-height: 1.6; color: #374151; word-break: break-word; }
.pmj-legacy .bms-coupon-desc img { max-width: 100%; height: auto; border-radius: 12px; }
.pmj-legacy .bms-coupon-desc p { margin: 0 0 0.5rem; }