/* global React, window */
// AI Assistant — ถามคำถาม HR ภาษาธรรมชาติ + รับรายงาน anomaly จาก Claude.
function AIPage() {
  return (
    <div data-screen-label="AI">
      <div style={{ marginBottom: 16 }}>
        <h1 style={{ fontFamily: 'var(--font-display)', fontSize: 22, fontWeight: 700, margin: 0 }}>AI ผู้ช่วย HR / Assistant</h1>
        <div style={{ fontSize: 12.5, color: 'var(--ink-4)', marginTop: 4 }}>ถามภาษาธรรมชาติ · ตรวจจับความผิดปกติ</div>
      </div>

      <div className="gv-card">
        <div className="gv-card-b" style={{ padding: 40, display: 'flex', flexDirection: 'column', alignItems: 'center', gap: 12 }}>
          <div style={{ width: 56, height: 56, borderRadius: '50%', background: 'var(--primary-soft)', color: 'var(--primary-ink)',
            display: 'grid', placeItems: 'center', fontSize: 26 }}>✨</div>
          <div style={{ fontFamily: 'var(--font-display)', fontSize: 17, fontWeight: 700, color: 'var(--ink)' }}>กำลังพัฒนา</div>
          <div style={{ fontSize: 13, color: 'var(--ink-4)', textAlign: 'center', maxWidth: 340 }}>
            หน้านี้ยังไม่เสร็จ — เร็วๆ นี้จะถามข้อมูลการลงเวลา · การลา · เงินเดือน ด้วยภาษาธรรมชาติได้ที่นี่
          </div>
        </div>
      </div>
    </div>
  );
}
window.AIPage = AIPage;