/* brand.css — หน้า login ของ ERPNext ให้เป็นแบรนด์เดียวกับระบบของเรา (RepairHub)
 *
 * ทำไมต้องมีไฟล์นี้: Frappe วาดหน้า login เอง (frappe/www/login.html + login.bundle.css)
 * และ **ฝังสีเป็นค่าคงที่ใน CSS** (#171717 ของปุ่ม · พื้นหลังเทา · ลิงก์ดำ) ⇒ ไม่มีหน้าจอตั้งค่าไหน
 * เปลี่ยนสีพวกนี้ได้ · ไฟล์นี้ถูกโหลดทุกหน้าเว็บผ่าน hook `web_include_css` (ดู hooks.py)
 * จึงครอบทั้งหน้า login และหน้าที่ Frappe สร้างให้เอง (forgot password / signup) ในครั้งเดียว
 *
 * ลำดับการโหลดจริงบน /login: website.bundle.css → [erpnext-web.bundle.css, brand.css] → login.bundle.css
 *   ⇒ CSS ของ Frappe มาทีหลัง · กฎที่ "จำเพาะเท่ากัน" จะแพ้
 *   ⇒ ที่นี่จึงเลือก selector ที่จำเพาะกว่าแทนการใช้ !important (นอกจากกรณีที่ Frappe ใช้เอง — ดูข้อ 2):
 *        :root:not([data-theme="dark"])     = (0,2,0)  ชนะ :root (0,1,0)
 *        html body .btn.btn-primary:hover   = (0,3,2)  ชนะ .btn.btn-primary (0,2,0) และ .btn-primary:hover (0,2,0)
 *   ⇒ และ :not([data-theme="dark"]) ที่กันไว้ ทำให้ธีมมืดของ Frappe ยังทำงานถูก (ค่าของมันไม่ถูกทับ)
 *
 * สีทั้งหมดคัดจาก packages/shared/tokens.ts (ชุด light) — แก้ที่นั่นแล้วต้องมาแก้ที่นี่ให้ตรงกัน
 * ตัวตรวจ: ไม่มีในรีโปนี้ (สีเป็นเรื่องภาพ ไม่ใช่สัญญาข้อมูล) — ตรวจด้วยตา/ภาพหน้าจอตอนติดตั้ง
 *
 * บทเรียนจริงตอนติดตั้ง (14 ต.ค. 2026): ปุ่มทึบใน Frappe v15 ถูกทาด้วย **สองชั้น**
 *   · `.btn-primary{background-color:#171717}`            = สีที่ฝังตาย (0,1,0)
 *   · `.btn.btn-primary{background-color:var(--btn-primary)}` = ตัวที่ "ชนะจริง" (0,2,0)
 *   ⇒ การทับแค่ `.btn-primary` ไม่พอ (เส้นขอบเป็นสีแบรนด์ แต่พื้นปุ่มยังดำ) — ต้องตั้ง --btn-primary
 *     และทับ selector ให้จำเพาะกว่า .btn.btn-primary สำหรับสถานะ hover/โฟกัส/กด ที่ Frappe ฝังสีไว้ตรง ๆ
 */

/* 1) โทเคนสีของแบรนด์ — ปุ่มหลัก · ลิงก์/โฟกัส · พื้นหลังหน้า (Frappe ใช้ --bg-light-gray กับ body) */
:root:not([data-theme="dark"]) {
	--primary: #1d4ed8; /* tokens.colors.primary — Frappe ผูก --brand-color กับตัวนี้อยู่แล้ว */
	--btn-primary: #1d4ed8; /* ปุ่มทึบ: Frappe ใช้ตัวนี้ใน .btn.btn-primary (ดูหมายเหตุด้านบน) */
	--bg-light-gray: #eff6ff; /* tokens.colors.primaryLight */
}

/* 2) สถานะของปุ่มหลัก (Login / Reset Password) — Frappe ฝัง #040404/#000 ไว้ตรง ๆ ไม่ผ่านตัวแปร */

/* hover/โฟกัส: ต้อง "เข้มขึ้น" (primaryHover) ไม่ใช่สว่างขึ้น — ขาวบนพื้นปุ่มยังอ่านออก */
html body .btn.btn-primary:hover,
html body .btn.btn-primary:focus,
html body .btn.btn-primary.focus {
	background-color: #1e40af;
	border-color: #1e40af;
}

/* วงโฟกัสสีแบรนด์ แทนวงเทาเดิม (สีเดียวกับ tokens.colors.primary ที่ opacity 25%) */
html body .btn.btn-primary:focus,
html body .btn.btn-primary.focus {
	box-shadow: 0 0 0 0.2rem rgba(29, 78, 216, 0.25);
}

/* จังหวะกด: Frappe ใช้ !important กับ `--invert-neutral` (ดำ) ⇒ ต้องมี !important ด้วย
   และ selector ที่จำเพาะกว่า (0,6,2) จึงชนะ — ถ้าตัด !important ออก บรรทัดนี้จะไม่มีผลเลย */
html body .btn.btn-primary:not(:disabled):not(.disabled):active {
	background-color: #1e40af !important;
	border-color: #1e40af !important;
}

/* 3) การ์ด login + โลโก้: ให้หน้าตาเป็น "การ์ด" แบบเดียวกับเว็บของเรา */
html body .login-content.page-card {
	border-color: #dbeafe; /* tokens.colors.primarySoft */
	border-radius: 14px;
	box-shadow: 0 18px 40px -24px rgba(15, 23, 42, 0.35);
}

/* มาร์กของบริษัท: ค่าเริ่มต้นของ Frappe (42px) เล็กจนหัวข้อเด่นกว่าตัวโลโก้ */
html body .page-card-head img.app-logo {
	max-height: 56px;
}
