/* Fix bootstrap-datetimepicker cho module Cấm tham gia đấu giá:
   - Cột "Sa" tràn/tách phải + nền trắng dưới do CSS table global của portal.
   - table-layout:fixed chia đều 7 cột; reset border/padding/height ô. */
.bootstrap-datetimepicker-widget { width: 280px !important; padding: 6px !important; }
.bootstrap-datetimepicker-widget table { width: 100% !important; table-layout: fixed !important; margin: 0 !important; border-collapse: collapse !important; }
.bootstrap-datetimepicker-widget table td,
.bootstrap-datetimepicker-widget table th { width: auto !important; height: 34px !important; min-width: 0 !important; padding: 0 !important; border: 0 !important; text-align: center !important; vertical-align: middle !important; line-height: 34px !important; box-sizing: border-box !important; }
.bootstrap-datetimepicker-widget table td.day { border-radius: 0 !important; }
.bootstrap-datetimepicker-widget table td span { width: 48px; height: 48px; line-height: 48px; }

/* Hover: các ô header (nav ‹ ›, tiêu đề "Select Month/Year") nằm trên nền xanh
   -> mặc định bootstrap cho nền #eee xám => chữ trắng chìm. Đổi sang sáng-mờ giữ chữ trắng. */
.bootstrap-datetimepicker-widget thead th:hover,
.bootstrap-datetimepicker-widget .picker-switch:hover,
.bootstrap-datetimepicker-widget th.prev:hover,
.bootstrap-datetimepicker-widget th.next:hover { background: rgba(255, 255, 255, .22) !important; color: #fff !important; }
/* Hover ngày trong lịch -> xanh nhạt, chữ đậm dễ đọc */
.bootstrap-datetimepicker-widget td.day:hover,
.bootstrap-datetimepicker-widget td span:hover { background: #dcecf7 !important; color: #013A5D !important; }

/* ============================================================
   Bảng danh sách "Cấm tham gia đấu giá" — DÙNG CHUNG owner/admin/public
   - Cuộn ngang khi nhiều cột / nội dung dài, GHIM cột STT + Thao tác.
   - Badge trạng thái phân biệt loại (Đang hiển thị / Đã gỡ).
   ============================================================ */
.ban-table-scroll { width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }
.ban-table-scroll > table { min-width: 1040px; }
/* ⚠ position:sticky trên td/th bị vô hiệu nếu <table> (hoặc ancestor) có overflow:hidden
   (portal .noti table đặt overflow:hidden). Ép visible để cột ghim STT/Thao tác hoạt động. */
.ban-table-scroll > table, .table-overflow-x-fix > table { overflow: visible !important; }
.ban-table-scroll td.ban-fz-stt, .ban-table-scroll th.ban-fz-stt,
.ban-table-scroll td.ban-fz-act, .ban-table-scroll th.ban-fz-act,
.table-overflow-x-fix td.ban-fz-stt, .table-overflow-x-fix th.ban-fz-stt,
.table-overflow-x-fix td.ban-fz-act, .table-overflow-x-fix th.ban-fz-act { position: -webkit-sticky; position: sticky; }
/* Bảng admin (.table-responsive Bootstrap chỉ cuộn <768px) — ép LUÔN cuộn ngang khi tràn,
   scoped bằng việc file này chỉ nạp ở trang ban. Kèm min-width để bảng thực sự tràn trên màn hẹp. */
.table-overflow-x-fix { overflow-x: auto !important; -webkit-overflow-scrolling: touch; }
.table-overflow-x-fix > table { min-width: 900px; }

/* Cột ghim: STT (trái cùng) + Thao tác (kề sau). Header giữ nền th sẵn có.
   ⚠ KHÔNG đặt tên chứa "col-": bootstrap.min.css có `td[class*="col-"]{position:static}` sẽ ép mất sticky. */
.ban-fz-stt, .ban-fz-act { position: sticky !important; z-index: 2; }
.ban-fz-stt { left: 0; }
.ban-fz-act { left: 44px; }
thead .ban-fz-stt, thead .ban-fz-act, th.ban-fz-stt, th.ban-fz-act { z-index: 3; }
/* Ô body cần nền đục để nội dung cuộn không lộ qua ô ghim (áp cả owner .ban-table-scroll lẫn admin .table-responsive) */
td.ban-fz-stt, td.ban-fz-act { background: #fff; }
/* Header sticky ở bảng detail (th nằm thẳng trong tr, không thead): nền đục fallback nếu th chưa có nền riêng */
th.ban-fz-stt:not([style*="background"]), th.ban-fz-act:not([style*="background"]) { background: #f4f7fa; }
/* Đường ranh giới cột ghim */
.ban-fz-act { box-shadow: 6px 0 8px -6px rgba(0, 0, 0, .18); }

/* ===== Badge LOẠI đối tượng — phân biệt rõ 3 loại (dùng chung mọi màn) ===== */
.ban-type-badge { display: inline-block; padding: 3px 11px; border-radius: 12px; font-size: 12px; font-weight: 600; white-space: nowrap; line-height: 1.5; border: 1px solid transparent; }
.ban-type-badge.cn   { background: #E3F5EA; color: #157347 !important; border-color: #a8dcbb; }  /* Cá nhân — xanh lá */
.ban-type-badge.tc   { background: #E4F0FC; color: #0b5ed7 !important; border-color: #a9cef1; }  /* Tổ chức — xanh dương */
.ban-type-badge.both { background: #F1E9FB; color: #7A34B0 !important; border-color: #d5bdec; }  /* Cá nhân & Tổ chức — tím */

/* ===== Badge TRẠNG THÁI — Đang hiển thị (xanh) vs Đã gỡ (đỏ nhạt, nổi bật) ===== */
/* ⚠ KHÔNG dùng class "show"/"hidden" (đụng bootstrap .show{display:block}/.hidden{display:none}) — dùng st-on/st-off */
.ban-status { display: inline-block !important; padding: 3px 12px; border-radius: 12px; font-size: 12.5px; font-weight: 600; white-space: nowrap; line-height: 1.5; border: 1px solid transparent; }
.ban-status.st-on  { background: #E3F5EA; color: #157347 !important; border-color: #a8dcbb; }   /* Đang hiển thị */
.ban-status.st-off { background: #FBEAEA; color: #C0392B !important; border-color: #f1cdc9; }   /* Đã gỡ */

/* ===== Modal chi tiết hành động (admin) — 2 cột giá trị cũ/mới (JSON) ===== */
.ban-snap-overlay { display: none; position: fixed; inset: 0; background: rgba(0,0,0,.45); z-index: 1060; align-items: center; justify-content: center; }
.ban-snap-box { background: #fff; border-radius: 8px; width: 1120px; max-width: 96vw; max-height: 90vh; box-shadow: 0 8px 30px rgba(0,0,0,.28); overflow: hidden; display: flex; flex-direction: column; }
.ban-snap-head { background: #4cc0c1; color: #fff; font-weight: 700; font-size: 15px; padding: 12px 18px; display: flex; align-items: center; justify-content: space-between; flex: none; }
.ban-snap-x { background: transparent; border: 0; color: #fff; font-size: 24px; line-height: 1; cursor: pointer; padding: 0 4px; }
.ban-snap-cols { display: flex; gap: 14px; padding: 14px; overflow: auto; }
.ban-snap-col { flex: 1 1 0; min-width: 0; display: flex; flex-direction: column; }
.ban-snap-col-head { display: flex; align-items: center; justify-content: space-between; font-weight: 600; font-size: 13px; padding: 7px 10px; border-radius: 5px 5px 0 0; }
.ban-snap-col-head.old { background: #FBEAEA; color: #C0392B; border: 1px solid #f1cdc9; border-bottom: 0; }
.ban-snap-col-head.new { background: #E3F5EA; color: #157347; border: 1px solid #a8dcbb; border-bottom: 0; }
.ban-snap-pre { margin: 0; padding: 12px; background: #fafafa; border: 1px solid #e8e8e8; border-radius: 0 0 5px 5px; white-space: pre-wrap; word-break: break-word; font-size: 12px; line-height: 1.5; max-height: 66vh; overflow: auto; color: #24303a; flex: 1 1 auto; }
@media (max-width: 720px) { .ban-snap-cols { flex-direction: column; } .ban-snap-pre { max-height: 34vh; } }

/* ===== Datepicker widget nổi trên cùng — tránh bị cột đóng băng STT/Thao tác (z-index:2/3) đè =====
   Widget bị nhốt trong stacking context của panel search (.searchForm-inner, z:auto) nên ô sticky
   z-index của bảng vẽ đè. Nâng cả cụm .searchbox thành stacking context z cao -> toàn bộ search
   (gồm widget) nổi trên bảng. (File chỉ nạp ở trang ban nên không ảnh hưởng portal khác.) */
.searchbox { position: relative; z-index: 50; }
/* .searchbox/.searchForm/.searchForm-inner của portal đặt overflow:hidden -> CẮT lịch thả xuống.
   Mở overflow ở 2 lớp ngoài (không collapse) + lớp trong CHỈ khi panel mở (is-open) để animation
   collapse lúc đóng vẫn hidden. Kết hợp z-index searchbox -> lịch nổi trên bảng, không bị cắt. */
.searchbox, .searchbox .searchForm { overflow: visible !important; }
.searchbox .searchForm-inner.is-open, .searchbox .searchForm-inner.is-open .row,
.searchbox .searchForm-inner.is-open .inputBox { overflow: visible !important; }
.bootstrap-datetimepicker-widget { z-index: 1065 !important; }
/* Ô ngày search đồng bộ với form thêm/sửa: input-group + icon lịch, cao ngang input portal.
   Portal ép .inputBox input {width:100%; border-radius} phá layout table của bootstrap input-group
   -> dùng flex + ép width auto + gộp border input↔addon cho liền mạch (hết khe hở/border phải lỗi). */
.ban-date-group { width: 100%; display: flex; }
.ban-date-group .form-control {
    flex: 1 1 auto; width: auto !important; min-width: 0; height: 44px !important; line-height: 24px; margin: 0 !important;
    border: 1px solid #cdd8d8 !important; border-right: 0 !important;
    border-radius: 6px 0 0 6px !important; box-shadow: none;
}
.ban-date-group .input-group-addon {
    flex: 0 0 auto; box-sizing: border-box;
    display: flex; align-items: center; height: 44px; padding: 0 28px 0 16px;
    background: #f4f7f8; border: 1px solid #cdd8d8; border-left: 0;
    border-radius: 0 6px 6px 0; color: #58666e; cursor: pointer; font-size: 15px;
}
.ban-date-group .input-group-addon .glyphicon { line-height: 1; }

/* ===== Ô text dài (Thường trú / Số đối tượng preview) — cap chiều cao + cuộn trong ô
   để dữ liệu dài không kéo dòng cao dằng dặc, vẫn xem đủ bằng cuộn dọc. ===== */
.ban-longtext { display: block; max-height: 128px; overflow-y: auto; white-space: pre-line; word-break: break-word; line-height: 1.5; }
.ban-subject-count { width: 340px; min-width: 340px; }
.ban-subject-preview { white-space: pre-line; font-size: 12px; color: #555; text-align: left; line-height: 1.55; overflow-wrap: anywhere; }
.ban-subject-count .ban-subject-preview strong { font-size: inherit; line-height: inherit; font-weight: 700; }

/* Structured subject details are used only in the owner/admin decision lists. */
.ban-subject-list-cell .ban-subject-total { text-align: left; font-weight: 600; margin-bottom: 8px; }
.ban-subject-list-cell .ban-subject-preview { display: grid; grid-template-columns: max-content minmax(0, 1fr); column-gap: 6px; white-space: normal; text-align: left; }
.ban-subject-list-cell .ban-subject-preview + .ban-subject-preview { margin-top: 10px; padding-top: 10px; border-top: 1px solid #e6eaf0; }
.ban-subject-list-cell .ban-subject-index { color: #334155; font-size: 13px; line-height: 1.5; font-weight: 700; }
.ban-subject-list-cell .ban-subject-field { color: #334155; font-size: 13px; line-height: 1.5; overflow-wrap: anywhere; }
.ban-subject-list-cell .ban-subject-field + .ban-subject-field { margin-top: 2px; }

/* Keep each subject readable beside the pinned columns on small list screens.
   Owner/admin have different page padding and action-column widths. */
@media (max-width: 767px) {
    .ban-table-scroll .ban-subject-list-heading,
    .ban-table-scroll .ban-subject-list-cell {
        width: min(340px, calc(100vw - 140px));
        min-width: min(340px, calc(100vw - 140px));
        max-width: min(340px, calc(100vw - 140px));
    }
    .table-overflow-x-fix .ban-subject-list-heading,
    .table-overflow-x-fix .ban-subject-list-cell {
        width: min(340px, calc(100vw - 210px));
        min-width: min(340px, calc(100vw - 210px));
        max-width: min(340px, calc(100vw - 210px));
    }
}

/* A full dd/MM/yyyy – dd/MM/yyyy range stays on one line. */
.ban-period { min-width: 220px; white-space: nowrap; }