/*
 * ระบบตัวอักษรของเว็บ — โหลดเป็นไฟล์สุดท้าย ทับ CSS ชุดเดิม (lobby/style.css) โดยไม่แก้ไฟล์เดิม
 *
 * ฟอนต์: Anuphan (Cadson Demak) ตัวเดียวทั้งเว็บ — ไทยไม่มีหัว ทำมาสำหรับหน้าจอ
 * เลือกจากเทียบ 4 แนวบนหน้าเว็บจริง (Prompt เดิม / Chonburi+Anuphan / Anuphan / Noto Serif+Looped)
 * เหตุผล: เรียบ หนักแน่น แบบแอปธนาคารยุคใหม่ ไม่ซ้ำ Kanit/Prompt ที่เว็บในตลาดใช้กันแทบทุกเว็บ
 * แคบกว่า Prompt นิดหน่อย ย่อหน้าเดียวกันสั้นลงหนึ่งบรรทัดบนมือถือ
 * ลำดับชั้นมาจากขนาด + น้ำหนักอย่างเดียว ไม่พึ่งฟอนต์ที่สอง
 *
 * ของเดิมตั้งฟอนต์ Prompt น้ำหนัก 200 ทั้งเว็บ (body) และ 100–300 อีกเกือบ 30 จุด
 * บวกตัวเทาเล็ก 12–14px บนพื้นสีเข้ม — บนมือถืออ่านแทบไม่ออก (ดู PRODUCT.md: Anti-references)
 *
 * ระบบตัวอักษร (อัตราส่วน ~1.25)
 *   --text-xs    13px  ป้ายเล็ก หมายเหตุ
 *   --text-sm    15px  ข้อความรอง รายละเอียดใต้หัวข้อ
 *   --text-base  16px  เนื้อหา
 *   --text-lg    20px  หัวข้อย่อย
 *   --text-xl    28–40px หัวข้อหลัก (ยืดตามจอ)
 *
 * น้ำหนัก: เนื้อหา 400 · ป้าย/ปุ่ม 500 · หัวข้อย่อย/ตัวเลข 600 · หัวข้อหลัก 700
 *
 * สีตัวอักษรอิงสีตัวอักษรของธีม (--color-text) ทุกธีมพื้นเข้มตัวอ่อน
 * ข้อความรองใช้ความโปร่งของสีเดียวกัน ไม่ใช้เทา — เทาบนพื้นสีดูซีด (WCAG AA ≥ 4.5:1)
 */

:root {
    /* Noto Sans Thai: ไทยไม่มีหัวเหมือนกัน ถ้าโหลด Anuphan ไม่ได้ หน้าตาไม่กระโดดมาก */
    --font-sans: 'Anuphan', 'Noto Sans Thai', 'Leelawadee UI', 'Thonburi', system-ui, sans-serif;

    --text-xs: 0.8125rem;
    --text-sm: 0.9375rem;
    --text-base: 1rem;
    --text-lg: 1.25rem;
    --text-xl: clamp(1.75rem, 1.2rem + 2.4vw, 2.5rem);

    --ink: var(--color-text, #ffffff);
    --ink-soft: color-mix(in srgb, var(--color-text, #ffffff) 86%, transparent);
    --ink-muted: color-mix(in srgb, var(--color-text, #ffffff) 74%, transparent);
}

/* ── พื้นฐานทั้งเว็บ ─────────────────────────────────────────── */

body {
    font-family: var(--font-sans);
    font-weight: 400;
    line-height: 1.6;
    /* ตัวอ่อนบนพื้นเข้มดูบางกว่าจริง — เปิดช่องไฟนิดหน่อยชดเชย */
    letter-spacing: 0.01em;
    font-kerning: normal;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
}

/* ช่องกรอกและปุ่มไม่รับฟอนต์จาก body เองโดยค่าตั้งต้นของเบราว์เซอร์ */
button,
input,
select,
textarea {
    font-family: inherit;
}

h1, h2, h3 {
    text-wrap: balance;
    font-weight: 700;
    line-height: 1.25;
    /* หัวข้อใหญ่ของ Anuphan ชิดกันพอดีกว่าเมื่อบีบช่องไฟลงเล็กน้อย */
    letter-spacing: -0.005em;
}

/* ตัวเลขเงินเรียงตรงหลักกันทุกที่ */
.money,
[class*="balance"],
[class*="amount"] {
    font-variant-numeric: tabular-nums;
}

p {
    text-wrap: pretty;
}

/* ── จุดที่ของเดิมตั้งบาง 100–300 ─────────────────────────────── */

/* ข้อความ / ช่องกรอก → 400 */
.inputstyle,
.inputmain,
.boxpsl input,
.inbgbeforelogin select,
.inbgbeforelogin label,
.inboxmain,
.commentbox,
.containerhis,
.modalspanbox,
.wantregister,
.iningriddps,
.iningriddps span,
footer .copyright,
.leftdps .nav-pills .nav-link {
    font-weight: 400;
}

.inbgbeforelogin input::placeholder,
.inputstyle::placeholder,
.inputmain::placeholder {
    font-weight: 400;
    color: var(--ink-muted);
    opacity: 1;
}

/* หัวข้อ ปุ่ม ตัวเลขเงิน → 600 */
.headerbt,
.headerpage h1,
.-selected h5,
.moneyBtn,
.iningriddps button,
.telheader,
.badge {
    font-weight: 600;
}

.-balance-container .-user-balance #customer-balance {
    font-weight: 600;
    font-variant-numeric: tabular-nums;
}

.leftdps .nav-pills .nav-link.active {
    font-weight: 600;
}

/* ท้ายเว็บ — ตัวเล็กสุดของเว็บ ยังต้องอ่านออก */
footer .copyright {
    font-size: var(--text-xs);
    color: var(--ink-muted);
}
