/* Thông báo nội bộ (issue 219): Nhân sự › Thông báo nội bộ (người gửi) và Tác vụ › Thông báo nội bộ (người nhận).
   Chỉ dùng token --bms-*; bảng, nút, ô tìm kiếm và biểu mẫu dùng primitive chung (hrm-table, btn, bms-search, hrm-form). */

/* Thanh công cụ: tiêu đề, bộ lọc, tìm kiếm, nút chính trên một hàng 48px */
.ann-head{display:flex;align-items:center;gap:10px;margin-bottom:14px;flex-wrap:nowrap;min-width:0}
.ann-head h3{margin:0;font-size:1.05rem;color:var(--bms-text);white-space:nowrap}
.ann-head .bms-search{flex:1 1 220px;min-width:180px}
.ann-head .btn.primary{flex:0 0 auto;height:var(--bms-control-touch,48px);padding:0 20px;border-radius:var(--bms-radius-round);white-space:nowrap}
.ann-seg{display:inline-flex;flex:0 0 auto;height:48px;padding:4px;gap:2px;border:1px solid var(--bms-border);border-radius:var(--bms-radius-round);background:var(--bms-surface-subtle)}
.ann-seg button{display:inline-flex;align-items:center;gap:6px;height:38px;padding:0 14px;border:0;border-radius:var(--bms-radius-round);background:transparent;color:var(--bms-text-muted);font-weight:700;font-size:13px;white-space:nowrap;cursor:pointer}
.ann-seg button b{min-width:20px;padding:0 6px;border-radius:var(--bms-radius-round);background:var(--bms-neutral-soft);color:var(--bms-neutral);font-size:11.5px;line-height:20px;text-align:center}
.ann-seg button[aria-pressed="true"]{background:var(--bms-surface);color:var(--bms-primary);box-shadow:var(--bms-shadow-1)}
.ann-seg button[aria-pressed="true"] b{background:var(--bms-primary-soft);color:var(--bms-primary)}
.ann-seg.sm{height:40px;padding:3px}.ann-seg.sm button{height:32px;padding:0 11px;font-size:12.5px}

/* Nhãn trạng thái */
.ann-chip{display:inline-flex;align-items:center;gap:4px;padding:2px 9px;border-radius:var(--bms-radius-round);background:var(--bms-neutral-soft);color:var(--bms-neutral);font-size:12.5px;font-weight:700;white-space:nowrap}
.ann-chip.ok{background:var(--bms-success-soft);color:var(--bms-success)}
.ann-chip.warn{background:var(--bms-warning-soft);color:var(--bms-warning)}
.ann-chip.bad{background:var(--bms-danger-soft);color:var(--bms-danger)}
.ann-chip.info{background:var(--bms-info-soft);color:var(--bms-info)}
.ann-chip.pri{background:var(--bms-primary-soft);color:var(--bms-primary)}
.ann-muted{color:var(--bms-text-muted);font-size:12.5px}

/* Danh sách người gửi */
.ann-table td{vertical-align:middle;font-size:13.5px}
.ann-table tbody tr[data-ann-open]{cursor:pointer}
.ann-title{display:grid;gap:3px;min-width:260px}
.ann-title strong{color:var(--bms-text);font-size:14px}
.ann-title small{color:var(--bms-text-muted);font-size:12px}
.ann-pin{color:var(--bms-primary);font-size:12px;font-weight:800}
.ann-progress{display:grid;gap:4px;min-width:150px}
.ann-progress span{font-size:12.5px;color:var(--bms-text-muted)}.ann-progress span b{color:var(--bms-text)}
.ann-bar{height:6px;border-radius:var(--bms-radius-round);background:var(--bms-neutral-soft);overflow:hidden}
.ann-bar i{display:block;height:100%;border-radius:var(--bms-radius-round);background:var(--bms-primary)}
.ann-bar i.done{background:var(--bms-success)}

/* Ngăn kéo chi tiết */
.ann-drawer-back{position:fixed;inset:0;z-index:1000;background:var(--bms-backdrop)}
.ann-drawer{position:fixed;top:0;right:0;bottom:0;z-index:1001;display:grid;grid-template-rows:auto minmax(0,1fr) auto;width:min(720px,100vw);overflow:hidden;background:var(--bms-surface);box-shadow:var(--bms-shadow-overlay)}
body:has(.ann-drawer) .floating-actions-container{visibility:hidden;pointer-events:none}
.ann-drawer>header,.ann-read>header{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;padding:18px 20px 14px;border-bottom:1px solid var(--bms-border)}
.ann-drawer>header h3{margin:4px 0 6px;font-size:1.15rem;color:var(--bms-text)}
.ann-meta{display:flex;flex-wrap:wrap;gap:6px;align-items:center;color:var(--bms-text-muted);font-size:12.5px}
.ann-x{flex:0 0 40px;width:40px;height:40px;border:1px solid var(--bms-border);border-radius:var(--bms-radius-round);background:var(--bms-surface);font-size:20px;line-height:1;cursor:pointer;color:var(--bms-text-muted)}
.ann-drawer>.ann-body,.ann-read>.ann-body{display:grid;gap:16px;align-content:start;grid-auto-rows:max-content;overflow:auto;overflow-x:hidden;padding:16px 20px}
.ann-drawer>.ann-body>*,.ann-read>.ann-body>*{min-width:0;min-height:max-content}
.ann-drawer>footer{display:flex;flex-wrap:wrap;align-items:center;gap:8px;justify-content:flex-end;padding:12px 20px;border-top:1px solid var(--bms-border)}
.ann-drawer>footer .btn{height:44px;border-radius:var(--bms-radius-round);padding:0 18px}
.ann-confirm{flex:1 1 260px;color:var(--bms-danger);font-size:13px;font-weight:600}
.ann-content{padding:14px 16px;border:1px solid var(--bms-border);border-radius:12px;background:var(--bms-surface-subtle);font-size:14px;line-height:1.55;color:var(--bms-text);overflow-wrap:anywhere}
.ann-content p{margin:0 0 8px}.ann-content p:last-child{margin:0}
.ann-files{display:flex;flex-wrap:wrap;align-items:flex-start;gap:8px}
.ann-file{display:inline-flex;align-items:center;gap:8px;max-width:100%;padding:8px 12px;border:1px solid var(--bms-border);border-radius:10px;background:var(--bms-surface);font-size:13px;font-weight:600;color:var(--bms-text);cursor:pointer;overflow-wrap:anywhere;text-align:left}
.ann-file i{font-style:normal;padding:2px 6px;border-radius:6px;background:var(--bms-danger-soft);color:var(--bms-danger);font-size:11px;font-weight:800}
.ann-file button{border:0;background:transparent;color:var(--bms-text-muted);font-size:16px;cursor:pointer}
.ann-kpis{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border:1px solid var(--bms-border);border-radius:12px;overflow:hidden}
.ann-kpis div{padding:12px 14px;border-right:1px solid var(--bms-border)}.ann-kpis div:last-child{border-right:0}
.ann-kpis span{display:block;color:var(--bms-text-muted);font-size:12px}
.ann-kpis strong{display:block;margin-top:4px;font-size:1.35rem;color:var(--bms-text)}
.ann-kpis .ok strong{color:var(--bms-success)}.ann-kpis .warn strong{color:var(--bms-warning)}.ann-kpis .bad strong{color:var(--bms-danger)}
.ann-subhead{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}
.ann-subhead h4{margin:0;font-size:.95rem}
.ann-people-wrap{overflow-x:auto}
.ann-people{width:100%;border-collapse:collapse;font-size:13px}
.ann-people th{text-align:left;color:var(--bms-text-muted);font-size:11.5px;text-transform:uppercase;letter-spacing:.04em;padding:8px 10px;background:var(--bms-surface-subtle);border-bottom:1px solid var(--bms-border)}
.ann-people td{padding:8px 10px;border-bottom:1px solid var(--bms-border)}
.ann-av{display:inline-grid;place-items:center;width:28px;height:28px;margin-right:8px;border-radius:50%;background:var(--bms-primary-soft);color:var(--bms-primary);font-size:11px;font-weight:800;vertical-align:middle}

/* Soạn thông báo */
.ann-compose .ann-target{display:grid;gap:10px}
.ann-compose .ann-seg{height:44px}.ann-compose .ann-seg button{height:34px}
.ann-compose [data-ann-pane][hidden],.ann-compose [hidden]{display:none!important}
.ann-depts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.ann-dept{display:flex!important;align-items:center;gap:8px!important;padding:9px 11px;border:1px solid var(--bms-border);border-radius:10px;cursor:pointer;font-weight:600;font-size:13px}
.ann-dept input{width:18px!important;height:18px;min-height:0!important;accent-color:var(--bms-primary)}
.ann-dept small{margin-left:auto;color:var(--bms-text-muted);font-weight:500;text-align:right}
.ann-dept:has(input:checked){border-color:var(--bms-primary);background:var(--bms-primary-soft)}
.ann-reach{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:10px 12px;border-radius:10px;background:var(--bms-info-soft);color:var(--bms-info);font-size:13px;font-weight:600}
.ann-reach small{color:var(--bms-text-muted);font-weight:500}
.ann-reach.bad{background:var(--bms-danger-soft);color:var(--bms-danger)}
.ann-hint{margin:0;color:var(--bms-text-muted);font-size:13px}
.ann-switch{position:relative;display:flex!important;align-items:center;gap:10px!important;font-weight:600}
.ann-switch input{position:absolute;width:1px;height:1px;opacity:0}
.ann-switch>span:first-of-type{position:relative;flex:0 0 38px;width:38px;height:22px;border-radius:var(--bms-radius-round);background:var(--bms-border-strong);transition:background var(--bms-duration-fast)}
.ann-switch>span:first-of-type::after{position:absolute;top:3px;left:3px;width:16px;height:16px;border-radius:50%;background:var(--bms-surface);box-shadow:var(--bms-shadow-1);content:"";transition:transform var(--bms-duration-fast)}
.ann-switch input:checked+span{background:var(--bms-primary)}.ann-switch input:checked+span::after{transform:translateX(16px)}
.ann-switch input:focus-visible+span{outline:2px solid var(--bms-focus);outline-offset:2px}
.ann-switch small{display:block;color:var(--bms-text-muted);font-weight:500;font-size:12px}
.ann-compose .hrm-form-actions .btn{height:44px;border-radius:var(--bms-radius-round);padding:0 18px}
.ann-compose .hrm-form-actions .ann-left{margin-right:auto;color:var(--bms-danger)}

/* Tác vụ › Thông báo nội bộ (người nhận) */
.ann-feed{display:grid;gap:10px}
.ann-card{position:relative;display:grid;gap:8px;padding:14px 16px;border:1px solid var(--bms-border);border-radius:12px;background:var(--bms-surface);cursor:pointer}
.ann-card:focus-visible{outline:2px solid var(--bms-focus);outline-offset:2px}
.ann-card.unread{box-shadow:inset 4px 0 var(--bms-primary);background:color-mix(in srgb,var(--bms-primary-soft) 45%,var(--bms-surface))}
.ann-card.pinned{border-color:color-mix(in srgb,var(--bms-primary) 40%,var(--bms-border))}
.ann-card header{display:flex;align-items:flex-start;justify-content:space-between;gap:10px}
.ann-card h4{margin:0;font-size:15px;color:var(--bms-text)}
.ann-card p{margin:0;color:var(--bms-text-muted);font-size:13.5px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.ann-card footer{display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-size:12.5px;color:var(--bms-text-muted)}
.ann-card footer .btn{margin-left:auto;height:36px;border-radius:var(--bms-radius-round);padding:0 14px}
.tasks-hub-tabs button[data-tasks-hub-tab="announcements"],body.bms-opendesign-v8 .tasks-hub-tabs button[data-tasks-hub-tab="announcements"]{padding-right:26px}
.ann-tab-badge{position:absolute;top:-2px;right:2px;min-width:18px;height:18px;padding:0 5px;border-radius:var(--bms-radius-round);background:var(--bms-danger);color:var(--bms-surface);font-size:11px;font-weight:800;line-height:18px;text-align:center}
.ann-tab-badge[hidden]{display:none!important}

/* Cửa sổ đọc thông báo */
.ann-read{width:min(620px,calc(100vw - 24px));max-height:calc(100dvh - 24px);padding:0;border:0;border-radius:16px;overflow:hidden;background:var(--bms-surface);color:var(--bms-text)}
.ann-read[open]{display:grid;grid-template-rows:auto minmax(0,1fr) auto}
.ann-read::backdrop{background:var(--bms-backdrop)}
.ann-read>header h3{margin:8px 0 0;font-size:1.15rem}
.ann-read>.ann-body{gap:12px;padding:14px 20px}
.ann-read>footer{display:grid;gap:10px;padding:12px 20px 16px;border-top:1px solid var(--bms-border)}
.ann-read>footer small{color:var(--bms-text-muted)}
.ann-read>footer .btn{height:48px;border-radius:var(--bms-radius-round);font-size:15px}

.ann-sheet{width:min(760px,calc(100vw - 24px));height:min(860px,calc(100dvh - 24px))}
.ann-sheet[open]{grid-template-rows:auto minmax(0,1fr)}
.ann-sheet .ann-head h3{display:none}
.ann-sheet .ann-head{flex-wrap:wrap}.ann-sheet .ann-head .bms-search{flex:1 1 100%}

@media (max-width:900px){
  .ann-head{flex-wrap:wrap}
  .ann-head h3{flex:1 1 auto}
  .ann-head .ann-seg{order:3;flex:1 1 100%;overflow-x:auto}
  .ann-head .bms-search{order:4;flex:1 1 100%}
  .ann-depts{grid-template-columns:1fr 1fr}
}
@media (max-width:600px){
  .ann-kpis div{padding:10px}.ann-kpis strong{font-size:1.1rem}
  .ann-depts{grid-template-columns:1fr}
  .ann-head .btn.primary{height:44px}
  .ann-card footer .btn{flex:1 1 100%;margin-left:0;height:44px}
  .ann-read{width:100vw;max-width:100vw;height:100dvh;max-height:100dvh;border-radius:0}
  .ann-drawer>footer .btn{flex:1 1 auto}
  .ann-drawer>header{padding:14px 16px 12px}.ann-drawer>.ann-body{padding:14px 16px}
  .ann-subhead .ann-seg{width:100%;overflow-x:auto}
  .ann-people th:nth-child(2),.ann-people td:nth-child(2),.ann-people th:nth-child(4),.ann-people td:nth-child(4){display:none}
  .ann-people td{padding:8px 4px}
  /* Bảng người gửi thành thẻ trên điện thoại */
  .ann-table thead{display:none}
  .hrm-table.ann-table,.ann-table tbody,.ann-table tr,.ann-table td{display:block;width:auto;min-width:0!important}
  .ann-table tr{position:relative;padding:12px 14px;border-bottom:1px solid var(--bms-border)}
  .ann-table td{padding:2px 0!important;border:0!important}
  .ann-table td[data-l]::before{content:attr(data-l) ": ";color:var(--bms-text-muted);font-size:12px}
  .ann-table td.ann-status-cell{position:absolute;top:12px;right:12px}
  .ann-table td:first-child{padding-right:90px!important}
  .ann-table td:has(>.ann-nil){display:none}
  .ann-table .ann-title{min-width:0}
  .ann-table td .ann-muted{display:inline}
  .ann-table td[data-l="Gửi tới"] .ann-muted::before{content:" · "}
}
/* Tài khoản tham quan dùng dữ liệu demo, không có thông báo nội bộ. */
body.demo-mode #taskAnnouncementsTab{display:none}