<h3 style="font-size: 1.4rem; margin-bottom: 1.5rem;">แบบฟอร์มส่งข้อมูลการติดต่อ</h3>

<!-- Success / Error Alert -->
<div x-show="submitStatus === 'success'" class="form-alert-success" x-text="submitMessage" style="display: none;"></div>
<div x-show="submitStatus === 'error'" class="form-alert-error" x-text="submitMessage" style="display: none;"></div>

<form @submit.prevent="submitForm()" novalidate>
  <div class="form-group">
    <label class="form-label" for="contact-name">ชื่อ-นามสกุล / สถาบันหรือองค์กร *</label>
    <input type="text" id="contact-name" class="form-control" x-model="formData.name" placeholder="เช่น ดร. สมชาย ใจดี หรือ มหาวิทยาลัย...">
    <div class="form-error-msg" x-show="errors.name" x-text="errors.name"></div>
  </div>

  <div class="form-group">
    <label class="form-label" for="contact-email">อีเมลสำหรับติดต่อกลับ *</label>
    <input type="email" id="contact-email" class="form-control" x-model="formData.email" placeholder="example@organization.ac.th">
    <div class="form-error-msg" x-show="errors.email" x-text="errors.email"></div>
  </div>

  <div class="form-group">
    <label class="form-label" for="contact-service">หลักสูตรหรือหัวข้อที่สนใจ</label>
    <select id="contact-service" class="form-control" x-model="formData.service">
      <option value="educational-workshops">เวิร์กช็อปสถาปัตยกรรมเทคโนโลยี Dime เชิงลึก (2 วัน)</option>
      <option value="security-training">การอบรมมาตรฐานความปลอดภัยกระเป๋าเงินและคีย์ (1 วัน)</option>
      <option value="validator-sessions">การสัมมนาเชิงเทคนิคโครงสร้างโหนดผู้ตรวจสอบ (1 วัน)</option>
      <option value="ecosystem-masterclass">มาสเตอร์คลาสการวิเคราะห์ระบบนิเวศและเครื่องมือพัฒนา</option>
      <option value="general-inquiry">สอบถามข้อมูลวิชาการทั่วไป / ข้อมูลวิจัย</option>
    </select>
  </div>

  <div class="form-group">
    <label class="form-label" for="contact-attendees">จำนวนผู้เข้าอบรมโดยประมาณ</label>
    <select id="contact-attendees" class="form-control" x-model="formData.attendees">
      <option value="1-5">รายบุคคล / 1-5 ท่าน</option>
      <option value="10-25">กลุ่มย่อย / 10-25 ท่าน (แนะนำสำหรับเวิร์กช็อป)</option>
      <option value="26-50">กลุ่มใหญ่ / 26-50 ท่าน (การบรรยายพิเศษ)</option>
      <option value="50+">สถาบันการศึกษา / มากกว่า 50 ท่าน</option>
    </select>
  </div>

  <div class="form-group">
    <label class="form-label" for="contact-message">รายละเอียดข้อซักถามหรือช่วงเวลาที่ต้องการจัด *</label>
    <textarea id="contact-message" class="form-control" rows="4" x-model="formData.message" placeholder="ระบุช่วงเดือนที่สะดวก รูปแบบที่ต้องการ (ออนไซต์/ออนไลน์) หรือหัวข้อเฉพาะทางที่ต้องการเน้น..."></textarea>
    <div class="form-error-msg" x-show="errors.message" x-text="errors.message"></div>
  </div>

  <button type="submit" class="btn btn-primary" style="width: 100%;" :disabled="loading">
    <span x-show="!loading">ส่งข้อมูลเพื่อประสานงาน</span>
    <span x-show="loading" style="display: none;">กำลังดำเนินการส่ง...</span>
  </button>

  <p style="font-size: 0.8rem; color: var(--text-muted); margin-top: 1rem; text-align: center;">
    การส่งแบบฟอร์มนี้เป็นไปตาม <a href="/privacy/" style="color: var(--sol-cyan); text-decoration: underline;">นโยบายความเป็นส่วนตัว</a> และข้อมูลจะไม่ถูกนำไปใช้ในเชิงพาณิชย์
  </p>
</form>
ศูนย์ประสานงานหลัก

ข้อมูลที่อยู่และช่องทางติดต่อ

  <div style="display: flex; flex-direction: column; gap: 1.25rem; font-size: 0.95rem;">
    <div>
      <span style="color: var(--text-muted); font-size: 0.8rem; display: block; margin-bottom: 0.25rem;">สถานที่ตั้งสำนักงาน (Verbatim Address):</span>
      <strong style="color: var(--text-primary); line-height: 1.6;">Office 9, 72 Placeholder Street, Surat Thani 00000</strong>
    </div>

    <div>
      <span style="color: var(--text-muted); font-size: 0.8rem; display: block; margin-bottom: 0.25rem;">หมายเลขโทรศัพท์ติดต่อ (Verbatim Phone):</span>
      <strong style="color: var(--sol-green); font-size: 1.1rem;">+66 77 000 652</strong>
    </div>

    <div>
      <span style="color: var(--text-muted); font-size: 0.8rem; display: block; margin-bottom: 0.25rem;">อีเมลฝ่ายวิชาการ:</span>
      <strong style="color: var(--sol-cyan);">info@insight-trailhub.click</strong>
    </div>

    <div>
      <span style="color: var(--text-muted); font-size: 0.8rem; display: block; margin-bottom: 0.25rem;">เวลาทำการ:</span>
      <span>จันทร์ – ศุกร์: 08:30 – 17:30 น. (หยุดเสาร์-อาทิตย์ และวันหยุดนักขัตฤกษ์)</span>
    </div>

    <div>
      <span style="color: var(--text-muted); font-size: 0.8rem; display: block; margin-bottom: 0.25rem;">ระยะเวลาตอบกลับเฉลี่ย:</span>
      <span>ภายใน 24 - 48 ชั่วโมงทำการ (1-2 วันทำการ)</span>
    </div>
  </div>
</div>

<div class="glass-card" style="padding: 1.5rem; border-color: rgba(153, 69, 255, 0.25);">
  <h4 style="font-size: 1rem; margin-bottom: 0.5rem; color: #D8B4FE;">ข้อปฏิบัติสำหรับการเข้าพบ</h4>
  <p style="font-size: 0.85rem; color: var(--text-secondary); line-height: 1.6;">
    สำหรับการเข้าเยี่ยมชมห้องปฏิบัติการวิจัย หรือการประชุมแบบพบหน้า กรุณานัดหมายล่วงหน้าอย่างน้อย 3 วันทำการ เพื่อให้ทีมวิชาการจัดเตรียมพื้นที่และเอกสารประกอบการประชุม
  </p>
</div>