/* Headway UI — table + page chrome (from hiring styles.css) */

/* --- L79-L150 --- */
.hw-page-tools-host:empty {
  display: none;
}

.hw-page-tools {
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding: 6px 8px;
  background: var(--surface);
  border-radius: var(--frame-radius, 14px);
}

.hw-page-tools > .v-btn {
  width: 100%;
  flex: none;
}

.hw-page-tools .v-input,
.hw-page-tools .hw-date-field {
  width: 100%;
  max-width: none !important;
  flex: none;
}

.hw-dept-select .v-field__input,
.hw-multi-filter .v-field__input {
  flex-wrap: nowrap;
}

.hw-dept-select .v-select__selection,
.hw-multi-filter .v-select__selection,
.hw-multi-filter .v-autocomplete__selection,
.hw-dept-selection {
  display: block;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.hw-multi-check {
  pointer-events: none;
}

.hw-page-tools .hw-mode-switch {
  width: 100%;
  flex: none;
}

.hw-page-tools .hw-mode-switch .v-btn {
  flex: 1;
  min-width: 0;
}

.hw-page-tools .hw-page-actions {
  display: flex;
  flex-direction: column;
  gap: 8px;
  width: 100%;
}

.hw-page-tools .hw-page-tools-row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.hw-page-tools .hw-page-tools-row > .v-btn {
  flex: 1;
  min-width: 0;
}

/* --- L300-L400 --- */
.hw-table-wrap {
  position: relative;
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 12px;
  overflow: hidden;
}

.hw-table-wrap.hw-overview-wrap {
  border: none;
  border-radius: 0;
  background: transparent;
  margin-bottom: 16px;
}

.hw-overview-wrap .hw-overview-body {
  padding: 0;
  flex: 1;
  min-height: 0;
}

.hw-page > .v-alert {
  flex: none;
}

.hw-table-wrap .v-data-table {
  display: flex;
  flex-direction: column;
  flex: 1;
  min-height: 0;
  height: 100%;
  background: transparent;
}

.hw-table-wrap .v-table {
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
  min-height: 0;
  background: transparent;
}

.hw-table-wrap .v-table__wrapper {
  flex: 1 1 auto;
  overflow: auto !important;
}

.hw-table-wrap .v-table table {
  width: max-content;
  min-width: 100%;
  table-layout: auto;
}

.hw-table-wrap .hw-project-table-scroll {
  flex: 1 1 auto;
  min-width: 0;
  min-height: 0;
  height: 100%;
  overflow: auto !important;
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
}

hw-data-table.hw-table-wrap,
div.hw-table-wrap {
  display: flex !important;
  flex-direction: column !important;
  flex: 1 1 auto !important;
  min-height: 0 !important;
  align-self: stretch;
}

.hw-table-wrap table.hw-shared-table {
  width: max-content;
  min-width: 100%;
  border-collapse: separate;
  border-spacing: 0;
}

/* hw-table-spacing-v3-20261015 */
.hw-table-wrap table.hw-shared-table th,
.hw-table-wrap table.hw-shared-table td {
  box-sizing: border-box;
  white-space: nowrap;
  text-align: left;
  vertical-align: middle;
}

.hw-table-wrap table.hw-shared-table thead th {
  position: sticky;
  top: 0;
  z-index: 2;
  height: 48px !important;
  min-height: 48px !important;
  max-height: none !important;
  padding: 12px 18px !important;
  background: #e8eef5 !important;
  color: #4a5d73 !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  letter-spacing: 0.01em !important;
  text-transform: none !important;
  border-bottom: 2px solid #d5dee9 !important;
}

.hw-table-wrap table.hw-shared-table tbody td {
  height: var(--hw-fit-row, 52px) !important;
  min-height: 52px !important;
  padding: 12px 18px !important;
  background: var(--surface, #fff);
  color: var(--text, #1a2433);
  font-size: 13px !important;
  font-weight: 400;
  border-bottom: 1px solid #e4ebf4 !important;
}

.hw-table-wrap table.hw-shared-table tbody tr:nth-child(even) > td {
  background: #f7f9fc;
}

.hw-table-wrap table.hw-shared-table tbody td .v-chip {
  margin: 0;
  vertical-align: middle;
}

.hw-table-wrap .v-data-table th,
.hw-table-wrap .v-data-table td {
  white-space: nowrap;
}

.hw-table-wrap .v-data-table-footer {
  flex-shrink: 0;
  border-top: 1px solid var(--border);
}

.hw-table-wrap .v-data-table tbody tr,
.hw-table-wrap table.hw-shared-table tbody tr {
  cursor: pointer;
}

.hw-table-wrap .v-data-table tbody tr:hover > td,
.hw-table-wrap .v-data-table .v-data-table__tr:hover > td,
.hw-table-wrap .v-table tbody tr:hover > td,
.hw-table-wrap table.hw-shared-table tbody tr:hover > td {
  background: rgba(0, 80, 145, 0.1) !important;
}

/* --- L3970-L4125 --- */
.hw-project-view-btn {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  height: var(--ctrl-h, 34px);
  min-height: var(--ctrl-h, 34px);
  max-height: var(--ctrl-h, 34px);
  padding: 0 12px;
  border: 0;
  border-radius: 10px;
  background: var(--surface, #fff);
  color: #1a2433;
  box-shadow: inset 0 0 0 1px #d5dee9;
  font: inherit;
  font-size: var(--ctrl-fs, 13px);
  font-weight: var(--ctrl-fw, 600);
  line-height: 1.25;
  white-space: nowrap;
  cursor: pointer;
}

.hw-project-view-btn.is-open,
.hw-project-view-btn.is-active {
  color: #004478;
  background: #f3f7fb;
  box-shadow: inset 0 0 0 1.5px rgba(0, 80, 145, 0.45);
}

.v-menu > .v-overlay__content.hw-project-view-overlay,
.v-menu > .v-overlay__content.hw-project-view-suboverlay {
  overflow: visible !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  padding: 0 !important;
}

.hw-project-view-menu {
  width: auto;
  min-width: 0;
  padding: 0;
  background: transparent;
  box-shadow: none;
}

.hw-project-view-submenu {
  min-width: 180px;
  max-width: 280px;
  padding: 6px;
  background: var(--surface, #fff);
  border-radius: 10px;
  box-shadow: 0 12px 32px rgba(15, 35, 70, 0.14);
}

.hw-project-view-submenu.is-scroll {
  max-height: 280px;
  overflow-y: auto;
}

.hw-project-view-submenu-split {
  height: 1px;
  margin: 4px 6px;
  background: #eaeef2;
}

.hw-project-view-search-wrap {
  padding: 2px 6px 8px;
}

.hw-project-view-search {
  display: block;
  width: 100%;
  height: 34px;
  padding: 0 10px;
  border: 1px solid #d0d7de;
  border-radius: 8px;
  background: var(--surface, #fff);
  color: #1f2328;
  font: inherit;
  font-size: 13px;
  outline: none;
  box-sizing: border-box;
}

.hw-project-view-search::placeholder {
  color: #656d76;
}

.hw-project-view-search:focus {
  border-color: #005091;
  box-shadow: 0 0 0 3px rgba(0, 80, 145, 0.12);
}

.hw-project-view-search::-webkit-search-cancel-button {
  cursor: pointer;
}

.hw-project-view-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  width: 100%;
  padding: 8px 10px;
  border: none;
  border-radius: 6px;
  background: transparent;
  color: #1f2328;
  font: inherit;
  font-size: 13px;
  text-align: left;
  cursor: pointer;
}

.hw-project-view-item:hover {
  background: #f6f8fa;
}

.hw-project-view-item.is-active {
  background: #eef2f6;
  font-weight: 600;
}

.hw-project-view-item.is-danger {
  color: #cf222e;
}

.hw-project-view-item-meta {
  display: inline-flex;
  align-items: center;
  gap: 2px;
  color: #656d76;
  font-size: 12px;
  font-weight: 400;
}

.hw-project-view-dates {
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 4px 6px 2px;
}

.hw-project-view-dates .hw-date-field,
.hw-project-view-dates .v-input {
  width: 100%;
  max-width: none;
}

.hw-project-view-empty {
  margin: 4px 10px 8px;
  color: #656d76;
  font-size: 13px;
}

.hw-project-view-menu .v-divider {
  margin-top: 4px;
  margin-bottom: 4px;
  opacity: 1;
  border-color: #d0d7de;
  color: #d0d7de;
}

/* --- L4428-L4475 --- */
.hw-table-wrap:not(.hw-overview-wrap):not(.hw-settings-wrap) {
  border-radius: 14px !important;
}

.hw-table-wrap .v-data-table thead th,
.hw-table-wrap .v-table thead th {
  height: 48px !important;
  background: #e8eef5 !important;
  color: #4a5d73 !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  letter-spacing: 0.01em !important;
  text-transform: none !important;
  text-align: left !important;
  padding: 12px 18px !important;
  border-bottom: 2px solid var(--border) !important;
}

.hw-table-wrap .v-data-table tbody td,
.hw-table-wrap .v-table tbody td {
  height: 52px !important;
  padding: 12px 18px !important;
  background: var(--surface, #fff);
  color: var(--text);
  font-size: 13px !important;
  font-weight: 400;
  border-bottom: 1px solid #e4ebf4 !important;
  text-align: left !important;
  vertical-align: middle;
}

.hw-table-wrap .v-data-table tbody tr.is-selected > td,
.hw-table-wrap .v-data-table tbody tr.v-data-table__selected > td {
  background: rgba(0, 80, 145, 0.14) !important;
}

.hw-table-wrap .v-data-table-footer {
  color: var(--text-muted);
  border-top: 1px solid var(--border) !important;
}

.hw-project-toolbar.is-hub-lifted {
  position: absolute;
  top: 8px;
  left: 50%;
  z-index: 4;
  width: max-content;
  height: 0;
  margin: 0;
  padding: 0;
  overflow: visible;
  background: transparent;
  border: 0;
  pointer-events: none;
  transform: translateX(-50%);
}

.hw-project-toolbar.is-hub-lifted .hw-project-view-btn {
  pointer-events: auto;
}

.hw-page:has(.hw-table-wrap:not(.hw-overview-wrap):not(.hw-settings-wrap)) {
  padding: 0;
  background: transparent;
}

.hw-table-wrap:not(.hw-overview-wrap):not(.hw-settings-wrap) {
  flex: 1;
  min-width: 0;
  min-height: 0;
  width: auto;
  max-width: calc(100% - (var(--frame-margin-x, 16px) * 2));
  margin: var(--frame-margin-top, 12px) var(--frame-margin-x, 16px) var(--frame-margin-bottom, 16px);
  display: flex;
  flex-direction: column;
  overflow: hidden;
  background: var(--surface, #fff) !important;
  border: 1px solid var(--border, #d5dee9) !important;
  border-radius: var(--frame-radius, 14px) !important;
  box-shadow: none !important;
  --v-table-header-height: 48px;
  --v-table-row-height: 52px;
}

/* dark-mode-chrome-table-v2 — bảng shared: nền đen chữ trắng */
html[data-hw-theme="dark"] .hw-table-wrap,
html[data-hw-theme="dark"] .hw-table-wrap:not(.hw-overview-wrap):not(.hw-settings-wrap) {
  background: #1a222d !important;
  border-color: #2a3545 !important;
}

html[data-hw-theme="dark"] .hw-table-wrap .v-data-table thead th,
html[data-hw-theme="dark"] .hw-table-wrap .v-table thead th,
html[data-hw-theme="dark"] .hw-table-wrap table.hw-shared-table thead th {
  background: #141a22 !important;
  color: #e8eef5 !important;
  border-bottom-color: #2a3545 !important;
}

html[data-hw-theme="dark"] .hw-table-wrap .v-data-table tbody td,
html[data-hw-theme="dark"] .hw-table-wrap .v-table tbody td,
html[data-hw-theme="dark"] .hw-table-wrap table.hw-shared-table tbody td {
  background: #1a222d !important;
  color: #e8eef5 !important;
  border-bottom-color: #2a3545 !important;
}

html[data-hw-theme="dark"] .hw-table-wrap table.hw-shared-table tbody tr:nth-child(even) > td {
  background: #141a22 !important;
}

html[data-hw-theme="dark"] .hw-table-wrap .v-data-table tbody tr:hover > td,
html[data-hw-theme="dark"] .hw-table-wrap table.hw-shared-table tbody tr:hover > td {
  background: rgba(0, 80, 145, 0.18) !important;
}

html[data-hw-theme="dark"] .hw-table-wrap .v-data-table-footer {
  background: #141a22 !important;
  color: #9aa8b8 !important;
  border-top-color: #2a3545 !important;
}

/* dark-mode-filter-chrome-v1 */
