/* Brand overrides removed: hw-topnav.css = 100% copy from Document (flowchart). */

/* Tools hub = Hiring HwTopNav 100% (DOM classes + CSS from hiring styles.css) */

/* --- Center: exact hiring .hw-topnav .hw-page-tools cluster --- */
.hw-topnav .hw-page-tools,
.hw-topnav .hw-nav-tool-actions {
  display: inline-flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: flex-start;
  gap: 2px;
  width: max-content;
  max-width: none;
  min-width: max-content;
  position: relative;
  isolation: isolate;
  height: var(--chrome-pill-h, 40px);
  min-height: var(--chrome-pill-h, 40px);
  max-height: var(--chrome-pill-h, 40px);
  box-sizing: border-box;
  margin-left: auto;
  padding: 3px;
  border-radius: 14px;
  background: transparent;
  overflow: visible;
  pointer-events: auto;
}

.hw-topnav .hw-page-tools:empty,
.hw-topnav .hw-page-tools:empty::before,
.hw-topnav .hw-nav-tool-actions:empty,
.hw-topnav .hw-nav-tool-actions:empty::before {
  display: none !important;
}

.hw-topnav .hw-page-tools > *,
.hw-topnav .hw-page-tools .v-btn,
.hw-topnav .hw-page-tools .hw-date-btn,
.hw-topnav .hw-page-tools button,
.hw-topnav .hw-page-tools .v-field,
.hw-topnav .hw-nav-tool-actions > *,
.hw-topnav .hw-nav-tool-actions button,
.hw-topnav .hw-nav-tool-actions input,
.hw-topnav .hw-nav-tool-actions select,
.hw-topnav .hw-nav-tool-actions label {
  position: relative;
  z-index: 1;
}

.hw-topnav .hw-page-tools .hw-bar-cluster,
.hw-topnav .hw-page-tools .hw-day-nav,
.hw-topnav .hw-page-tools .hw-page-tools-row,
.hw-topnav .hw-page-tools .hw-mode-switch.v-btn-toggle {
  display: contents !important;
}

.hw-topnav .hw-page-tools .hw-project-view-btn,
.hw-topnav .hw-nav-tool-actions .hw-project-view-btn,
.hw-topnav .hw-nav-tool-actions .hw-nav-filter-btn,
.hw-topnav .hw-nav-tool-actions .hw-nav-segment,
.hw-topnav .hw-nav-tool-actions > .hw-btn {
  height: 34px !important;
  min-height: 34px !important;
  gap: 6px;
  padding: 0 12px !important;
  border: 0 !important;
  border-radius: 11px !important;
  background: transparent !important;
  color: #5c6b7a !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  letter-spacing: 0 !important;
  box-shadow: none !important;
}

.hw-topnav .hw-page-tools .hw-project-view-btn.is-open,
.hw-topnav .hw-nav-tool-actions .hw-project-view-btn.is-open,
.hw-topnav .hw-nav-tool-actions .hw-nav-filter-btn.is-open,
.hw-topnav .hw-nav-tool-actions .hw-nav-filter-btn.is-active,
.hw-topnav .hw-nav-tool-actions .hw-nav-segment.is-active {
  background: transparent !important;
  color: #17324d !important;
  box-shadow: none !important;
}

.hw-topnav .hw-nav-tool-actions > .hw-btn-primary {
  background: #0d9f90 !important;
  color: #fff !important;
  box-shadow: none !important;
}

.hw-topnav .hw-nav-tool-actions .hw-project-view-tab,
.hw-topnav .hw-page-tools .hw-project-view-tab {
  background: transparent !important;
  border-color: transparent !important;
  box-shadow: none !important;
}

.hw-topnav .hw-nav-tool-actions .hw-project-view-tab.is-active,
.hw-topnav .hw-page-tools .hw-project-view-tab.is-active {
  background: transparent !important;
  border-color: transparent !important;
  box-shadow: none !important;
  color: #0b8a7d !important;
}

.hw-topnav .hw-nav-tool-actions .hw-list-pill,
.hw-topnav .hw-page-tools .hw-list-pill {
  display: none !important;
}

/* Ô tìm kiếm trên topnav: luôn có border rõ */
.hw-topnav .hw-nav-tool-actions > .hw-nav-search,
.hw-topnav .hw-page-tools > .hw-nav-search,
.hw-topnav .hw-nav-tool-actions > .hw-cursor-chat-search-wrap,
.hw-topnav .hw-page-tools > .hw-cursor-chat-search-wrap,
.hw-topnav .hw-nav-tool-actions > .hw-dbt-sidebar-search-wrap,
.hw-topnav .hw-page-tools > .hw-dbt-sidebar-search-wrap {
  border: 1px solid #d5dee9 !important;
  border-radius: 11px !important;
  background: transparent !important;
  box-shadow: none !important;
  box-sizing: border-box !important;
}

.hw-topnav .hw-nav-tool-actions > .hw-nav-search:hover,
.hw-topnav .hw-page-tools > .hw-nav-search:hover,
.hw-topnav .hw-nav-tool-actions > .hw-cursor-chat-search-wrap:hover,
.hw-topnav .hw-page-tools > .hw-cursor-chat-search-wrap:hover,
.hw-topnav .hw-nav-tool-actions > .hw-dbt-sidebar-search-wrap:hover,
.hw-topnav .hw-page-tools > .hw-dbt-sidebar-search-wrap:hover {
  border-color: #c5d0de !important;
}

.hw-topnav .hw-nav-tool-actions > .hw-nav-search:focus-within,
.hw-topnav .hw-page-tools > .hw-nav-search:focus-within,
.hw-topnav .hw-nav-tool-actions > .hw-cursor-chat-search-wrap:focus-within,
.hw-topnav .hw-page-tools > .hw-cursor-chat-search-wrap:focus-within,
.hw-topnav .hw-nav-tool-actions > .hw-dbt-sidebar-search-wrap:focus-within,
.hw-topnav .hw-page-tools > .hw-dbt-sidebar-search-wrap:focus-within {
  border-color: rgba(13, 159, 144, 0.55) !important;
  box-shadow: 0 0 0 3px rgba(13, 159, 144, 0.12) !important;
}

.hw-topnav .hw-nav-tool-actions .hw-nav-search-input,
.hw-topnav .hw-page-tools .hw-nav-search-input,
.hw-topnav .hw-nav-tool-actions .hw-cursor-chat-search,
.hw-topnav .hw-page-tools .hw-cursor-chat-search,
.hw-topnav .hw-nav-tool-actions .hw-dbt-table-search,
.hw-topnav .hw-page-tools .hw-dbt-table-search,
.hw-topnav .hw-nav-tool-actions .hw-dbt-queries-search,
.hw-topnav .hw-page-tools .hw-dbt-queries-search {
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

.hw-topnav .hw-nav-center {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  min-width: 0;
  pointer-events: none;
}
.hw-topnav .hw-nav-center > * {
  pointer-events: auto;
}
.hw-topnav .hw-nav-center > .hw-page-tools-host {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  width: auto;
  min-width: 0;
  max-width: 100%;
  flex: 1 1 auto;
  margin-left: auto;
  pointer-events: auto;
  overflow-x: auto;
  overflow-y: hidden;
  overscroll-behavior-x: contain;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
  scrollbar-color: rgba(15, 35, 70, 0.28) transparent;
}
.hw-topnav .hw-nav-center > .hw-page-tools-host::-webkit-scrollbar {
  height: 4px;
}
.hw-topnav .hw-nav-center > .hw-page-tools-host::-webkit-scrollbar-thumb {
  background: rgba(15, 35, 70, 0.28);
  border-radius: 999px;
}
.hw-topnav .hw-nav-center > .hw-page-tools-host::-webkit-scrollbar-track {
  background: transparent;
}
.hw-page-tools-host:empty {
  display: none;
}

/* Page-tools: không nền pill — chỉ chips/controls */
.hw-topnav .hw-page-tools.hw-nav-tool-actions::before,
.hw-topnav .hw-page-tools::before,
.hw-topnav .hw-nav-tool-actions::before {
  content: none !important;
  display: none !important;
  background: none !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}
.hw-topnav .hw-nav-dock,
.hw-topnav .hw-nav-dock.hw-nav-links {
  align-items: flex-start !important;
  padding: 3px 8px 2px !important;
  gap: 6px !important;
  height: var(--chrome-pill-h, 40px) !important;
  min-height: var(--chrome-pill-h, 40px) !important;
  max-height: var(--chrome-pill-h, 40px) !important;
  box-sizing: border-box !important;
  border-radius: 16px !important;
  background: transparent !important;
}

.hw-topnav .hw-nav-right {
  gap: 2px !important;
  height: var(--chrome-pill-h, 40px) !important;
  min-height: var(--chrome-pill-h, 40px) !important;
  max-height: var(--chrome-pill-h, 40px) !important;
  box-sizing: border-box !important;
  padding: 0 4px !important;
  border-radius: 14px !important;
  background: transparent !important;
}

/* Never show JS liquid-glass layers on hiring chrome */
.hw-topnav .hw-nav-dock.hw-glass-host::before,
.hw-topnav .hw-nav-right.hw-glass-host::before {
  display: block !important;
}
.hw-topnav .hw-page-tools.hw-glass-host::before,
.hw-topnav .hw-nav-tool-actions.hw-glass-host::before {
  content: none !important;
  display: none !important;
}
/* brand nằm trong dock: không có nền riêng — 1 cụm như Hiring */


/* --- Dock magnification animation = Hiring 100% --- */
.hw-topnav .hw-nav-dock.hw-nav-links,
.hw-topnav .hw-nav-dock {
  overflow: visible !important;
}
.hw-topnav .hw-nav-dock-icon {
  transform-origin: 50% 0% !important;
}
.hw-topnav .hw-nav-dock .hw-nav-link.is-bounce .hw-nav-dock-icon {
  animation: none !important;
}


/* Dock magnify: never clip (backdrop-filter/radius must not hide icons) */
.hw-topnav,
.hw-topnav .hw-nav-dock,
.hw-topnav .hw-nav-dock.hw-nav-links,
.hw-topnav .hw-nav-link,
.hw-topnav .hw-nav-dock-icon,
.hw-topnav .hw-nav-dock-glyph {
  overflow: visible !important;
}
.hw-topnav .hw-nav-dock::before {
  /* glass stays pill-sized; icons paint above/outside */
  z-index: 0;
}
.hw-topnav .hw-nav-dock .hw-nav-dock-icon {
  transform-origin: 50% 0% !important;
}
.hw-topnav .hw-nav-dock.is-magnifying .hw-nav-dock-icon,
.hw-topnav .hw-nav-dock.is-hovering .hw-nav-dock-icon {
  transition: none !important;
}
.hw-topnav .hw-nav-dock.is-settling .hw-nav-dock-icon {
  transition: --hw-dock-scale 0.34s cubic-bezier(0.22, 1, 0.36, 1) !important;
}
.hw-topnav .hw-nav-dock.is-settling .hw-nav-link {
  transition: --hw-dock-shift 0.34s cubic-bezier(0.22, 1, 0.36, 1) !important;
}


/* ========== Hiring 3 clusters: dock | page-tools | account — NO bar background ========== */
.hw-topnav {
  display: grid !important;
  grid-template-columns: minmax(0, auto) minmax(0, 1fr) auto !important;
  grid-template-areas: "dock center account" !important;
  column-gap: 8px !important;
  align-items: center !important;
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  background: transparent !important;
  background-image: none !important;
  border: 0 !important;
  border-bottom: 0 !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

.hw-topnav::before,
.hw-topnav::after {
  content: none !important;
  display: none !important;
  background: none !important;
  box-shadow: none !important;
}

/* Keep menu out of the 3-column grid on desktop */
.hw-topnav > .hw-nav-menu-btn {
  grid-area: dock;
  justify-self: start;
}

@media (min-width: 901px) {
  .hw-topnav > .hw-nav-menu-btn {
    display: none !important;
  }
}

.hw-topnav > .hw-nav-dock {
  grid-area: dock !important;
  justify-self: start !important;
  width: auto !important;
  max-width: 100% !important;
  min-width: 0 !important;
  flex: 0 1 auto !important;
  background: transparent !important;
  overflow: hidden !important;
}

.hw-topnav > .hw-nav-center {
  grid-area: center !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  min-width: 0 !important;
  width: auto !important;
  max-width: 100% !important;
  background: transparent !important;
  box-shadow: none !important;
  border: 0 !important;
  pointer-events: none !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
}

.hw-topnav > .hw-nav-center::before,
.hw-topnav > .hw-nav-center::after {
  content: none !important;
  display: none !important;
}

.hw-topnav > .hw-nav-end {
  grid-area: account !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  width: auto !important;
  max-width: none !important;
  min-width: max-content !important;
  flex: 0 0 auto !important;
  background: transparent !important;
  box-shadow: none !important;
  border: 0 !important;
  pointer-events: none !important;
  overflow: visible !important;
}

.hw-topnav > .hw-nav-end::before,
.hw-topnav > .hw-nav-end::after {
  content: none !important;
  display: none !important;
}

.hw-topnav > .hw-nav-end > .hw-nav-right {
  pointer-events: auto !important;
  width: max-content !important;
  flex: 0 0 auto !important;
  margin-left: 0 !important;
  background: transparent !important;
}

.hw-topnav > .hw-nav-center > .hw-page-tools-host {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  pointer-events: auto !important;
  width: auto !important;
  min-width: 0 !important;
  max-width: 100% !important;
  margin-left: auto !important;
  flex: 1 1 auto !important;
  overflow-x: auto !important;
  overflow-y: hidden !important;
  background: transparent !important;
}
.hw-topnav > .hw-nav-center > .hw-page-tools,
.hw-topnav > .hw-nav-center > .hw-nav-tool-actions {
  pointer-events: auto !important;
  width: max-content !important;
  min-width: max-content !important;
  max-width: none !important;
  margin-left: auto !important;
  flex: 0 0 auto !important;
  justify-content: flex-start !important;
  background: transparent !important;
  flex-wrap: nowrap !important;
  overflow: visible !important;
}

/* Only the 3 clusters paint glass — never wrappers / topnav / brand-in-dock */
.hw-topnav .hw-nav-center,
.hw-topnav .hw-nav-end,
.hw-topnav .hw-page-tools-host,
.hw-topnav .hw-nav-page-context,
.hw-topnav .hw-nav-tool-status {
  background: transparent !important;
  box-shadow: none !important;
}

/* Ensure each cluster glass is isolated (separate pill) */
.hw-topnav .hw-nav-dock,
.hw-topnav .hw-nav-right,
.hw-topnav .hw-page-tools.hw-nav-tool-actions,
.hw-topnav .hw-page-tools {
  position: relative !important;
  isolation: isolate !important;
  background: transparent !important;
}


/* Tasks chips — không nền trắng; chỉ highlight khi open/active */
.hw-topnav .hw-nav-tool-actions .hw-project-view-btn,
.hw-topnav .hw-page-tools .hw-project-view-btn {
  display: inline-flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px !important;
  width: auto !important;
  max-width: none !important;
  height: 34px !important;
  min-height: 34px !important;
  max-height: 34px !important;
  margin: 0 !important;
  padding: 0 10px !important;
  border: 0 !important;
  border-radius: 10px !important;
  background: transparent !important;
  color: #1a2433 !important;
  box-shadow: none !important;
  font: inherit !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  line-height: 1 !important;
  white-space: nowrap !important;
  overflow: visible !important;
  vertical-align: middle !important;
}
.hw-topnav .hw-nav-tool-actions .hw-project-view-btn > span,
.hw-topnav .hw-page-tools .hw-project-view-btn > span {
  display: inline-block !important;
  flex: 0 0 auto !important;
  min-width: 0 !important;
  line-height: 1 !important;
  white-space: nowrap !important;
}
.hw-topnav .hw-nav-tool-actions .hw-project-view-btn > svg,
.hw-topnav .hw-page-tools .hw-project-view-btn > svg {
  display: block !important;
  flex: 0 0 16px !important;
  width: 16px !important;
  height: 16px !important;
  margin: 0 !important;
  opacity: 0.7;
}
.hw-topnav .hw-nav-tool-actions .hw-project-view-btn.is-open,
.hw-topnav .hw-nav-tool-actions .hw-project-view-btn.is-active,
.hw-topnav .hw-page-tools .hw-project-view-btn.is-open,
.hw-topnav .hw-page-tools .hw-project-view-btn.is-active {
  color: #0b8a7d !important;
  background: transparent !important;
  box-shadow: none !important;
}
.hw-topnav .hw-nav-tool-actions .hw-page-tools-summary,
.hw-topnav .hw-page-tools .hw-page-tools-summary {
  color: #0b8a7d !important;
  font-weight: 700 !important;
  margin: 0 !important;
}
.hw-topnav .hw-nav-tool-actions .hw-project-view-btn.is-primary {
  background: transparent !important;
  color: #0b8a7d !important;
  box-shadow: none !important;
  font-weight: 700 !important;
}
.hw-topnav .hw-nav-tool-actions .hw-project-view-btn.is-primary svg {
  display: none !important;
}



/* dock-cluster-hiring-v3 — copy Hiring live dock: 1 pill, flex-start, chrome-pill-h */
.hw-topnav .hw-nav-dock,
.hw-topnav .hw-nav-dock.hw-nav-links,
.hw-topnav .hw-nav-dock.hw-glass-host {
  position: relative !important;
  isolation: isolate !important;
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  align-items: flex-start !important;
  padding: 4px 8px !important;
  gap: 6px !important;
  height: var(--chrome-pill-h, 40px) !important;
  min-height: var(--chrome-pill-h, 40px) !important;
  max-height: var(--chrome-pill-h, 40px) !important;
  border: 0 !important;
  border-radius: 16px !important;
  background: transparent !important;
  box-shadow: none !important;
  overflow: visible !important;
}
.hw-topnav .hw-nav-dock::before,
.hw-topnav .hw-nav-dock.hw-glass-host::before,
.hw-topnav .hw-nav-links.hw-nav-dock::before {
  content: "" !important;
  display: block !important;
  position: absolute !important;
  z-index: 0 !important;
  inset: 0 !important;
  border-radius: inherit !important;
  pointer-events: none !important;
  background:
    radial-gradient(120% 80% at 50% 40%, rgba(255,255,255,0.72) 0%, transparent 58%),
    linear-gradient(180deg, rgba(255,255,255,0.96) 0%, rgba(240,245,250,0.94) 100%) !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,1),
    inset 0 -1px 0 rgba(255,255,255,0.4),
    0 0 0 1px rgba(15,23,42,0.12),
    0 1px 2px rgba(15,23,42,0.05),
    0 8px 18px rgba(15,23,42,0.08) !important;
}

/* Brand type = Hiring live (dist): compact HEAD/AY + title */

@media (max-width: 1280px) {
  .hw-topnav .hw-nav-dock,
  .hw-topnav .hw-nav-dock.hw-nav-links,
  .hw-topnav .hw-nav-dock.hw-glass-host {
    --hw-dock-base: 28px;
    padding: 4px 6px !important;
    gap: 4px !important;
  }
}

/* right-edge-never-crop-v3 — override cuối: avatar/account không bị cắt */
body.hw-shell .hw-topnav {
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  overflow: visible !important;
  grid-template-columns: minmax(0, auto) minmax(0, 1fr) max-content !important;
}
body.hw-shell .hw-topnav > .hw-nav-end,
body.hw-shell .hw-topnav > .hw-nav-end > .hw-nav-right,
body.hw-shell .hw-topnav .hw-nav-right {
  max-width: none !important;
  min-width: max-content !important;
  width: max-content !important;
  overflow: visible !important;
  flex-shrink: 0 !important;
}
body.hw-shell .hw-topnav hw-account,
body.hw-shell .hw-topnav .hw-nav-user,
body.hw-shell .hw-topnav .hw-nav-user-avatar,
body.hw-shell .hw-topnav .hw-nav-notif,
body.hw-shell .hw-topnav .hw-nav-autohide-btn {
  max-width: none !important;
  overflow: visible !important;
  flex-shrink: 0 !important;
}
body.hw-shell .hw-topnav > .hw-nav-center,
body.hw-shell .hw-topnav .hw-page-tools-host,
body.hw-shell .hw-topnav .hw-page-tools,
body.hw-shell .hw-topnav .hw-nav-tool-actions {
  min-width: 0 !important;
  max-width: 100% !important;
}


/* safari-dock-one-cluster-v1 — ép 1 cụm trên Safari kể cả reduce-transparency */
@supports (-webkit-hyphens: none) {
  .hw-topnav .hw-nav-dock::before,
  .hw-topnav .hw-nav-dock.hw-glass-host::before {
    content: "" !important;
    display: block !important;
  }
}

/* never clip dock icons (override mid-file overflow:hidden) */
.hw-topnav > .hw-nav-dock,
.hw-topnav .hw-nav-dock.hw-nav-links {
  overflow: visible !important;
}

/* dock-border-hiring-v1 — host không vẽ ring riêng; ::before (Chrome) hoặc border host (Safari) */
.hw-topnav .hw-nav-dock,
.hw-topnav .hw-nav-dock.hw-nav-links,
.hw-topnav .hw-nav-dock.hw-glass-host {
  background: transparent !important;
}
.hw-topnav .hw-nav-dock > .hw-glass-layers,
.hw-topnav .hw-nav-dock.hw-glass-host > .hw-glass-layers {
  display: none !important;
}
.hw-topnav .hw-nav-dock::before,
.hw-topnav .hw-nav-dock.hw-glass-host::before,
.hw-topnav .hw-nav-links.hw-nav-dock::before {
  content: "" !important;
  display: block !important;
  position: absolute !important;
  z-index: 0 !important;
  inset: 0 !important;
  border-radius: inherit !important;
  pointer-events: none !important;
  background:
    radial-gradient(
      120% 80% at var(--hw-glass-x, 50%) var(--hw-glass-y, 40%),
      rgba(255, 255, 255, 0.72) 0%,
      transparent 58%
    ),
    linear-gradient(180deg, rgba(255, 255, 255, 0.96) 0%, rgba(240, 245, 250, 0.94) 100%) !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 1),
    inset 0 -1px 0 rgba(255, 255, 255, 0.4),
    0 0 0 1px rgba(15, 23, 42, 0.12),
    0 1px 2px rgba(15, 23, 42, 0.05),
    0 8px 18px rgba(15, 23, 42, 0.08) !important;
}

/* dock-border-browser-parity — use the Safari host border in every browser. */
  .hw-topnav .hw-nav-dock,
  .hw-topnav .hw-nav-dock.hw-nav-links,
  .hw-topnav .hw-nav-dock.hw-glass-host,
  body.hw-shell .hw-topnav .hw-nav-dock {
    border: 1px solid rgba(15, 23, 42, 0.12) !important;
    background:
      radial-gradient(120% 80% at 50% 40%, rgba(255, 255, 255, 0.72) 0%, transparent 58%),
      linear-gradient(180deg, rgba(255, 255, 255, 0.96) 0%, rgba(240, 245, 250, 0.94) 100%) !important;
    box-shadow:
      inset 0 1px 0 rgba(255, 255, 255, 1),
      inset 0 -1px 0 rgba(255, 255, 255, 0.4),
      0 1px 2px rgba(15, 23, 42, 0.05),
      0 8px 18px rgba(15, 23, 42, 0.08) !important;
  }
  .hw-topnav .hw-nav-dock::before,
  .hw-topnav .hw-nav-dock.hw-glass-host::before,
  .hw-topnav .hw-nav-links.hw-nav-dock::before {
    /* fill đã nằm trên host — ::before chỉ giữ inset highlight, không vẽ ring ngoài bị Safari cắt */
    content: "" !important;
    display: block !important;
    background: transparent !important;
    background-image: none !important;
    box-shadow: none !important;
    border: 0 !important;
  }

/* page-loader brand = Document HwLoader + flowchart fix-brand-text-align-v4 */
.hw-page-loader-brand {
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
}
.hw-page-loader-brand .kicker,
.hw-page-loader-brand strong {
  display: inline-flex !important;
  align-items: center !important;
  height: 24px !important;
  line-height: 24px !important;
  margin: 0 !important;
  padding: 0 !important;
}
.hw-page-loader-brand .kicker {
  font-size: 15px !important;
  letter-spacing: 0.08em !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  color: var(--accent-strong, #0d9f90) !important;
}
.hw-page-loader-brand strong {
  font-size: 18px !important;
  letter-spacing: -0.02em !important;
  font-weight: 700 !important;
  margin-left: 4px !important;
  color: var(--text, #1a2433) !important;
  white-space: nowrap !important;
}
.hw-page-loader-brand .hw-brand-mark {
  width: 28px !important;
  height: 24px !important;
  object-fit: contain !important;
  align-self: center !important;
  flex: 0 0 28px !important;
  transform: none !important;
  filter: none !important;
  opacity: 1 !important;
}

/* theme-dark-glass-chrome-v2 — pill dock/account tối (thắng !important light) */
html[data-hw-theme="dark"] {
  --hw-glass-fill: rgba(26, 34, 45, 0.94);
  --hw-glass-fill-thick: rgba(26, 34, 45, 0.97);
  --hw-glass-stroke: rgba(255, 255, 255, 0.1);
  --hw-glass-stroke-outer: rgba(0, 0, 0, 0.4);
  --hw-glass-shadow:
    0 8px 24px rgba(0, 0, 0, 0.32),
    inset 0 1px 0 rgba(255, 255, 255, 0.08);
  --hw-glass-shadow-float:
    0 16px 40px rgba(0, 0, 0, 0.42),
    inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

html[data-hw-theme="dark"] .hw-brand::before,
html[data-hw-theme="dark"] .hw-nav-right::before,
html[data-hw-theme="dark"] .hw-nav-theme::before,
html[data-hw-theme="dark"] .hw-nav-dock::before,
html[data-hw-theme="dark"] .hw-nav-menu-btn::before,
html[data-hw-theme="dark"] .hw-topnav .hw-brand::before,
html[data-hw-theme="dark"] .hw-topnav .hw-nav-right::before,
html[data-hw-theme="dark"] .hw-topnav .hw-nav-theme::before,
html[data-hw-theme="dark"] .hw-topnav .hw-nav-dock::before,
html[data-hw-theme="dark"] .hw-topnav .hw-nav-dock.hw-glass-host::before,
html[data-hw-theme="dark"] .hw-topnav .hw-nav-links.hw-nav-dock::before,
html[data-hw-theme="dark"] .hw-topnav .hw-nav-menu-btn::before {
  background:
    radial-gradient(
      120% 80% at var(--hw-glass-x, 50%) var(--hw-glass-y, 40%),
      rgba(255, 255, 255, 0.08) 0%,
      transparent 58%
    ),
    linear-gradient(180deg, rgba(36, 48, 65, 0.98) 0%, rgba(22, 30, 42, 0.96) 100%) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.1),
    inset 0 -1px 0 rgba(0, 0, 0, 0.28),
    0 0 0 1px rgba(255, 255, 255, 0.12),
    0 1px 2px rgba(0, 0, 0, 0.25),
    0 8px 18px rgba(0, 0, 0, 0.35) !important;
  border-color: rgba(255, 255, 255, 0.12) !important;
}

html[data-hw-theme="dark"] .hw-brand.hw-glass-host .hw-glass-tint,
html[data-hw-theme="dark"] .hw-nav-right.hw-glass-host .hw-glass-tint,
html[data-hw-theme="dark"] .hw-nav-theme.hw-glass-host .hw-glass-tint,
html[data-hw-theme="dark"] .hw-nav-menu-btn.hw-glass-host .hw-glass-tint,
html[data-hw-theme="dark"] .hw-nav-dock.hw-glass-host .hw-glass-tint,
html[data-hw-theme="dark"] .hw-topnav .hw-nav-dock.hw-glass-host .hw-glass-tint,
html[data-hw-theme="dark"] .hw-topnav .hw-nav-right.hw-glass-host .hw-glass-tint {
  background:
    radial-gradient(
      130% 90% at var(--hw-glass-x, 50%) var(--hw-glass-y, 40%),
      rgba(255, 255, 255, 0.08) 0%,
      transparent 56%
    ),
    linear-gradient(180deg, rgba(36, 48, 65, 0.98), rgba(22, 30, 42, 0.96)) !important;
}

html[data-hw-theme="dark"] .hw-brand.hw-glass-host,
html[data-hw-theme="dark"] .hw-nav-right.hw-glass-host,
html[data-hw-theme="dark"] .hw-nav-theme.hw-glass-host,
html[data-hw-theme="dark"] .hw-nav-menu-btn.hw-glass-host,
html[data-hw-theme="dark"] .hw-nav-dock.hw-glass-host {
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.1),
    0 0 0 1px rgba(255, 255, 255, 0.12),
    0 8px 18px rgba(0, 0, 0, 0.35) !important;
  border-color: rgba(255, 255, 255, 0.12) !important;
}

html[data-hw-theme="dark"] .hw-brand .kicker {
  color: #14b8a6 !important;
}
html[data-hw-theme="dark"] .hw-brand .hw-brand-title,
html[data-hw-theme="dark"] .hw-brand strong {
  color: #e8eef5 !important;
}
html[data-hw-theme="dark"] .hw-nav-link,
html[data-hw-theme="dark"] .hw-nav-dock-glyph,
html[data-hw-theme="dark"] .hw-nav-autohide-btn,
html[data-hw-theme="dark"] .hw-nav-notif,
html[data-hw-theme="dark"] .hw-nav-theme-btn {
  color: #9aa8b8 !important;
}
html[data-hw-theme="dark"] .hw-nav-link.is-active,
html[data-hw-theme="dark"] .hw-nav-link.is-hot,
html[data-hw-theme="dark"] .hw-nav-notif.has-unread,
html[data-hw-theme="dark"] .hw-nav-theme-btn.is-dark {
  color: #14b8a6 !important;
}
html[data-hw-theme="dark"] hw-account .hw-nav-user {
  color: #9aa8b8 !important;
}
html[data-hw-theme="dark"] hw-account .hw-nav-user strong {
  color: #e8eef5 !important;
}


/* dark-mode-tools-search-v1 — giống Hiring dark search (border #2a3545, không #d5dee9) */
html[data-hw-theme="dark"] .hw-topnav .hw-nav-tool-actions > .hw-nav-search,
html[data-hw-theme="dark"] .hw-topnav .hw-page-tools > .hw-nav-search,
html[data-hw-theme="dark"] .hw-topnav .hw-nav-tool-actions > .hw-cursor-chat-search-wrap,
html[data-hw-theme="dark"] .hw-topnav .hw-page-tools > .hw-cursor-chat-search-wrap,
html[data-hw-theme="dark"] .hw-topnav .hw-nav-tool-actions > .hw-dbt-sidebar-search-wrap,
html[data-hw-theme="dark"] .hw-topnav .hw-page-tools > .hw-dbt-sidebar-search-wrap {
  border: 1px solid var(--border, #2a3545) !important;
  background: var(--bg-elevated, #1a222d) !important;
  box-shadow: none !important;
}

html[data-hw-theme="dark"] .hw-topnav .hw-nav-tool-actions > .hw-nav-search:hover,
html[data-hw-theme="dark"] .hw-topnav .hw-page-tools > .hw-nav-search:hover,
html[data-hw-theme="dark"] .hw-topnav .hw-nav-tool-actions > .hw-cursor-chat-search-wrap:hover,
html[data-hw-theme="dark"] .hw-topnav .hw-page-tools > .hw-cursor-chat-search-wrap:hover,
html[data-hw-theme="dark"] .hw-topnav .hw-nav-tool-actions > .hw-dbt-sidebar-search-wrap:hover,
html[data-hw-theme="dark"] .hw-topnav .hw-page-tools > .hw-dbt-sidebar-search-wrap:hover {
  border-color: var(--border-hover, #3a4658) !important;
}

html[data-hw-theme="dark"] .hw-topnav .hw-nav-tool-actions > .hw-nav-search:focus-within,
html[data-hw-theme="dark"] .hw-topnav .hw-page-tools > .hw-nav-search:focus-within,
html[data-hw-theme="dark"] .hw-topnav .hw-nav-tool-actions > .hw-cursor-chat-search-wrap:focus-within,
html[data-hw-theme="dark"] .hw-topnav .hw-page-tools > .hw-cursor-chat-search-wrap:focus-within,
html[data-hw-theme="dark"] .hw-topnav .hw-nav-tool-actions > .hw-dbt-sidebar-search-wrap:focus-within,
html[data-hw-theme="dark"] .hw-topnav .hw-page-tools > .hw-dbt-sidebar-search-wrap:focus-within {
  border-color: rgba(13, 159, 144, 0.55) !important;
  box-shadow: 0 0 0 3px rgba(13, 159, 144, 0.16) !important;
}

html[data-hw-theme="dark"] .hw-topnav .hw-nav-tool-actions .hw-nav-search-input,
html[data-hw-theme="dark"] .hw-topnav .hw-page-tools .hw-nav-search-input,
html[data-hw-theme="dark"] .hw-topnav .hw-nav-tool-actions .hw-cursor-chat-search,
html[data-hw-theme="dark"] .hw-topnav .hw-page-tools .hw-cursor-chat-search,
html[data-hw-theme="dark"] .hw-topnav .hw-nav-tool-actions .hw-dbt-table-search,
html[data-hw-theme="dark"] .hw-topnav .hw-page-tools .hw-dbt-table-search,
html[data-hw-theme="dark"] .hw-topnav .hw-nav-tool-actions .hw-dbt-queries-search,
html[data-hw-theme="dark"] .hw-topnav .hw-page-tools .hw-dbt-queries-search {
  color: var(--text, #e8eef5) !important;
  -webkit-text-fill-color: var(--text, #e8eef5) !important;
  background: transparent !important;
}

html[data-hw-theme="dark"] .hw-topnav .hw-nav-tool-actions .hw-nav-search-input::placeholder,
html[data-hw-theme="dark"] .hw-topnav .hw-page-tools .hw-nav-search-input::placeholder,
html[data-hw-theme="dark"] .hw-topnav .hw-nav-tool-actions .hw-cursor-chat-search::placeholder,
html[data-hw-theme="dark"] .hw-topnav .hw-page-tools .hw-cursor-chat-search::placeholder {
  color: var(--text-muted, #9aa8b8) !important;
  opacity: 1 !important;
}

/* loader-logo-sync — màn loading cùng logo xanh, không bóp còn ô vuông */
.hw-page-loader-brand img.hw-brand-logo,
.hw-ehiring-gate .hw-page-loader-brand img.hw-brand-logo,
.hw-ehiring-gate.is-screen .hw-page-loader-brand img.hw-brand-logo,
.hw-page-loader .hw-page-loader-brand img.hw-brand-logo,
.hw-page-loader.is-screen .hw-page-loader-brand img.hw-brand-logo,
.hw-brand-loader .hw-page-loader-brand img.hw-brand-logo,
.hw-brand-loader.is-screen .hw-page-loader-brand img.hw-brand-logo,
.hw-fill-loader .hw-page-loader-brand img.hw-brand-logo,
.hw-table-loader .hw-page-loader-brand img.hw-brand-logo {
  display: block !important;
  width: 220px !important;
  height: auto !important;
  max-width: min(220px, 78vw) !important;
  max-height: none !important;
  flex: 0 0 auto !important;
  aspect-ratio: auto !important;
  object-fit: contain !important;
  object-position: center !important;
  margin: 0 !important;
  padding: 0 !important;
  transform: none !important;
  border-radius: 0 !important;
}
.hw-kanban-more-status.hw-page-loader-brand img.hw-brand-logo {
  width: 140px !important;
  max-width: 100% !important;
}
.hw-ehiring-gate.is-screen .hw-page-loader-brand,
.hw-page-loader.is-screen .hw-page-loader-brand,
.hw-brand-loader.is-screen .hw-page-loader-brand {
  flex-direction: column !important;
  gap: 12px !important;
}
.hw-ehiring-gate.is-screen .hw-page-loader-brand strong,
.hw-page-loader.is-screen .hw-page-loader-brand strong,
.hw-brand-loader.is-screen .hw-page-loader-brand strong {
  height: auto !important;
  margin: 0 !important;
  font-size: 16px !important;
  line-height: 1.2 !important;
  letter-spacing: 0.02em !important;
}