/* Máy tính: khung chung cho mọi nghiệp vụ (anh Hiệp 2026-10-28).
   1) Menu trái nền xanh đặc trưng BMS (#0757B8, cùng màu nút BCC Nexus / logo).
   2) Đầu trang: một hàng tiêu đề = tab đang xem (tên tab do bms-desktop-nav-tree.js chèn), bỏ eyebrow + mô tả dài.
   Chuyển tab bằng cây "BMS / Module / Tab ▾" trên thanh trên. Điện thoại (html.bms-phone-v2) không áp dụng. */
@media (min-width: 901px) {
  html:not(.bms-phone-v2) body.bms-opendesign-v8 .sidebar { --dl-blue: #0757B8; --dl-blue-deep: #05458F; border-right: 0; background: linear-gradient(180deg, var(--dl-blue) 0%, var(--dl-blue-deep) 100%); color: #fff; }
  html:not(.bms-phone-v2) body.bms-opendesign-v8 .sidebar .brand-copy :where(span):is(span, strong), html:not(.bms-phone-v2) body.bms-opendesign-v8 .sidebar .brand-copy :where(strong):is(span, strong) { color: #fff; }
  html:not(.bms-phone-v2) body.bms-opendesign-v8 .sidebar .brand-copy small { color: rgba(255, 255, 255, .7); }
  html:not(.bms-phone-v2) body.bms-opendesign-v8 .sidebar .nav-section-label { color: rgba(255, 255, 255, .62); }
  html:not(.bms-phone-v2) body.bms-opendesign-v8 .sidebar .nav-section-spaced { border-top-color: rgba(255, 255, 255, .18); }
  html:not(.bms-phone-v2) body.bms-opendesign-v8 .sidebar :where(.nav-item):is(.nav-item, .nav-item[data-panel="crm"]) { color: rgba(255, 255, 255, .88); }
  html:not(.bms-phone-v2) body.bms-opendesign-v8 .sidebar .nav-item > small { color: rgba(255, 255, 255, .55); }
  html:not(.bms-phone-v2) body.bms-opendesign-v8 .sidebar :where(.nav-item):is(.nav-item, .nav-item[data-panel="crm"]):hover { border-color: transparent; background: rgba(255, 255, 255, .12); color: #fff; }
  html:not(.bms-phone-v2) body.bms-opendesign-v8 .sidebar :where(.nav-item):is(.nav-item, .nav-item[data-panel="crm"]).active { border-color: transparent; background: #fff; color: var(--dl-blue); box-shadow: 0 2px 8px rgba(2, 32, 71, .18); }
  html:not(.bms-phone-v2) body.bms-opendesign-v8 .sidebar .nav-item.active > small { color: rgba(7, 87, 184, .6); }
  html:not(.bms-phone-v2) body.bms-opendesign-v8 .sidebar .nav-item:focus-visible { outline: 2px solid #fff; outline-offset: 2px; }
  html:not(.bms-phone-v2) body.bms-opendesign-v8 .sidebar .mobile-nav-profile { border-color: rgba(255, 255, 255, .18); background: rgba(255, 255, 255, .1); color: #fff; }
  html:not(.bms-phone-v2) body.bms-opendesign-v8 .sidebar .mobile-nav-profile :where(strong):is(strong, small), html:not(.bms-phone-v2) body.bms-opendesign-v8 .sidebar .mobile-nav-profile :where(small):is(strong, small) { color: #fff; }
  html:not(.bms-phone-v2) body.bms-opendesign-v8 .sidebar .mobile-nav-profile small { opacity: .72; }
  html:not(.bms-phone-v2) body.bms-opendesign-v8 .sidebar .mobile-nav-logout { border-color: rgba(255, 255, 255, .3); background: transparent; color: #fff; }
  html:not(.bms-phone-v2) body.bms-opendesign-v8 .sidebar .mobile-nav-logout:hover { background: rgba(255, 255, 255, .12); }

  /* phiên bản + giờ cập nhật: gọn dưới tên "Hệ thống BMS" thay "Operations workspace" (script chèn small.dnt-release); dòng trên thanh trên ẩn */
  html:not(.bms-phone-v2) body.bms-opendesign-v8 .topbar .topbar-release-meta { display: none; }
  html:not(.bms-phone-v2) body.bms-opendesign-v8 .sidebar .brand-copy:has(.dnt-release) > small:not(.dnt-release) { display: none; }
  html:not(.bms-phone-v2) body.bms-opendesign-v8 .sidebar .brand-copy small.dnt-release { color: rgba(255, 255, 255, .72); font-variant-numeric: tabular-nums; white-space: nowrap; }

  /* nút thu gọn menu: cùng kiểu nút thu gọn BCC Nexus (biểu tượng khung có cột, tròn 32px, không viền) */
  html:not(.bms-phone-v2) body.bms-opendesign-v8 .sidebar .sidebar-collapse-toggle { width: 32px; height: 32px; flex-basis: 32px; border: 0; border-radius: 50%; background: transparent; color: rgba(255, 255, 255, .82); }
  html:not(.bms-phone-v2) body.bms-opendesign-v8 .sidebar .sidebar-collapse-toggle:hover { background: rgba(255, 255, 255, .14); color: #fff; }
  html:not(.bms-phone-v2) body.bms-opendesign-v8 .sidebar .sidebar-collapse-toggle svg { width: 22px; height: 22px; stroke-width: 1.8; }

  /* Dự án: không dùng cây; nhóm dự án chọn trong nút Lọc (đã có ô "Nhóm dự án"), số trên nút Lọc tính cả nhóm (app.js projectQueueTabsFolded) */
  html:not(.bms-phone-v2) .panel[data-panel="project"] #projectQueueTabs { display: none !important; }

  /* đầu trang: tên tab chỉ hiện trên cây ở thanh trên (anh Hiệp 07:23Z), trong trang không lặp lại.
     Khối tiêu đề còn lại một hàng nút của trang (bên phải); không có nút nào thì ẩn hẳn. */
  html:not(.dnt-on) .dnt-title { display: none; }
  html.dnt-on:not(.bms-phone-v2) section.panel.active > :where(.task-page-header):is(.task-page-header, .relationship-title, .hrm-hero, .section-title), html.dnt-on:not(.bms-phone-v2) section.panel.active > :where(.relationship-title):is(.task-page-header, .relationship-title, .hrm-hero, .section-title), html.dnt-on:not(.bms-phone-v2) section.panel.active > :where(.hrm-hero):is(.task-page-header, .relationship-title, .hrm-hero, .section-title), html.dnt-on:not(.bms-phone-v2) section.panel.active > :where(.section-title):is(.task-page-header, .relationship-title, .hrm-hero, .section-title) { display: flex; align-items: center; justify-content: flex-end; gap: 12px; min-height: 0; margin: 0 0 14px; padding: 0; border: 0; background: none; box-shadow: none; }
  html.dnt-on:not(.bms-phone-v2) section.panel.active > :is(.task-page-header, .relationship-title, .hrm-hero, .section-title) :where(h2):is(h2, .eyebrow, h2 ~ p, div > span:first-child), html.dnt-on:not(.bms-phone-v2) section.panel.active > :is(.task-page-header, .relationship-title, .hrm-hero, .section-title) :where(.eyebrow):is(h2, .eyebrow, h2 ~ p, div > span:first-child), html.dnt-on:not(.bms-phone-v2) section.panel.active > :is(.task-page-header, .relationship-title, .hrm-hero, .section-title) :where(p):is(h2, .eyebrow, h2 ~ p, div > span:first-child), html.dnt-on:not(.bms-phone-v2) section.panel.active > :is(.task-page-header, .relationship-title, .hrm-hero, .section-title) :where(span):is(h2, .eyebrow, h2 ~ p, div > span:first-child) { display: none !important; }
  html.dnt-on:not(.bms-phone-v2) section.panel.active > :is(.task-page-header, .relationship-title, .hrm-hero, .section-title) > div { margin: 0; padding: 0; border: 0; }
  html.dnt-on:not(.bms-phone-v2) section.panel.active > :where(.task-page-header):is(.task-page-header, .relationship-title, .hrm-hero, .section-title):not(:has(:is(button, input, select, a[href]):not(h2 *):not([hidden]))), html.dnt-on:not(.bms-phone-v2) section.panel.active > :where(.relationship-title):is(.task-page-header, .relationship-title, .hrm-hero, .section-title):not(:has(:is(button, input, select, a[href]):not(h2 *):not([hidden]))), html.dnt-on:not(.bms-phone-v2) section.panel.active > :where(.hrm-hero):is(.task-page-header, .relationship-title, .hrm-hero, .section-title):not(:has(:is(button, input, select, a[href]):not(h2 *):not([hidden]))), html.dnt-on:not(.bms-phone-v2) section.panel.active > :where(.section-title):is(.task-page-header, .relationship-title, .hrm-hero, .section-title):not(:has(:is(button, input, select, a[href]):not(h2 *):not([hidden]))) { display: none !important; }

  /* nút ? Hỏi BCC Nexus: cạnh cây trên thanh trên (bản sao bấm nút gốc trong trang) */
  html:not(.bms-phone-v2) .topbar .dnt-help { display: inline-grid; place-items: center; width: 22px; height: 22px; margin-left: 10px; padding: 0; border: 1px solid var(--bms-border, #DCE3EF); border-radius: 50%; background: var(--bms-surface, #fff); color: var(--bms-text-muted, #475569); font: 700 12px/1 Roboto, system-ui, sans-serif; cursor: pointer; }
  html:not(.bms-phone-v2) .topbar .dnt-help[hidden] { display: none; }
  html:not(.bms-phone-v2) .topbar .dnt-help:hover { border-color: #0757B8; color: #0757B8; }
  html:not(.bms-phone-v2) .topbar .dnt-help:focus-visible { outline: 2px solid #0757B8; outline-offset: 2px; }
}
/* Menu trái luôn rộng đúng bằng cột của nó (anh Hiệp 2026-10-28: "viền trắng khó hiểu"): menu là khối cố định, rộng theo nội dung
   nên hẹp hơn cột 248px vài px, lộ nền trắng của khung ở mép phải. Cho menu rộng bằng cột (cả khi thu gọn) và nền khung là nền trang. */
@media (min-width: 901px) {
  html:not(.bms-phone-v2) body.bms-opendesign-v8 .sidebar { width: var(--bms-shell-sidebar-offset, var(--bms-sidebar-width)); box-sizing: border-box; border-right: 0; transition: width var(--bms-duration-standard) var(--bms-ease-standard); }
  /* Thanh đầu trang trượt cùng lúc với menu trái khi thu gọn/mở (anh Hiệp 2026-10-29: "bị giật 1 cái"): cùng thời lượng và easing với menu. */
  html:not(.bms-phone-v2) body.bms-opendesign-v8 .topbar { transition: left var(--bms-duration-standard) var(--bms-ease-standard); }
  html:not(.bms-phone-v2) body.bms-opendesign-v8 .app-shell, html:not(.bms-phone-v2) body.bms-opendesign-v8.sidebar-collapsed .app-shell { background: var(--bms-canvas); }
}