/* ปรับ UX หน้าเติมเงิน + ดาวน์โหลด 16 ต.ค. 2026 — โหลดต่อจาก prere-theme.css
   ถอยกลับ = ลบ <link ux-fixes.css> บรรทัดเดียวใน inc/header.php */

/* กล่องแจ้งเตือนสีทองอ่อน ใช้ร่วม: เข้าสู่ระบบก่อนโอน (topup) / เปิดจากมือถือ (download) */
.tp-login-first,
.nl-phone{
  display:flex;align-items:center;justify-content:space-between;gap:16px 24px;flex-wrap:wrap;
  margin:0 0 22px;padding:18px 22px;
  background:#fbf3e1;border:1px solid #e3cfa4;border-radius:var(--radius,14px);
  color:var(--ink,#20374a)
}
.tp-login-first b,
.nl-phone b{display:block;font-size:17px;font-weight:600;line-height:1.4;color:var(--plum,#183447)}
.tp-login-first p,
.nl-phone p{margin:4px 0 0;font-size:15px;line-height:1.6;color:var(--text-dim,#526779);max-width:60ch}
.tp-login-actions,
.nl-phone-actions{display:flex;gap:10px;flex-wrap:wrap}
.tp-login-actions .btn,
.nl-phone-actions .btn{min-height:44px;display:inline-flex;align-items:center;justify-content:center;padding-inline:20px}

/* ข้อควรรู้ก่อนโอน — อยู่ใต้ QR ในขั้นที่ 2 */
.tp-before{margin:16px 0 0;padding-left:20px;font-size:14.5px;line-height:1.65;color:var(--text-dim,#526779)}
.tp-before li{margin-bottom:4px}
.tp-before li::marker{color:var(--gold,#805618)}
.tp-before b{color:var(--ink,#20374a)}

/* หมายเหตุ Google Drive ใต้ปุ่มโหลด Full Client */
.nl-drive-note{display:flex;gap:8px;align-items:flex-start;margin:14px 0 0;font-size:14px;line-height:1.6;color:var(--text-dim,#526779)}
.nl-drive-note svg{flex:0 0 auto;width:18px;height:18px;margin-top:3px;color:var(--gold,#805618)}
.nl-drive-note q{quotes:"“" "”"}

/* กล่องมือถือโชว์เฉพาะจอเล็ก (ไม่ใช้ pointer:coarse เพราะโน้ตบุ๊กจอสัมผัสจะโดนด้วย) */
.nl-phone{display:none;margin-top:28px}
@media (max-width:760px){
  .nl-phone{display:flex}
}
@media (max-width:560px){
  .tp-login-first,.nl-phone{padding:16px 18px}
  .tp-login-actions,.nl-phone-actions{width:100%}
  .tp-login-actions .btn,.nl-phone-actions .btn{flex:1 1 0}
}
