/* ==========================================================================
   admin.css — ธีมมืดสำหรับหน้าจัดการหลังบ้าน (admin.php)
   ลิงก์เป็นสไตล์ชีต "สุดท้าย" เสมอ (ต่อจาก dark-theme.css)
   ========================================================================== */
html body.admin-body {
  background: #080d14 !important;
  color: #e8e2d6 !important;
}

.admin-wrap { max-width: 1240px; margin: 0 auto; padding: 28px 20px 72px; }

/* ---------- แถบด้านบน ---------- */
.admin-bar {
  display: flex; align-items: center; justify-content: space-between; gap: 16px;
  flex-wrap: wrap; padding: 14px 18px; margin-bottom: 24px;
  border: 1px solid #3d3320; border-radius: 4px;
  background: linear-gradient(180deg, #141b24, #0c1219);
  box-shadow: 0 10px 30px rgba(0, 0, 0, .45), inset 0 1px 0 rgba(255, 243, 214, .06);
}
html body .admin-bar .admin-who { font-size: 13px; color: #cbb994 !important; letter-spacing: .4px; }
html body .admin-bar strong { color: #f5e3b8 !important; }
.admin-bar .admin-bar-actions { display: flex; align-items: center; gap: 12px; }

/* ---------- หัวข้อ ---------- */
.admin-head { margin: 0 0 22px; }
html body .admin-head .eyebrow {
  display: block; font-size: 11px; letter-spacing: 3px; text-transform: uppercase;
  color: #9a8452 !important; margin-bottom: 8px;
}
html body .admin-head h1 {
  margin: 0 0 6px; font-family: Cinzel, serif; font-weight: 700;
  font-size: 34px; line-height: 1.15; color: #f3e2bb !important;
  text-shadow: 0 0 26px rgba(226, 190, 118, .28);
}
html body .admin-head p { margin: 0; font-size: 14px; color: #a99c85 !important; }

/* ---------- การ์ดสรุป ---------- */
.admin-summary { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; margin-bottom: 24px; }
.admin-chip {
  padding: 16px 18px; border: 1px solid #3d3320; border-radius: 4px;
  background: linear-gradient(180deg, #131a23, #0b1017);
  box-shadow: inset 0 1px 0 rgba(255, 243, 214, .05), 0 8px 22px rgba(0, 0, 0, .4);
}
html body .admin-chip small {
  display: block; font-size: 11px; letter-spacing: 2px; text-transform: uppercase;
  color: #9a8452 !important; margin-bottom: 8px;
}
html body .admin-chip b {
  display: block; font-family: Cinzel, serif; font-size: 30px; line-height: 1;
  color: #e9c579 !important; text-shadow: 0 0 22px rgba(226, 190, 118, .3);
}
html body .admin-chip.is-warn b { color: #ffb27a !important; }
@media (max-width: 900px) { .admin-summary { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 480px) { .admin-summary { grid-template-columns: 1fr; } }

/* ---------- แท็บกรอง ---------- */
.admin-tabs { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 18px; }
html body .admin-tabs a {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 9px 16px; border: 1px solid #3d3320; border-radius: 3px;
  background: #10161e; color: #c3b593 !important; font-size: 13px; font-weight: 600;
  text-decoration: none;
}
html body .admin-tabs a:hover { color: #f3e2bb !important; border-color: #7a6330; background: #17202b; }
html body .admin-tabs a.is-active {
  color: #1b1305 !important; border-color: #c9a45a;
  background: linear-gradient(180deg, #e8cf95, #c9a45a);
  box-shadow: 0 0 18px rgba(201, 164, 90, .28);
}
html body .admin-tabs a .n {
  font-size: 11px; padding: 1px 7px; border-radius: 999px;
  background: #23303c; color: #cbb994 !important;
}
html body .admin-tabs a.is-active .n { background: #2a1c06; color: #f0d9a4 !important; }

/* ---------- ตาราง ---------- */
.admin-table-wrap {
  border: 1px solid #3d3320; border-radius: 4px; overflow: hidden;
  background: #0c1219; box-shadow: 0 14px 40px rgba(0, 0, 0, .5);
}
.admin-scroll { overflow-x: auto; }
html body .admin-table { width: 100%; border-collapse: collapse; min-width: 940px; }
html body .admin-table thead th {
  padding: 12px 14px; text-align: left; white-space: nowrap;
  font-size: 11px; letter-spacing: 1.6px; text-transform: uppercase;
  color: #9a8452 !important; background: #121a23; border-bottom: 1px solid #3d3320;
}
html body .admin-table tbody td {
  padding: 12px 14px; font-size: 13px; color: #ddd4c2 !important;
  border-bottom: 1px solid #222c37; vertical-align: middle;
}
html body .admin-table tbody tr:last-child td { border-bottom: 0; }
html body .admin-table tbody tr:hover { background: #101920; }
html body .admin-table .col-id { font-family: ui-monospace, Consolas, monospace; font-size: 12px; color: #b9d7f0 !important; }
html body .admin-table .col-acct { font-weight: 700; color: #f3e2bb !important; }
html body .admin-table .col-wc { font-family: Cinzel, serif; font-weight: 700; color: #e9c579 !important; }
html body .admin-table .col-time { font-size: 12px; color: #9fb0bd !important; white-space: nowrap; }
html body .admin-table .col-bal { font-family: Cinzel, serif; color: #8fd0a8 !important; }
html body .admin-table .col-bal.is-missing { color: #e9806b !important; }

.admin-pill {
  display: inline-block; padding: 3px 10px; border-radius: 999px;
  font-size: 11px; font-weight: 700; letter-spacing: .6px; text-transform: uppercase;
  border: 1px solid transparent;
}
html body .admin-pill.p-pending { color: #ffd18a !important; border-color: #8a6a2c; background: #2a2213; }
html body .admin-pill.p-approved { color: #9be6b1 !important; border-color: #2f6b45; background: #12261a; }
html body .admin-pill.p-rejected { color: #ffa79a !important; border-color: #7d3527; background: #2a1411; }

html body .admin-slip-link {
  display: inline-block; padding: 5px 12px; border: 1px solid #4a5b6b; border-radius: 3px;
  background: #16222e; color: #bcd8f2 !important; font-size: 12px; font-weight: 600; text-decoration: none;
}
html body .admin-slip-link:hover { color: #eaf4ff !important; border-color: #6f8fa8; background: #1d2c3a; }

.admin-actions { display: flex; align-items: center; gap: 8px; }
html body .admin-actions input[type="text"] {
  width: 130px; padding: 6px 9px; border: 1px solid #3d3320; border-radius: 3px;
  background: #0e141b; color: #e8e2d6 !important; font-size: 12px;
}
html body .admin-btn {
  padding: 7px 14px; border-radius: 3px; font-size: 12px; font-weight: 700;
  cursor: pointer; border: 1px solid transparent; white-space: nowrap;
}
html body .admin-btn.ok { color: #0f2417 !important; border-color: #59b37c; background: linear-gradient(180deg, #a8e9c1, #59b37c); }
html body .admin-btn.ok:hover { filter: brightness(1.12); }
html body .admin-btn.no { color: #ffd9d2 !important; border-color: #7d3527; background: #2a1411; }
html body .admin-btn.no:hover { background: #3a1a16; }

html body .admin-empty { padding: 42px 20px; text-align: center; font-size: 14px; color: #8d8271 !important; }

/* ---------- แจ้งเตือน ---------- */
html body .admin-notice {
  margin: 0 0 18px; padding: 12px 16px; border-radius: 4px; font-size: 14px;
  border: 1px solid #2f6b45; background: #12261a; color: #b6f0c8 !important;
}
html body .admin-notice.is-err {
  border-color: #7d3527; background: #2a1411; color: #ffc7bd !important;
}
html body .admin-dbwarn {
  margin: 0 0 18px; padding: 10px 14px; border-radius: 4px; font-size: 13px;
  border: 1px solid #8a6a2c; background: #2a2213; color: #ffd18a !important;
}

/* ---------- ล็อกอิน ---------- */
.admin-login { max-width: 420px; margin: 8vh auto 0; padding: 34px 30px;
  border: 1px solid #3d3320; border-radius: 6px;
  background: linear-gradient(180deg, #141b24, #0b1017);
  box-shadow: 0 24px 60px rgba(0, 0, 0, .6), inset 0 1px 0 rgba(255, 243, 214, .06); }
html body .admin-login h1 { margin: 0 0 4px; font-family: Cinzel, serif; font-size: 26px; color: #f3e2bb !important; }
html body .admin-login .sub { margin: 0 0 22px; font-size: 13px; color: #a99c85 !important; }
html body .admin-login label { display: block; margin: 0 0 6px; font-size: 12px; letter-spacing: 1px; text-transform: uppercase; color: #9a8452 !important; }
html body .admin-login input[type="text"],
html body .admin-login input[type="password"] {
  width: 100%; padding: 11px 13px; margin-bottom: 16px;
  border: 1px solid #3d3320; border-radius: 3px;
  background: #0e141b; color: #e8e2d6 !important; font-size: 14px; box-sizing: border-box;
}
html body .admin-login input:focus { outline: 2px solid #c9a45a; outline-offset: 1px; }
html body .admin-login .admin-btn.go { width: 100%; padding: 12px; font-size: 14px; }

.admin-foot { margin-top: 26px; font-size: 12px; color: #6f6555 !important; text-align: center; }