/* ==========================================================================
   Fantastic Overseas — অ্যাডমিন প্যানেলের স্টাইল
   ========================================================================== */
.admin-body { background: #f1f4f9; margin: 0; }

/* ---------- লগইন ---------- */
.login-wrap { min-height: 100vh; display: grid; place-items: center; padding: 24px;
  background: linear-gradient(135deg, #0f172a 0%, #1b2a4a 55%, #0f172a 100%); }
.login-card { background: #fff; border-radius: 18px; padding: 30px 28px; width: 100%; max-width: 400px;
  box-shadow: 0 24px 60px rgba(0,0,0,.35); }

/* ---------- হেডার ---------- */
.admin-head { background: #0f172a; position: sticky; top: 0; z-index: 40; box-shadow: 0 6px 22px rgba(0,0,0,.18); }
.admin-head-in { max-width: 1200px; margin: 0 auto; padding: 12px 20px; display: flex; align-items: center; gap: 14px; flex-wrap: wrap; }
.admin-head .logo-lockup .wm .l1 { color: #fff; }
.admin-head .logo-lockup .wm .l2 { color: #f59e0b; }
.admin-head .logo-pin { color: #f59e0b; width: 30px; height: 30px; }
.role-pill { background: #1e293b; color: #cfd8ea; border-radius: 999px; padding: 4px 12px; font-size: .78rem; font-weight: 600; }
.admin-head-actions { margin-left: auto; display: flex; gap: 8px; }
.admin-head-actions .btn-line { border-color: #35415e; color: #dbe2f2; background: transparent; }
.admin-head-actions .btn-line:hover { background: #1e293b; color: #fff; }

.admin-tabs { max-width: 1200px; margin: 0 auto; padding: 0 20px 10px; display: flex; gap: 6px; overflow-x: auto; }
.admin-tabs button {
  background: transparent; border: 0; color: #9fb0d0; font-family: inherit; font-size: .86rem; font-weight: 600;
  padding: 9px 14px; border-radius: 9px; cursor: pointer; white-space: nowrap;
}
.admin-tabs button:hover { background: #1a2540; color: #fff; }
.admin-tabs button.on { background: #2563eb; color: #fff; }

/* ---------- মূল অংশ ---------- */
.admin-main { max-width: 1200px; margin: 0 auto; padding: 22px 20px 70px; }
.panel { background: #fff; border: 1px solid #e2e8f2; border-radius: 14px; padding: 20px; margin-bottom: 18px; }
.panel h2 { font-size: 1.22rem; margin: 0 0 4px; }
.panel h3 { font-size: 1.02rem; margin: 0 0 10px; }
.panel-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 14px; flex-wrap: wrap; margin-bottom: 14px; }
.filters { display: flex; gap: 8px; flex-wrap: wrap; }
.filters input, .filters select { padding: 8px 12px; border: 1px solid #d8e0ee; border-radius: 9px; font-family: inherit; font-size: .86rem; }

.stat-cards { display: grid; grid-template-columns: repeat(5, 1fr); gap: 14px; margin-bottom: 18px; }
.sc { background: #fff; border: 1px solid #e2e8f2; border-radius: 14px; padding: 18px; }
.sc .n { font-family: "Playfair Display", serif; font-size: 1.9rem; font-weight: 700; color: #0f172a; line-height: 1; }
.sc .l { font-size: .82rem; color: #5c6b8a; margin-top: 6px; }
.sc.hot { background: linear-gradient(135deg, #0f172a, #1d2b4b); border-color: #0f172a; }
.sc.hot .n, .sc.hot .l { color: #fff; }
.sc.gold { background: linear-gradient(135deg, #f59e0b, #d97706); border-color: #d97706; }
.sc.gold .n, .sc.gold .l { color: #fff; }

/* ---------- টেবিল ---------- */
.table-wrap { overflow-x: auto; }
.admin-table { width: 100%; border-collapse: collapse; font-size: .87rem; }
.admin-table th { text-align: left; padding: 11px 10px; color: #5c6b8a; font-size: .78rem; text-transform: uppercase; letter-spacing: .04em; border-bottom: 2px solid #e8eef8; white-space: nowrap; }
.admin-table td { padding: 11px 10px; border-bottom: 1px solid #f0f4fa; vertical-align: middle; }
.admin-table tr:hover td { background: #f8fafd; }
.badge { display: inline-block; border-radius: 999px; padding: 3px 10px; font-size: .75rem; font-weight: 700; }
.badge.new { background: #fef3c7; color: #92400e; }
.badge.screening { background: #e0e7ff; color: #3730a3; }
.badge.medical { background: #dbeafe; color: #1e40af; }
.badge.visa { background: #ede9fe; color: #5b21b6; }
.badge.flight { background: #cffafe; color: #155e75; }
.badge.deployed { background: #d1fae5; color: #065f46; }
.badge.rejected { background: #fee2e2; color: #991b1b; }
.badge.on { background: #d1fae5; color: #065f46; }
.badge.off { background: #f1f5f9; color: #64748b; }

/* ---------- লিস্ট (CRUD কার্ড) ---------- */
.admin-list { display: grid; grid-template-columns: repeat(2, 1fr); gap: 14px; }
.row-card { display: flex; gap: 12px; align-items: flex-start; background: #fff; border: 1px solid #e2e8f2; border-radius: 12px; padding: 12px; }
.row-card img { width: 76px; height: 60px; object-fit: cover; border-radius: 9px; flex: 0 0 auto; background: #eef2f8; }
.row-card .rc-body { flex: 1; min-width: 0; }
.row-card .rc-body strong { display: block; font-size: .95rem; }
.row-card .rc-body small { color: #6b7a99; font-size: .8rem; display: block; margin-top: 2px; }
.row-card .rc-acts { display: flex; gap: 6px; flex: 0 0 auto; }
.icon-btn { border: 1px solid #dde5f0; background: #fff; border-radius: 8px; width: 34px; height: 34px; cursor: pointer; font-size: .95rem; }
.icon-btn:hover { background: #f1f5fb; border-color: #c3d0e6; }
.icon-btn.danger:hover { background: #fee2e2; border-color: #fca5a5; }

/* ---------- মডাল ---------- */
.modal-bg { position: fixed; inset: 0; background: rgba(15,23,42,.55); display: grid; place-items: center; padding: 18px; z-index: 90; }
/* গুরুত্বপূর্ণ: উপরের display:grid থাকায় HTML-এর hidden অ্যাট্রিবিউট কাজ করে না — স্পষ্টভাবে বন্ধ করতে হবে */
.modal-bg[hidden] { display: none !important; }
.modal { background: #fff; border-radius: 16px; width: 100%; max-width: 620px; max-height: 92vh; overflow: auto; box-shadow: 0 30px 70px rgba(0,0,0,.35); }
.modal-head { display: flex; align-items: center; justify-content: space-between; padding: 18px 20px; border-bottom: 1px solid #eef2f8; position: sticky; top: 0; background: #fff; }
.modal-head h3 { margin: 0; }
.modal-x { border: 0; background: #f1f5fb; border-radius: 9px; width: 34px; height: 34px; cursor: pointer; font-size: 1rem; }
.modal-fields { padding: 18px 20px; }
.modal-foot { display: flex; justify-content: flex-end; gap: 10px; padding: 14px 20px 20px; }

/* ---------- ফিল্ড ---------- */
.ff { margin-bottom: 14px; }
.ff label { display: block; font-size: .83rem; font-weight: 600; color: #33415c; margin-bottom: 5px; }
.ff input, .ff textarea, .ff select {
  width: 100%; padding: 10px 12px; border: 1px solid #d8e0ee; border-radius: 10px;
  font-family: inherit; font-size: .9rem; background: #fff;
}
.ff textarea { min-height: 92px; resize: vertical; }
.ff .hint, .ff small { display: block; color: #7d8aa6; font-size: .76rem; margin-top: 4px; }
.ff-row { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.ff-img { display: flex; gap: 12px; align-items: center; }
.ff-img img { width: 110px; height: 82px; object-fit: cover; border-radius: 10px; border: 1px solid #e2e8f2; background: #eef2f8; }

.settings-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.mini-list { font-size: .88rem; }
.mini-row { display: flex; justify-content: space-between; gap: 12px; padding: 9px 0; border-bottom: 1px solid #f0f4fa; }
.mini-row:last-child { border-bottom: 0; }
.empty { color: #8b98b5; font-size: .88rem; padding: 14px 0; }

@media (max-width: 900px) {
  .stat-cards { grid-template-columns: repeat(2, 1fr); }
  .admin-list, .settings-grid, .ff-row { grid-template-columns: 1fr; }
}