/* =============================================================================
   bootstrap-map.css — LỚP ÁNH XẠ (không phải nguồn thiết kế gốc)
   =============================================================================
   51 View Index/Create/Edit/Delete kế thừa từ bản _9 dùng sẵn class Bootstrap
   (table-striped, btn-danger, btn-xs, panel, form-control, dropdown-menu...).
   File này CHỈ ánh xạ các tên class đó sang đúng biến màu/khoảng cách đã định
   nghĩa trong wayfare-core.css (load TRƯỚC file này) — để các View cũ tự động
   thừa hưởng giao diện đúng bản gốc mà không cần sửa tay từng file.

   Đây KHÔNG phải nguồn chuẩn — không định nghĩa lại :root hay bất kỳ class gốc
   nào (topbar/sidebar/kpi-card/table.data/.btn...), tránh trùng lặp với
   wayfare-core.css. Khi Gói 3 re-skin các trang danh sách theo 4 chuẩn UI,
   phần ánh xạ tương ứng ở đây có thể được rút gọn dần.
   ============================================================================= */

/* Bảng Bootstrap (table, table-striped, table-hover) → giống hệt table.data */
.table{ width:100%; border-collapse:collapse; font-size:13.5px; background:var(--surface); border:1px solid var(--border); border-radius:var(--radius); overflow:hidden; }
.table thead th{ text-align:left; padding:12px 16px; font-size:11px; text-transform:uppercase; letter-spacing:0.06em; color:var(--ink-soft); background:var(--surface-alt); font-weight:700; border-bottom:1px solid var(--border); }
.table tbody td{ padding:13px 16px; border-bottom:1px solid var(--border); vertical-align:middle; }
.table tbody tr:last-child td{ border-bottom:none; }
.table-striped tbody tr:nth-of-type(odd){ background:var(--surface); }
.table-hover tbody tr:hover{ background:var(--surface-alt); }

/* Nút Bootstrap (btn-default/btn-danger/btn-xs) → hoà theo bảng màu wayfare-core */
.btn-default{ background:var(--surface-alt); color:var(--ink); border:none; }
.btn-default:hover{ background:#E3E7F1; color:var(--ink); }
.btn-danger{ background:var(--coral); color:#fff; border:none; }
.btn-danger:hover{ background:#d94f3b; color:#fff; }
.btn-link{ background:none; color:var(--blue); padding:9.5px 10px; }
.btn-xs{ padding:4px 9px; font-size:11.5px; border-radius:7px; }

/* Panel Bootstrap (dùng ở vài view cũ trước khi đổi sang .card/.kpi-card) */
.panel{ background:var(--surface); border:1px solid var(--border); border-radius:var(--radius); overflow:hidden; margin-bottom:16px; }
.panel-heading{ padding:12px 16px; font-size:12px; font-weight:700; color:var(--ink-soft); background:var(--surface-alt); text-transform:uppercase; letter-spacing:.04em; }
.panel-body{ padding:16px; }
.panel-primary > .panel-heading{ background:var(--brand); color:#fff; }
.panel-success > .panel-heading{ background:var(--success); color:#fff; }
.panel-info > .panel-heading{ background:var(--blue); color:#fff; }
.panel-warning > .panel-heading{ background:var(--gold); color:#3A2A08; }

/* Form input/select/textarea Bootstrap — bo góc + màu viền đồng bộ hệ thống */
.form-control, input[type=text], input[type=password], input[type=date], input[type=number], select, textarea{
  border:1px solid var(--border); border-radius:9px; padding:9px 12px; font-size:13.5px;
  font-family:'Be Vietnam Pro',sans-serif; color:var(--ink); width:100%; background:#fff;
}
.form-control:focus, select:focus, textarea:focus, input:focus{ outline:none; border-color:var(--brand); }
label{ font-size:12.5px; font-weight:600; color:var(--ink-soft); margin-bottom:4px; display:inline-block; }

/* Alert Bootstrap (alert-success/alert-danger dùng cho TempData) */
.alert{ padding:11px 16px; border-radius:10px; font-size:13px; font-weight:600; margin-bottom:16px; }
.alert-success{ background:var(--success-soft); color:var(--success); }
.alert-danger{ background:var(--coral-soft); color:var(--coral); }
.alert-warning{ background:var(--gold-soft); color:#9C6A11; }
.alert-info{ background:var(--blue-soft); color:var(--blue); }

.dl-horizontal dt{ color:var(--ink-soft); font-size:12.5px; font-weight:600; float:left; width:180px; clear:left; padding:6px 0; }
.dl-horizontal dd{ margin-left:190px; padding:6px 0; font-size:13.5px; border-bottom:1px dashed var(--border); }
.text-danger{ color:var(--coral) !important; font-size:13px; }
.text-muted{ color:var(--ink-faint) !important; }
.field-validation-error{ color:var(--coral); font-size:12px; display:block; margin-top:3px; }
.input-validation-error{ border-color:var(--coral) !important; }

.dropdown-menu{ background:var(--surface); border:1px solid var(--border); border-radius:10px; box-shadow:var(--shadow); padding:6px; }
.dropdown-menu > li > a{ display:block; padding:8px 12px; border-radius:7px; font-size:13.5px; color:var(--ink-soft); }
.dropdown-menu > li > a:hover{ background:var(--surface-alt); color:var(--ink); }

/* .badge dùng chung ngoài sidebar (bản gốc chỉ định nghĩa .sb-leaf .badge, phạm vi
   hẹp) — WayfareUi.Badge() helper (Infrastructure/WayfareUi.cs) cần dùng được ở
   mọi nơi trong trang, không chỉ trong sidebar. */
.badge{ display:inline-flex; align-items:center; color:#fff; font-size:10.5px; font-weight:800; padding:2px 8px; border-radius:20px; }

/* Định vị cho các helper mới trong Infrastructure/WayfareUi.cs (Gói 1) — bản gốc
   chỉ định nghĩa .pop cho đúng 1 popover cố định trên topbar (top:52px;right:14px),
   ở đây cần popover mở ngay dưới NÚT BẤM bất kỳ trên trang -> ghi đè vị trí, giữ
   nguyên màu sắc/viền/bóng đổ đã kế thừa từ .pop trong wayfare-core.css. */
.wf-daterange{ position:relative; display:inline-block; }
.wf-daterange-pop{ position:absolute; top:44px; left:0; right:auto; max-height:320px; overflow-y:auto; display:none; }
.wf-daterange-pop.show{ display:block; }
.wf-daterange-pop .pop-menu-item.active{ background:var(--blue-soft); color:var(--brand); font-weight:700; }
.wf-daterange-custom{ padding:12px 15px; border-top:1px solid var(--border); }
.wf-daterange-custom.active{ background:var(--blue-soft); }
.wf-daterange-custom-label{ font-size:11px; font-weight:700; color:var(--ink-soft); text-transform:uppercase; letter-spacing:.03em; margin-bottom:8px; }
.wf-daterange-custom-row{ display:flex; align-items:center; gap:6px; margin-bottom:8px; }
.wf-daterange-custom-row input[type="date"]{ flex:1; min-width:0; border:1px solid var(--border); border-radius:8px; padding:7px 8px; font-size:12px; }
.wf-daterange-custom-row span{ color:var(--ink-faint); font-size:12px; flex-shrink:0; }
.wf-daterange-custom-apply{ width:100%; }
.wf-sortable-th{ display:inline-flex; align-items:center; gap:4px; color:inherit; }
.wf-sortable-th:hover{ color:var(--brand); }
.wf-clear-filters{ white-space:nowrap; }
.toptab-disabled{ position:relative; height:100%; display:flex; align-items:center; padding:0 15px; font-size:14px; font-weight:600; color:var(--ink-faint); cursor:default; opacity:.55; }

/* form-horizontal Bootstrap (dùng trong mọi view Create/Edit kế thừa từ _9) */
.form-horizontal .form-group{ display:flex; flex-wrap:wrap; align-items:flex-start; margin-bottom:14px; gap:0; }
.form-horizontal .control-label{ padding-top:9px; font-weight:600; }
.col-md-2{ width:100%; max-width:220px; }
.col-md-10{ flex:1; min-width:240px; }
.col-md-offset-2{ margin-left:220px; }
@media (max-width:640px){ .col-md-offset-2{ margin-left:0; } }