/* 22 ต.ค. 2026 หน้าต่างเก่า 8 อย่าง → ธีมครีม (ผู้ใช้อนุมัติ): รหัสกู้คืน · ผูกบัญชี · เลือกของมาสวม · บัฟกิลด์ · ดันเจี้ยน · ฟาร์ม · เควสเปลี่ยนอาชีพ · ลืมรหัสผ่าน · ขายเหมา
   ครีม #fffaf0→#f3e7cf · ขอบทอง #e3a73a · ตัวหนังสือน้ำตาล #5a3d14 · ปุ่มหลักทอง · ไม่มีอิโมจิ (เอาออกจากซอร์สแล้ว)
   หลายกล่องตั้งสีด้วย style ในแท็ก → ใช้ !important · ข้อความแจ้ง (.msg) สีมาจาก JS → หรี่ด้วย filter ให้อ่านบนพื้นครีม */

/* ── การ์ดร่วม ── */
html.cw3 :is(#rcw .bx, #bindw .bx, #asforgot .bx, #farmDlg, #jqDlg, #bulkw .bk, #eqpick),
html.cw3 #gbuffw > div, html.cw3 #dgpick > div {
  background: linear-gradient(#fffaf0, #f3e7cf) !important; border: 2px solid #e3a73a !important; border-radius: 16px !important;
  box-shadow: 0 0 0 4px #fff6e099, 0 10px 30px #0006 !important; color: #5a3d14 !important; font-family: Mali, sans-serif !important; }
html.cw3 :is(#rcw, #bindw, #asforgot, #bulkw, #gbuffw, #dgpick) { background: rgba(30, 20, 8, .38) !important; }

/* หัวข้อ: น้ำตาลทอง + เส้นทองจางใต้หัว */
html.cw3 :is(#rcw h3, #bindw h3, #asforgot h3, #farmDlg h4, #bulkw h4, #eqpick h5) {
  color: #8a5a12 !important; text-align: center; padding-bottom: 6px; margin-bottom: 8px !important;
  background: linear-gradient(90deg, transparent, #e3a73a, transparent) bottom / 70% 2px no-repeat; }
html.cw3 #gbuffw > div > b:first-child, html.cw3 #dgpick > div > b:first-child {
  display: block; color: #8a5a12 !important; text-align: center; padding-bottom: 6px; margin-bottom: 4px;
  background: linear-gradient(90deg, transparent, #e3a73a, transparent) bottom / 70% 2px no-repeat; }
html.cw3 :is(#rcw p, #bindw p, #asforgot p, #farmDlg .tx, #jqDlg .tt), html.cw3 #gbuffw > div > div:nth-child(2), html.cw3 #dgpick > div > div:nth-child(2) {
  color: #7a6040 !important; opacity: 1 !important; }

/* ช่องกรอก */
html.cw3 :is(#rcw input, #bindw input, #asforgot input) {
  background: #fffdf7 !important; border: 1px solid #e2c9a0 !important; color: #4a2f0c !important; box-shadow: inset 0 1px 2px #8a5a1a1a; }
html.cw3 :is(#rcw input, #bindw input, #asforgot input)::placeholder { color: #b09a78 !important; }
html.cw3 :is(#rcw input, #bindw input, #asforgot input):focus { border-color: #e3a73a !important; outline: 2px solid #ffd86a66; }

/* ปุ่มรอง (ปิด/ยกเลิก) และปุ่มหลัก (.ok) */
html.cw3 :is(#rcw button, #bindw button, #asforgot button, #farmDlg .row button, #jqDlg button, #bulkw .no, #gbuffx, #dgpickx) {
  background: #fff8ea !important; border: 1px solid #e2c27e !important; color: #6b4a1c !important; font-weight: 600 !important; box-shadow: 0 2px 0 #e2c9a0; }
html.cw3 :is(#rcw button.ok, #bindw button.ok, #asforgot button.ok, #farmDlg .row button.ok, #jqDlg button:not(.sub), #bulkw .go) {
  background: linear-gradient(#ffd77a, #e9a93a) !important; border: 1px solid #c98a22 !important; color: #4a2c05 !important; box-shadow: 0 2px 0 #b9781a; }
html.cw3 #jqDlg button.sub { background: #fff8ea !important; border-color: #e2c27e !important; color: #8a7350 !important; }
html.cw3 :is(#rcw, #bindw, #asforgot, #farmDlg, #jqDlg, #bulkw) button:disabled { filter: grayscale(.6) opacity(.6); }
html.cw3 :is(#rcw .msg, #bindw .msg, #asforgot .msg) { filter: brightness(.55) saturate(1.6); font-weight: 600; }

/* 1 รหัสกู้คืน */
html.cw3 #rcw .code { background: #fff8ea !important; border: 2px dashed #e3a73a !important; color: #8a5a12 !important; text-shadow: none !important; }
html.cw3 #rcbtn { background: linear-gradient(#fffaf0, #f3e7cf) !important; border: 1px solid #e3a73a !important; color: #6b4a1c !important; }

/* 2 ผูกบัญชี (กรอบภาพกรมท่าเลิกใช้ ui-v2-win-data.js W.bind.on=0) · ปุ่มกากบาท #bindtx ไม่ต้องใช้ในการ์ดนี้ */
html.cw3 #bindw .bx { width: min(340px, 92vw) !important; padding: 16px 18px !important; }
html.cw3 #bindw #bindtx { display: none !important; }

/* 3 เลือกของมาสวม */
html.cw3 #eqpick { padding: 8px !important; }
html.cw3 #eqpick button { background: #fffdf7 !important; border: 1px solid #ecd9ae !important; color: #4a2f0c !important; }
html.cw3 #eqpick button:hover { border-color: #e3a73a !important; background: #fff6e0 !important; }
html.cw3 #eqpick :is(small, .none) { color: #8a7350 !important; }
html.cw3 #eqpick img { background: #f6ecd8; border-radius: 8px; }

/* 4 บัฟกิลด์ (กล่อง + แถว + ปุ่มในหน้าต่างกิลด์) */
html.cw3 #gbuffw > div { color: #5a3d14 !important; }
html.cw3 #gbuffl > div { background: #fffdf7 !important; border: 1px solid #ecd9ae !important; color: #4a2f0c !important; }
html.cw3 #gbuffl small { filter: brightness(.6) saturate(1.5); font-weight: 600; }
html.cw3 #gbuffl button { box-shadow: 0 2px 0 #b9781a; border: 1px solid #c98a22 !important; }
html.cw3 #gdbuffbtn { background: linear-gradient(#ffd77a, #e9a93a) !important; border: 1px solid #c98a22 !important; color: #4a2c05 !important; text-shadow: none !important; }

/* 5 ดันเจี้ยน: กล่องเลือกระดับ + แถบสถานะบนจอ */
html.cw3 #dgpickl button { background: #fffdf7 !important; border: 1px solid #ecd9ae !important; color: #4a2f0c !important; }
html.cw3 #dgpickl button:disabled { background: #efe6d4 !important; color: #a8957a !important; }
html.cw3 #dgpickl button:not(:disabled):hover { border-color: #e3a73a !important; }
html.cw3 #dgbar { background: linear-gradient(#fffaf0ee, #f3e7cfee) !important; border: 1.5px solid #e3a73a !important; color: #5a3d14 !important; box-shadow: 0 3px 10px #0004; text-shadow: none !important; }

/* 6 ฟาร์ม */
html.cw3 #farmDlg .cr { background: #fffdf7 !important; border: 1px solid #ecd9ae !important; color: #4a2f0c !important; }
html.cw3 #farmDlg .cr:not(:disabled):hover { border-color: #e3a73a !important; background: #fff6e0 !important; }
html.cw3 #farmDlg .cr small { color: #8a7350 !important; opacity: 1 !important; }

/* 7 เควสเปลี่ยนอาชีพ */
html.cw3 #jqDlg .nm { color: #8a5a12 !important; }
html.cw3 #jqDlg .hd img { border: 2px solid #e3a73a !important; background: #f6ecd8 !important; }
html.cw3 #jqDlg .task { background: #fffdf7 !important; border: 1px solid #ecd9ae; color: #4a2f0c !important; }

/* 8 ขายเหมา: จุดสีบอกเกรดแทนอิโมจิวงกลม */
html.cw3 #bulkw label { background: #fffdf7 !important; border: 1px solid #ecd9ae !important; color: #4a2f0c !important; }
html.cw3 #bulkw label.on { border-color: #e3a73a !important; background: #fff6e0 !important; }
html.cw3 #bulkw label i { color: #8a7350 !important; }
html.cw3 #bulkw .kb { background: none !important; border: 0 !important; color: #7a6040 !important; }
html.cw3 #bulkw .sum b { color: #b06a0a !important; font-weight: 700 !important; }
html.cw3 #bulkw .note { color: #8a7350 !important; }
#bulkw .gd { display: inline-block; flex: none; width: 12px; height: 12px; border-radius: 50%; box-shadow: inset 0 -2px 0 #0002, 0 0 0 1.5px #fff; }
#bulkw .gd0 { background: #b8ad98; } #bulkw .gd1 { background: #4fae3a; } #bulkw .gd2 { background: #3a8ad8; }
html.cw3 #rcw .rcwarn { color: #b5541a !important; font-weight: 600; }

/* มือถือแนวนอน (จอเตี้ย): การ์ดไม่ล้นจอ เลื่อนในการ์ดได้ · ช่องกรอก/ปุ่มเตี้ยลง */
@media (max-height: 520px) {
  html.cw3 :is(#rcw .bx, #bindw .bx, #asforgot .bx, #farmDlg, #jqDlg, #bulkw .bk, #eqpick), html.cw3 #gbuffw > div, html.cw3 #dgpick > div {
    max-height: calc(100vh - 16px - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px)) !important; overflow-y: auto !important; box-sizing: border-box !important; padding-top: 10px !important; padding-bottom: 10px !important; }
  html.cw3 :is(#rcw input, #bindw input, #asforgot input) { height: 32px !important; margin-bottom: 6px !important; }
  html.cw3 :is(#rcw p, #bindw p, #asforgot p) { margin-bottom: 6px !important; font-size: 11px !important; }
  html.cw3 :is(#rcw h3, #bindw h3, #asforgot h3, #farmDlg h4, #bulkw h4) { margin-bottom: 5px !important; padding-bottom: 4px; }
  html.cw3 :is(#rcw button, #bindw button, #asforgot button) { height: 32px !important; }
}