/* =====================================================================
   Khung chọn danh mục (thay ô thả xuống của trình duyệt)
   ===================================================================== */
select.dmc-an { display: none !important; }

/* nút thay cho ô thả xuống — cùng cỡ với ô nhập */
.dmc-nut { width: 100%; display: flex; align-items: center; gap: 10px; padding: 11px 13px; min-height: 46px;
  border: 1px solid #e3ddd1; border-radius: 10px; background: #fff; cursor: pointer; text-align: left;
  transition: border-color .2s, box-shadow .2s; }
.dmc-nut:hover, .dmc-nut:focus-visible { outline: none; border-color: var(--brand); box-shadow: 0 0 0 4px rgba(33, 73, 230, .1); }
.dmc-chu { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: .93rem; font-weight: 600; color: var(--ink); }
.dmc-nut.rong .dmc-chu { font-weight: 400; color: var(--muted); }
.dmc-nut svg { color: var(--muted); }
.dmc-nut:hover svg { color: var(--brand); }
.field.thieu .dmc-nut { border-color: var(--err); background: var(--err-soft); }
.tbl-cp .dmc-nut { min-height: 36px; padding: 7px 9px; }

/* khung bật lên */
#dlg_dmc { max-width: min(860px, 96vw); width: 100%; padding: 0; border-radius: 18px; overflow: hidden; }
#dlg_dmc::backdrop { background: rgba(10, 23, 48, .5); backdrop-filter: blur(3px); }
.dmc-dau { padding: 18px 22px 10px; border-bottom: 1px solid var(--line); background: #fff; }
.dmc-dau h3 { font-size: 1.1rem; font-weight: 700; margin-bottom: 12px; }
.dmc-tim { display: flex; align-items: center; gap: 10px; padding: 0 14px; border: 2px solid var(--brand); border-radius: 12px;
  background: #fff; box-shadow: 0 0 0 4px rgba(33, 73, 230, .1); }
.dmc-tim svg { color: var(--brand); width: 20px; height: 20px; }
.dmc-tim input { flex: 1; border: 0; outline: 0; padding: 12px 0; font-size: 1rem; background: none; }
.dmc-goi { display: flex; justify-content: space-between; gap: 10px; flex-wrap: wrap; margin: 10px 0 0; font-size: .76rem; color: var(--muted); }
.dmc-goi kbd { display: inline-block; min-width: 20px; padding: 1px 6px; margin: 0 2px; border-radius: 5px; border: 1px solid var(--line);
  background: var(--paper); font: 600 .72rem var(--sans); color: var(--ink); text-align: center; }
.dmc-than { max-height: min(56vh, 520px); overflow: auto; background: #fff; }
.dmc-than table { font-size: .9rem; }
.dmc-than thead th { position: sticky; top: 0; z-index: 1; }
.dmc-than tbody tr { cursor: pointer; }
.dmc-than tbody tr.sang { background: var(--brand-soft); box-shadow: inset 3px 0 0 var(--brand); }
.dmc-than tbody tr.dang td:first-child::after { content: " ✓ đang chọn"; font-size: .72rem; font-weight: 700; color: var(--ok); }
.dmc-ma { font-size: .8rem; color: var(--muted); font-variant-numeric: tabular-nums; }
@media (max-width: 720px) {
  .dmc-than td:nth-child(n+4), .dmc-than th:nth-child(n+4) { display: none; }
}