/* Workspace navigation. Keep existing application handlers and panel state. */
.wh-enhanced, .wh-dialog, .wh-mobile {
  --wh-bg: #111923;
  --wh-surface: #192430;
  --wh-line: #304050;
  --wh-text: #edf3f9;
  --wh-muted: #a7b6c7;
  --wh-accent: #8abaff;
  --wh-target: 2.75rem;
  color: var(--wh-text);
  font: 400 .875rem/1.45 -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  color-scheme: dark;
}
#toolbar.wh-enhanced {
  padding: 0 max(1rem, env(safe-area-inset-right)) 0 max(1rem, env(safe-area-inset-left));
  background: var(--wh-bg);
  border-bottom: 1px solid var(--wh-line);
  box-shadow: 0 1px 0 #0003;
  flex-wrap: nowrap;
  container-type: inline-size;
}
.wh-row {
  display: flex;
  align-items: center;
  flex-wrap: nowrap;
  gap: .5rem;
  width: 100%;
  min-width: 0;
  max-width: 116rem;
  min-height: 4rem;
  margin-inline: auto;
}
.wh-sources, .wh-enhanced [hidden], .wh-mobile [hidden], .wh-dialog [hidden] { display: none !important; }
.wh-product { display: flex; align-items: center; gap: .5rem; flex: 0 0 auto; padding-inline-end: .625rem; }
.wh-product-name { font-size: .9375rem; font-weight: 750; letter-spacing: .06em; }
.wh-mark {
  display: grid; place-items: center; width: 1.875rem; height: 1.875rem;
  color: #a4caff; background: #23364c; border: 1px solid #37516c; border-radius: .625rem;
}
.wh-icon { width: 1.125rem; height: 1.125rem; flex: 0 0 auto; pointer-events: none; }
#toolbar.wh-enhanced .wh-button, .wh-mobile .wh-button, .wh-dialog .wh-button {
  display: inline-flex; align-items: center; justify-content: center; gap: .5rem;
  min-height: var(--wh-target); min-width: var(--wh-target);
  padding: .625rem .875rem; flex: 0 0 auto;
  border: 1px solid transparent; border-radius: .75rem;
  background: transparent; color: var(--wh-text);
  font: inherit; font-weight: 550; line-height: 1.25;
  white-space: nowrap; text-decoration: none; cursor: pointer;
  transition: background-color 120ms ease, border-color 120ms ease;
  -webkit-tap-highlight-color: transparent;
}
#toolbar.wh-enhanced .wh-button:hover, .wh-mobile .wh-button:hover, .wh-dialog .wh-button:hover { background: #233242; }
#toolbar.wh-enhanced .wh-button:active, .wh-mobile .wh-button:active, .wh-dialog .wh-button:active { background: #2b3e52; }
.wh-enhanced :focus-visible, .wh-mobile :focus-visible, .wh-dialog :focus-visible {
  outline: 2px solid var(--wh-accent) !important; outline-offset: 3px;
}
#toolbar.wh-enhanced .wh-workspace, .wh-mobile .wh-workspace {
  justify-content: flex-start; min-width: 0; flex: 0 1 17rem; border-color: var(--wh-line);
}
.wh-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0; }
.wh-workspace .wh-name { flex: 1 1 auto; text-align: start; }
.wh-count { color: var(--wh-muted); font-size: .75rem; font-variant-numeric: tabular-nums; }
.wh-chevron { width: .875rem; height: .875rem; color: var(--wh-muted); }
.wh-status-dot { width: .4375rem; height: .4375rem; border-radius: 50%; background: #f5bb67; flex: 0 0 auto; }
.wh-status-dot[data-state="connected"] { background: #74d9b1; }
.wh-status-dot[data-state="offline"] { background: #f39999; }
#toolbar.wh-enhanced .wh-search-trigger {
  justify-content: flex-start; flex: 1 1 22rem; min-width: var(--wh-target); max-width: 29rem;
  margin-inline: auto; color: var(--wh-muted); border-color: var(--wh-line); background: #17212c;
}
.wh-search-trigger .wh-name { flex: 1; text-align: start; }
.wh-shortcut { border: 1px solid #3a4a5c; border-radius: .3125rem; padding: .125rem .3125rem; font-family: inherit; font-size: .6875rem; line-height: 1.2; color: var(--wh-muted); }
#toolbar.wh-enhanced .wh-add, .wh-mobile .wh-add {
  background: #9cc5ff; color: #101b2a; border-color: #aacfff;
}
#toolbar.wh-enhanced .wh-add:hover, .wh-mobile .wh-add:hover { background: #b8d7ff; }
.wh-layout-name { max-width: 10rem; }
#toolbar.wh-enhanced .wh-more { border-color: var(--wh-line); }
body.desktop-floating-layout #panelsContainer { isolation: isolate; }

/* Container width, rather than device names, determines the available detail. */
@container (max-width: 76rem) {
  .wh-row .wh-count, .wh-row .wh-layout-name, .wh-row .wh-shortcut { display: none; }
  #toolbar.wh-enhanced .wh-workspace { flex-basis: 13rem; }
}
@container (max-width: 60rem) {
  .wh-row .wh-layout-trigger, .wh-row .wh-add-label { display: none !important; }
  #toolbar.wh-enhanced .wh-workspace { flex-basis: 11rem; }
}
@container (max-width: 46rem) {
  .wh-row .wh-product-name, .wh-row .wh-search-copy { display: none; }
  #toolbar.wh-enhanced .wh-search-trigger { flex: 0 0 var(--wh-target); padding-inline: 0; justify-content: center; margin-inline-start: auto; }
  #toolbar.wh-enhanced .wh-workspace { flex: 1 1 auto; }
}
/* Measurement fallback also covers long translated text and text-only zoom. */
.wh-row[data-density="compact"] .wh-count,
.wh-row[data-density="compact"] .wh-shortcut,
.wh-row[data-density="compact"] .wh-layout-trigger,
.wh-row[data-density="compact"] .wh-add-label,
.wh-row[data-density="compact"] .wh-product-name,
.wh-row[data-density="compact"] .wh-search-copy { display: none !important; }
#toolbar.wh-enhanced .wh-row[data-density="compact"] .wh-search-trigger { flex: 0 0 var(--wh-target); padding-inline: 0; justify-content: center; }
.wh-row[data-density="minimal"] .wh-product,
.wh-row[data-density="minimal"] .wh-search-trigger,
.wh-row[data-density="minimal"] .wh-add,
.wh-row[data-density="minimal"] .wh-layout-trigger,
.wh-row[data-density="minimal"] .wh-count { display: none !important; }
#toolbar.wh-enhanced .wh-row[data-density="minimal"] .wh-workspace { flex: 1; }

/* Native dialogs own focus, Escape and the top layer above floating panels. */
.wh-dialog {
  position: fixed; inset: 0; margin: auto;
  width: min(36rem, calc(100% - 2rem)); max-width: none;
  max-height: min(44rem, calc(var(--wh-viewport-height, 100dvh) - 2rem));
  padding: 0; border: 1px solid #3b4b5d; border-radius: 1.125rem;
  background: var(--wh-bg); box-shadow: 0 1.5rem 5rem #0008;
  overflow: auto; overscroll-behavior: contain;
}
.wh-dialog::backdrop { background: #02070ea8; }
.wh-dialog-head { display: flex; align-items: center; gap: 1rem; padding: 1rem 1rem .75rem 1.25rem; border-bottom: 1px solid var(--wh-line); }
.wh-dialog-title { flex: 1; min-width: 0; font-size: 1rem; font-weight: 650; }
.wh-dialog-body { padding: 1rem; }
.wh-dialog .wh-close { padding: .5rem; }
.wh-dialog .wh-caption { color: var(--wh-muted); font-size: .8125rem; margin: .25rem .25rem .875rem; }
.wh-dialog .wh-section-title { color: var(--wh-muted); font-size: .75rem; font-weight: 600; margin: 1rem .5rem .375rem; }
.wh-dialog .wh-section-title:first-child { margin-top: 0; }
.wh-dialog .wh-action, .wh-dialog .wh-choice {
  display: flex; justify-content: flex-start; gap: .75rem; width: 100%;
  text-align: start; white-space: normal; min-height: 3rem;
}
.wh-action-copy { flex: 1; min-width: 0; }
.wh-action-copy span { display: block; }
.wh-action-detail { font-size: .75rem; color: var(--wh-muted); margin-top: .1875rem; font-weight: 400; }
.wh-dialog .wh-danger { color: #ffb4b4; }
.wh-dialog .wh-choice[aria-current="true"] { background: #243c57; }
.wh-dialog .wh-choice .wh-name { flex: 1; }
.wh-dialog .wh-field-label { display: block; font-weight: 550; margin-bottom: .5rem; }
.wh-dialog input[type="search"], .wh-dialog select {
  display: block; width: 100% !important; max-width: 100% !important;
  min-width: 0; min-height: 3rem; padding: .75rem !important;
  border: 1px solid #44586e !important; border-radius: .75rem !important;
  background: var(--wh-surface) !important; color: var(--wh-text) !important;
  font: inherit !important; font-size: 1rem !important;
}
.wh-dialog #layoutProfileSwitcher { display: grid !important; gap: .75rem !important; margin: 0 !important; }
.wh-dialog #layoutProfileSwitcher > span { display: none; }
.wh-dialog #layoutProfileManageBtn, .wh-dialog #resetPanelLayoutBtn {
  min-height: 3rem; padding: .75rem; border: 1px solid var(--wh-line);
  background: var(--wh-surface); color: var(--wh-text); border-radius: .75rem; font: inherit; cursor: pointer;
}
.wh-dialog #globalSearchWrap { margin: 0 !important; }
.wh-dialog #globalSearchResults {
  position: static !important; max-height: none !important; width: 100%;
  border: 0 !important; background: transparent !important; box-shadow: none !important; margin-top: .75rem !important;
}
.wh-dialog .global-search-row { border-radius: .75rem; min-height: 3rem; padding: .75rem !important; }
.wh-dialog .global-search-row:focus-visible { outline-offset: -2px; }
.wh-dialog .global-search-row[aria-current="true"] { background: #233b55 !important; }
.wh-search-dialog { align-self: start; margin-top: max(5rem, env(safe-area-inset-top)); }
.wh-dialog .wh-connections { display: grid; gap: .5rem; }
.wh-dialog .wh-connections a { white-space: normal; text-align: start; justify-content: flex-start; }
.wh-notice { display: flex; align-items: center; gap: .75rem; flex-wrap: wrap; margin-top: 1rem; padding: .75rem; border: 1px solid var(--wh-line); border-radius: .75rem; }
.wh-notice span { flex: 1; }
.wh-status-copy { display: flex; align-items: center; gap: .5rem; padding: .75rem .5rem 0; color: var(--wh-muted); font-size: .8125rem; }
.wh-dialog #addDialog { position: static; inset: auto; display: block; background: none; padding: 0; }
.wh-dialog #addDialog.hidden { display: none; }
.wh-dialog #addDialog .dialog-body { background: transparent; color: var(--wh-text); width: 100%; max-width: none; padding: 0; border: 0; box-shadow: none; }
.wh-dialog #addDialog h3 { display: none; }
.wh-dialog #addDialog label { display: block; color: var(--wh-text); margin-bottom: .75rem; }
.wh-dialog #addDialog select { margin-top: .375rem; }
.wh-dialog #addDialog .dialog-actions { display: flex; gap: .5rem; margin-top: 1.25rem; }
.wh-dialog #addDialog .dialog-actions button { min-height: 2.75rem; padding: .625rem 1.25rem; border-radius: .75rem; font: inherit; cursor: pointer; }
.wh-dialog #addDialog .btn-primary { color: #101b2a; background: #9cc5ff; }
.wh-dialog #addDialog .btn-cancel { color: var(--wh-text); background: var(--wh-surface); border: 1px solid var(--wh-line); }

@media (pointer: coarse) {
  .wh-enhanced, .wh-mobile, .wh-dialog { --wh-target: 3rem; }
}
@media (prefers-reduced-motion: reduce) {
  .wh-enhanced *, .wh-mobile *, .wh-dialog * { transition: none !important; scroll-behavior: auto !important; }
}
@media (forced-colors: active) {
  .wh-enhanced, .wh-mobile, .wh-dialog { border-color: CanvasText; }
  .wh-button, .wh-mark { border: 1px solid ButtonText !important; }
  .wh-status-dot { border: 1px solid CanvasText; }
}
@media print { .wh-dialog, #toolbar.wh-enhanced { display: none !important; } }
