/* ============================================================================
   FORM VALIDATION — สไตล์ของ public/js/form-validation.js (ตัวตรวจฟอร์มมาตรฐานทั้งระบบ)
   โหลดหลังไฟล์ธีมทั้งหมด และเติม "html" นำหน้าเพื่อเพิ่ม specificity ให้ชนะกฎ .form-control:focus ของธีม (ที่ใช้ !important)
   ============================================================================ */

/* ดอกจันสีแดงหลังชื่อ Label ของช่องบังคับ */
.fv-star { color: #dc3545; font-weight: 700; margin-left: 1px; }

/* ช่องที่ไม่ผ่าน: กรอบสีแดง (Input / Select / Textarea / Tom Select / bootstrap-select / Checkbox / Radio) */
html .form-control.fv-invalid,
html .form-select.fv-invalid,
html input.fv-invalid,
html select.fv-invalid,
html textarea.fv-invalid {
    border-color: #dc3545 !important;
    box-shadow: 0 0 0 .15rem rgba(220, 53, 69, .18) !important;
}
html .form-control.fv-invalid:focus,
html .form-select.fv-invalid:focus,
html input.fv-invalid:focus,
html select.fv-invalid:focus,
html textarea.fv-invalid:focus {
    border-color: #dc3545 !important;
    box-shadow: 0 0 0 .22rem rgba(220, 53, 69, .28) !important;
}
html .ts-wrapper.fv-invalid .ts-control,
html .bootstrap-select.fv-invalid > .dropdown-toggle,
html .select2-container.fv-invalid .select2-selection {
    border-color: #dc3545 !important;
    box-shadow: 0 0 0 .15rem rgba(220, 53, 69, .18) !important;
}
html .form-check-input.fv-invalid { border-color: #dc3545 !important; box-shadow: 0 0 0 .12rem rgba(220, 53, 69, .2) !important; }
html .form-check-input.fv-invalid ~ .form-check-label { color: #dc3545; }

/* ข้อความเตือนสีแดงใต้ช่อง */
.fv-error {
    display: flex;
    align-items: flex-start;
    gap: .35rem;
    margin-top: .3rem;
    color: #dc3545;
    font-size: .8125rem;
    line-height: 1.35;
    font-weight: 500;
}
.fv-error i { margin-top: .12rem; flex-shrink: 0; }
/* ในตารางรายการ (ช่องแคบ) ให้ข้อความตัดบรรทัดได้ ไม่ดันคอลัมน์ให้กว้างขึ้น */
td .fv-error, .table .fv-error { font-size: .75rem; white-space: normal; overflow-wrap: anywhere; }

/* ข้อความสรุปบนฟอร์ม */
.fv-summary {
    margin-bottom: 1rem;
    padding: .65rem .9rem;
    border: 1px solid #f1aeb5;
    border-radius: .6rem;
    background: #f8d7da;
    color: #842029;
    font-size: .9rem;
    font-weight: 600;
}
.fv-summary:focus { outline: none; }

[data-theme="dark"] .fv-summary { background: rgba(220, 53, 69, .16); border-color: rgba(220, 53, 69, .45); color: #f1aeb5; }
[data-theme="dark"] .fv-error { color: #ff8b96; }
[data-theme="dark"] .fv-star { color: #ff6b78; }

/* ============================================================================
   PLACEHOLDER (คำแนะนำในช่องกรอก) — สีเทาอ่อน แยกจากข้อมูลจริงที่ผู้ใช้กรอก (ข้อความจริงเป็นสีเข้ม)
   ข้อความมาจากหน้าเอง หรือจาก public/js/field-hints.js ที่ใส่ให้ทุกช่องที่ยังไม่มี
   ============================================================================ */
html input::placeholder,
html textarea::placeholder,
html .form-control::placeholder,
html .ts-control input::placeholder {
    color: #9ca3af !important;
    opacity: 1 !important;
    font-weight: 400;
    font-style: normal;
}
[data-theme="dark"] input::placeholder,
[data-theme="dark"] textarea::placeholder,
[data-theme="dark"] .form-control::placeholder,
[data-theme="dark"] .ts-control input::placeholder {
    color: #7b8797 !important;
}
