/* ============================================================ app-theme.css — แหล่งสไตล์ตัวอักษร/ธีมกลาง (แก้ที่เดียว มีผลทุกหน้า) ปรับค่าตัวแปรที่ :root ด้านล่างเพื่อเปลี่ยนทั้งระบบ โหลดหลัง Tailwind (app.css) เสมอ จึง override ได้ ============================================================ */ :root { /* ── ฟอนต์ ── */ --font-base: 'Kanit', sans-serif; /* ── น้ำหนักตัวอักษร ── */ --fw-normal: 400; /* ตัวปกติ */ --fw-medium: 500; /* ตัวเน้นเบา */ --fw-strong: 400; /* แทน bold/semibold — ไม่ใช้ตัวหนาเลย (ตัวปกติ) เปลี่ยนเป็น 500 ถ้าอยากได้มีเดียม */ /* ── สีธีม ── */ --color-theme: #ffb600; /* สีธีม: พื้นหลัง/ปุ่ม */ --color-theme-hover: #e6a300; /* สีธีมตอน hover */ --color-on-theme: #000000; /* ตัวอักษร/ไอคอนบนพื้นธีม */ /* ── สีเน้น ── */ --color-emphasis: #dc2626; /* ตัวเลขเน้นแบบไม่มีพื้น (แดง) */ } body { font-family: var(--font-base); } /* ── ธีมสี: พื้นหลัง/ปุ่มส้ม + ตัวอักษรดำ ── */ .bg-primary { background-color: var(--color-theme) !important; color: var(--color-on-theme) !important; } .bg-primary svg { color: var(--color-on-theme) !important; } .hover\:bg-primary:hover, .hover\:bg-primary\/90:hover, .hover\:bg-primary\/80:hover { background-color: var(--color-theme-hover) !important; } /* ── ไม่ใช้ตัวหนาทั้งระบบ → สูงสุดแค่มีเดียม (คงตัวปกติ 400 ไว้) ── ครอบทั้ง utility class, แท็ก /, และ inline style="font-weight:..." */ .font-bold, .font-extrabold, .font-black, .font-semibold, .font-medium, b, strong, [style*="font-weight:bold"], [style*="font-weight: bold"], [style*="font-weight:600"], [style*="font-weight: 600"], [style*="font-weight:700"], [style*="font-weight: 700"], [style*="font-weight:800"], [style*="font-weight: 800"], [style*="font-weight:900"], [style*="font-weight: 900"] { font-weight: var(--fw-strong) !important; } /* ── ข้อความในปุ่มทุกปุ่ม: ไม่ตัวหนา (ปกติ) ── ใช้ specificity สูงกว่ากฎ .font-bold/.font-semibold (จึงชนะแม้ปุ่มจะมีคลาสน้ำหนัก) button[class] / button [class] = (0,1,1) > .font-semibold (0,1,0) */ button, [type="button"], [type="submit"], [type="reset"], button[class], button [class], [type="submit"][class], [type="button"][class] { font-weight: var(--fw-normal) !important; } /* ── หัวข้อช่องกรอก (label) ทุกช่อง: ไม่ตัวหนา (ปกติ) ── label[class] / label [class] = (0,1,1) ชนะ .font-medium/.font-semibold (0,1,0) */ label, label[class], label [class] { font-weight: var(--fw-normal) !important; } /* ── ยูทิลิตี้ช่วย ── */ .text-emphasis { color: var(--color-emphasis) !important; font-weight: var(--fw-medium) !important; } /* ตัวเลขเน้นแบบไม่มีพื้น */ .bg-theme { background-color: var(--color-theme) !important; color: var(--color-on-theme) !important; } /* ── เอกสารพิมพ์: ใส่ class="theme-print" ที่ → จำกัดทุกน้ำหนัก ≤ มีเดียม ── */ body.theme-print * { font-weight: var(--fw-strong) !important; } /* ── Hover แถวตาราง (ทดลอง): ใช้สีธีม #ffb600 โอพาซิตี้ 0.2 แทนสีเทา f9fafb/f3f4f6 เดิม ครอบเฉพาะ ที่มี class hover:bg-gray-50 (รวม /50 /60 opacity) และ hover:bg-gray-100 — ไม่กระทบปุ่ม/label/dropdown ที่ใช้คลาสเดียวกันในหน้าอื่น ── */ tr.hover\:bg-gray-50:hover, tr.hover\:bg-gray-50\/50:hover, tr.hover\:bg-gray-50\/60:hover, tr.hover\:bg-gray-100:hover { background-color: rgba(255,182,0,0.2) !important; } /* ── ตัวเลือกใน dropdown ( เรนเดอร์โดยระบบปฏิบัติการ/เบราว์เซอร์เอง เบราว์เซอร์ตระกูล Chromium (Chrome/Edge) รองรับสไตล์นี้ แต่บางเบราว์เซอร์/OS อาจไม่แสดงผลตามนี้ 100% ── */ select option:checked, select option:hover { background-color: #ffb600 !important; color: #000 !important; }