/* Thao tác hàng loạt (ui/static/js/batch_ops.js): nút tách "Tạo hồ sơ", menu "Thao tác", thanh biểu tượng ở đáy bảng, hộp thoại, bảng tiến độ.
   Chỉ dùng biến màu --stc-* (Sáng/Tối tự đổi theo data-theme). */

/* ---- nút tách: "Tạo hồ sơ" + mũi tên mở menu ---- */
#stc-btn-create:has(+ #bo-create-more:not([hidden])) { border-top-right-radius: 0; border-bottom-right-radius: 0; }
#bo-create-more { margin-left: -10px; padding-left: 9px; padding-right: 9px; border-top-left-radius: 0; border-bottom-left-radius: 0;
  border-left: 1px solid color-mix(in srgb, var(--stc-accent-ink) 22%, transparent); }
#bo-actions svg, #bo-create-more svg { flex-shrink: 0; }
#bo-actions[aria-expanded="true"] svg, #bo-create-more[aria-expanded="true"] svg { transform: rotate(180deg); }

/* ---- thanh biểu tượng ở đáy bảng ---- */
.bo-dock { display: inline-flex; align-items: center; gap: 2px; padding: 3px; border: 1px solid var(--stc-border); border-radius: var(--stc-r-card); background: var(--stc-surface); }
.bo-dock[hidden] { display: none; }
.bo-dock-sep { width: 1px; height: 20px; margin: 0 4px; background: var(--stc-border); }
.bo-ic { position: relative; display: inline-flex; align-items: center; justify-content: center; width: 34px; height: 32px; border: 0; border-radius: var(--stc-r-ctl);
  background: transparent; color: var(--stc-muted); cursor: pointer; }
.bo-ic:hover { background: var(--stc-row-hover); color: var(--stc-text-strong); }
.bo-ic.danger:hover { color: var(--stc-err); }
.bo-ic:focus-visible { outline: 2px solid var(--stc-accent); outline-offset: 1px; color: var(--stc-text-strong); }
/* chú thích khi rê chuột / đưa tiêu điểm bàn phím (aria-label mang cùng nội dung cho trình đọc màn hình) */
.bo-ic[data-tip]::after, #bo-create-more[data-tip]::after { content: attr(data-tip); position: absolute; left: 50%; bottom: calc(100% + 8px); transform: translate(-50%, 3px);
  padding: 5px 9px; border-radius: var(--stc-r-ctl); background: var(--stc-text-strong); color: var(--stc-surface); font-size: 12.5px; font-weight: 500; line-height: 1.3;
  white-space: nowrap; pointer-events: none; opacity: 0; transition: opacity 120ms ease-out, transform 160ms cubic-bezier(0.16, 1, 0.3, 1); z-index: 900; }
#bo-create-more[data-tip]::after { bottom: auto; top: calc(100% + 8px); left: auto; right: 0; transform: translate(0, -3px); }
.bo-ic[data-tip]:hover::after, .bo-ic[data-tip]:focus-visible::after, #bo-create-more[data-tip]:hover::after, #bo-create-more[data-tip]:focus-visible::after { opacity: 1; transform: translate(-50%, 0); }
#bo-create-more[data-tip]:hover::after, #bo-create-more[data-tip]:focus-visible::after { transform: none; }
#bo-create-more[aria-expanded="true"]::after { opacity: 0 !important; }
#bo-create-more { position: relative; }

/* ---- hộp thoại ---- */
.stc-modal.bo-modal { width: min(560px, 94vw); }
.stc-modal.bo-modal.bo-wide { width: min(820px, 96vw); }
.bo-modal p { margin: 0 0 10px; line-height: 1.5; }
.bo-modal .row label, .bo-modal label.row { color: var(--stc-text); font-size: 13.5px; }
.bo-modal input[type="number"], .bo-modal input[type="password"], .bo-modal input[type="file"] { box-sizing: border-box; padding: 8px 10px; border-radius: var(--stc-r-card); border: 1px solid var(--stc-border-ctl);
  background: var(--stc-input); color: var(--stc-text); font-size: 13.5px; }
.bo-modal input[type="password"], .bo-modal #bo-pg-n { width: 100%; }
.bo-modal input[type="file"] { flex: 1; min-width: 220px; }
.bo-modal input:focus-visible, .bo-modal select:focus-visible, .bo-modal textarea:focus-visible { outline: 2px solid var(--stc-accent); outline-offset: 0; }
.bo-modal textarea { min-height: 0; font-family: var(--stc-font); }
.bo-modal #bo-px-text, .bo-modal #bo-cm-px { font-family: Consolas, "Cascadia Mono", monospace; }
.bo-lbl { display: block; margin: 12px 0 5px; color: var(--stc-muted); font-size: 13px; }
.bo-grid2 { display: grid; grid-template-columns: 1fr 1fr; gap: 10px 14px; margin: 8px 0; }
.bo-grid2 label { display: flex; flex-direction: column; gap: 5px; color: var(--stc-muted); font-size: 13px; }
.bo-grid2 input[type="number"] { width: 100%; }
@media (max-width: 560px) { .bo-grid2 { grid-template-columns: 1fr; } }
.bo-num { width: 76px !important; padding: 3px 6px !important; }
.bo-warn { padding: 10px 12px; border-radius: var(--stc-r-card); background: color-mix(in srgb, var(--stc-err) 10%, transparent); color: var(--stc-text); border: 1px solid color-mix(in srgb, var(--stc-err) 35%, transparent); }

/* lựa chọn có dòng mô tả (như Bit): nút tròn + tiêu đề + mô tả ngắn */
.bo-choices { display: grid; gap: 6px; margin: 4px 0 12px; }
.bo-choice { display: flex; gap: 10px; align-items: flex-start; padding: 10px 12px; border: 1px solid var(--stc-border); border-radius: var(--stc-r-card); cursor: pointer; }
.bo-choice:hover { background: var(--stc-row-hover); }
.bo-choice:has(input:checked) { border-color: var(--stc-border-hover); background: var(--stc-fill-active); }
.bo-choice input { margin: 3px 0 0; accent-color: var(--stc-accent); }
.bo-choice span { display: flex; flex-direction: column; gap: 2px; }
.bo-choice b { color: var(--stc-text-strong); font-weight: 600; font-size: 14px; }
.bo-choice small { color: var(--stc-muted); font-size: 12.5px; line-height: 1.45; }

/* sửa hàng loạt: mỗi trường một khối bật/tắt */
.bo-field { margin: 0 0 8px; padding: 8px 12px; border: 1px solid var(--stc-border); border-radius: var(--stc-r-card); }
.bo-field legend { padding: 0 4px; font-size: 14px; }
.bo-field legend label { display: inline-flex; gap: 8px; align-items: center; cursor: pointer; color: var(--stc-text-strong); }
.bo-field input[type="checkbox"], .bo-modal label.row input[type="checkbox"] { accent-color: var(--stc-accent); width: 16px; height: 16px; }
.bo-field-body { display: grid; gap: 6px; padding: 4px 0 2px; }
.bo-field-body small { color: var(--stc-muted); }

.bo-help { margin: 6px 0 10px; font-size: 13px; color: var(--stc-muted); }
.bo-help summary { cursor: pointer; color: var(--stc-accent-text); }
.bo-help ul { margin: 6px 0 0; padding-left: 18px; line-height: 1.6; }
.bo-people { max-height: 260px; overflow: auto; padding: 4px 2px; }

/* bảng xem trước */
.bo-prev { margin-top: 10px; font-size: 13.5px; }
.bo-table-wrap { max-height: 300px; overflow: auto; border: 1px solid var(--stc-border); border-radius: var(--stc-r-card); }
.bo-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.bo-table th { position: sticky; top: 0; background: var(--stc-surface-2); color: var(--stc-muted); font-weight: 600; text-align: left; padding: 7px 10px; }
.bo-table td { padding: 6px 10px; border-top: 1px solid var(--stc-border); vertical-align: top; overflow-wrap: break-word; }
.bo-table .num { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.bo-table tr.bad td { background: color-mix(in srgb, var(--stc-err) 6%, transparent); }

/* ---- bảng tiến độ (không chặn giao diện) ---- */
.bo-run { position: fixed; right: 20px; bottom: 20px; z-index: 99600; width: min(380px, calc(100vw - 32px)); padding: 14px 14px 10px; border-radius: var(--stc-r-card);
  background: var(--stc-surface); color: var(--stc-text); border: 1px solid var(--stc-border); box-shadow: var(--stc-shadow);
  animation: bo-in 220ms cubic-bezier(0.16, 1, 0.3, 1); }
@keyframes bo-in { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) { .bo-run { animation: none; } .bo-run-bar i { transition: none !important; } .bo-ic[data-tip]::after { transition: none; } }
.bo-run-head { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; }
.bo-run-title { font-size: 14px; color: var(--stc-text-strong); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.bo-run-n { font-variant-numeric: tabular-nums; color: var(--stc-muted); font-size: 13px; }
.bo-run-bar { height: 6px; margin: 10px 0 8px; border-radius: 999px; background: var(--stc-surface-2); overflow: hidden; }
.bo-run-bar i { display: block; height: 100%; width: 0; border-radius: inherit; background: var(--stc-accent); transition: width 240ms cubic-bezier(0.16, 1, 0.3, 1); }
.bo-run.done.all-ok .bo-run-bar i { background: var(--stc-ok); }
.bo-run.done.has-fail .bo-run-bar i { background: var(--stc-warn); }
.bo-run-sum { font-size: 13px; color: var(--stc-muted); }
.bo-run-sum .ok { color: var(--stc-ok-text); } .bo-run-sum .err { color: var(--stc-err-text); }
.bo-run-list { list-style: none; margin: 8px 0 0; padding: 0; max-height: 220px; overflow: auto; border-top: 1px solid var(--stc-border); }
.bo-run-list li { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.4fr); gap: 10px; padding: 6px 2px; border-bottom: 1px solid var(--stc-border); font-size: 12.5px; }
.bo-run-list .t { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--stc-text); }
.bo-run-list .m { color: var(--stc-muted); overflow-wrap: anywhere; }
.bo-run-list .bo-r-ok .m { color: var(--stc-ok-text); }
.bo-run-list .bo-r-fail .m { color: var(--stc-err-text); }
.bo-run-foot { display: flex; align-items: center; gap: 8px; margin-top: 10px; }
.bo-run-foot .grow { flex: 1; }
#bo-actions[hidden], #bo-create-more[hidden], #batch-controls-box .stc-more[hidden] { display: none; }
.bo-modal [hidden] { display: none !important; }
.bo-table td:not(:last-child) { white-space: nowrap; max-width: 220px; overflow: hidden; text-overflow: ellipsis; }