/* Admin UI — ส่วนเสริมเล็ก ๆ ที่ Tailwind utility ไม่ครอบคลุม
   (Tailwind โหลดจาก CDN ใน base.html — ที่นี่คือ base component + htmx states) */

:root {
  --admin-accent: #059669;
  --admin-border: #e2e8f0;
}

html { -webkit-text-size-adjust: 100%; }

body { font-family: "IBM Plex Sans Thai", "Noto Sans Thai", system-ui, -apple-system, "Segoe UI", sans-serif; }

/* ---------- htmx states ---------- */
.htmx-indicator { display: none; }
.htmx-request .htmx-indicator,
.htmx-request.htmx-indicator { display: inline-block; }

.htmx-request { cursor: progress; }

/* ระหว่างโหลด ให้จางลงเล็กน้อยเพื่อบอกว่ากำลังอัปเดต */
.htmx-swapping { opacity: .5; transition: opacity 120ms ease-out; }
.htmx-settling { opacity: 1; }

#flash, #toast { pointer-events: none; }
#flash > *, #toast > * { pointer-events: auto; }

/* ---------- tables ---------- */
.admin-table { width: 100%; border-collapse: collapse; font-size: .875rem; }
.admin-table thead th {
  text-align: left;
  font-weight: 500;
  font-size: .75rem;
  letter-spacing: .01em;
  color: #64748b;
  background: #f8fafc;
  padding: .5rem .75rem;
  border-bottom: 1px solid var(--admin-border);
  white-space: nowrap;
}
.admin-table tbody td {
  padding: .625rem .75rem;
  border-bottom: 1px solid #f1f5f9;
  vertical-align: middle;
}
.admin-table tbody tr:last-child td { border-bottom: 0; }
.admin-table tbody tr:hover { background: #fafafa; }
.admin-table tfoot td { padding: .5rem .75rem; border-top: 1px solid var(--admin-border); }

/* ---------- badges ---------- */
.badge {
  display: inline-block;
  padding: .125rem .5rem;
  border-radius: 9999px;
  font-size: .6875rem;
  line-height: 1.25rem;
  border: 1px solid transparent;
  white-space: nowrap;
}
.badge-active { background: #ecfdf5; color: #047857; border-color: #a7f3d0; }
.badge-suspended { background: #fff1f2; color: #be123c; border-color: #fecdd3; }
.badge-open { background: #fffbeb; color: #b45309; border-color: #fde68a; }
.badge-neutral { background: #f1f5f9; color: #475569; border-color: #e2e8f0; }
.badge-in { background: #f1f5f9; color: #475569; border-color: #e2e8f0; }
.badge-out { background: #ecfdf5; color: #047857; border-color: #a7f3d0; }

/* ---------- forms ---------- */
input, select, textarea, button { font: inherit; }
input:focus-visible, select:focus-visible, textarea:focus-visible, button:focus-visible {
  outline: 2px solid var(--admin-accent);
  outline-offset: 1px;
}
input:disabled, button:disabled { opacity: .55; cursor: not-allowed; }

input[type="file"] { cursor: pointer; }

/* ---------- toast ---------- */
.toast {
  border-radius: .5rem;
  border: 1px solid var(--admin-border);
  background: #fff;
  box-shadow: 0 8px 24px rgba(15, 23, 42, .12);
  padding: .625rem .875rem;
  font-size: .8125rem;
  animation: toast-in 140ms ease-out;
}
.toast-error { border-color: #fecdd3; background: #fff1f2; color: #9f1239; }
.toast-success { border-color: #a7f3d0; background: #ecfdf5; color: #065f46; }
@keyframes toast-in { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }

/* ---------- misc ---------- */
[data-copy] { cursor: pointer; }

@media print {
  aside, header, footer, #toast { display: none !important; }
  body { background: #fff; }
}