/* Workspace actions and the application settings dialog. */
[hidden] { display: none !important; }
.top-left-controls {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: var(--z-top-controls);
  background: var(--color-bg-dark);
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
  padding: 10px 16px;
  min-height: 56px;
  box-sizing: border-box;
  overflow: visible;
}
.workspace-header-spacer { height: 56px; flex-shrink: 0; }
.top-left-controls .control-group, .workspace-actions { display: flex; align-items: center; margin: 0; }
.top-left-controls .control-group label { margin: 0; }
.top-left-controls .file-upload-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  height: 36px;
  padding: 0 12px;
  margin: 0;
  box-sizing: border-box;
  white-space: nowrap;
  font-family: var(--font-primary);
  font-size: var(--font-size-base);
  font-weight: var(--font-weight-bold);
  line-height: 1;
  vertical-align: middle;
}
.workspace-actions { margin-left: auto; }
.hamburger-icon { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; }
.canvas-toolbar .action-btn { padding: 8px 12px; width: auto; }
.settings-dialog { padding: 0; width: min(760px, calc(100vw - 32px)); max-height: calc(100dvh - 48px); box-sizing: border-box; color: var(--color-text-light); background: var(--color-bg-panel); border: 1px solid var(--color-border); border-radius: var(--border-radius-lg); box-shadow: var(--box-shadow-heavy); font-family: var(--font-primary); }
.settings-dialog::backdrop { background: rgba(0, 0, 0, 0.6); }
.settings-header { display: flex; align-items: center; justify-content: space-between; padding: 18px 24px; border-bottom: 1px solid var(--color-border); }
.settings-header h2 { margin: 0; font-size: 20px; color: var(--color-primary); }
.settings-tabs { display: flex; padding: 12px 24px 0; gap: 8px; flex-wrap: wrap; }
.settings-tabs button, .hotkey-input { padding: 9px 12px; border: 1px solid var(--color-border); border-radius: var(--border-radius-sm); background: var(--color-bg-dark); color: var(--color-text-light); font: inherit; }
.settings-tabs button { cursor: pointer; }
.settings-tabs [aria-current="page"], .settings-theme-options .active { border-color: var(--color-primary); color: var(--color-primary); background: var(--color-primary-glow-20); }
.settings-page { padding: 10px 24px 24px; line-height: 1.65; font-family: var(--font-secondary, sans-serif); }
.settings-page h3, .settings-page h4 { color: var(--color-primary); }
.settings-theme-options { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.settings-theme-options .theme-option { border: 1px solid var(--color-border); border-radius: var(--border-radius-sm); }
.hotkey-row { display: grid; grid-template-columns: minmax(0, 1fr) minmax(120px, 190px); align-items: center; gap: 14px; padding: 10px 0; border-bottom: 1px solid var(--color-border); }
.hotkey-row label { font-weight: 600; }
.hotkey-row small { display: block; font-weight: normal; color: var(--color-text-muted); }
.hotkey-input { width: 100%; min-width: 0; box-sizing: border-box; text-align: center; cursor: pointer; }
.hotkey-input:focus { outline: 2px solid var(--color-primary); outline-offset: 2px; }
#hotkey-status { min-height: 1.5em; }
@media (max-width: 620px) {
  .top-left-controls { padding: 10px; }
  .workspace-actions { margin-left: 0; }
  .settings-page, .settings-header { padding-left: 16px; padding-right: 16px; }
  .settings-tabs { padding-left: 16px; padding-right: 16px; }
  .hotkey-row { grid-template-columns: minmax(0, 1fr) 130px; }
}

/* Parameter editors remain above the workspace toolbar. */
.global-config-overlay { z-index: 2400; max-width: calc(100vw - 32px); }
.modal-overlay { z-index: 2500; }

/* Spatial import summaries and local projection choices. */
.spatial-import-status { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; margin: 12px 20px 0; color: var(--color-text-muted); font-family: var(--font-secondary, sans-serif); font-size: 13px; }
.spatial-import-status .action-btn { width: auto; padding: 6px 10px; font-size: 12px; }
.spatial-import-status .spatial-import-dismiss { margin-left: auto; font-size: 18px; line-height: 1; }
.spatial-import-fields { display: grid; gap: 10px; }
.spatial-import-fields > div { display: grid; gap: 8px; }
.spatial-import-fields input, .spatial-import-fields select, .spatial-import-fields textarea { width: 100%; box-sizing: border-box; padding: 9px; border: 1px solid var(--color-border); border-radius: var(--border-radius-sm); background: var(--color-bg-dark); color: var(--color-text-light); font: inherit; }
#spatial-crs-file { display: block; }
.spatial-import-actions { display: flex; justify-content: flex-end; gap: 12px; }
.spatial-import-actions .action-btn { width: auto; }
#spatial-import-error { color: var(--color-primary); min-height: 1.5em; }

/* Palette previews stay recognizable in every active theme. */
.settings-theme-options .theme-preview { display: flex; align-items: center; gap: 12px; }
.theme-preview small { display: block; margin-top: 4px; font: 11px var(--font-secondary); color: var(--color-text-muted); line-height: 1.5; }
.theme-swatch { width: 32px; height: 32px; border-radius: 50%; flex-shrink: 0; border: 1px solid var(--color-border); }
[data-theme="synthwave"] .theme-swatch { background: linear-gradient(135deg, #100b23 33%, #ff69d4 33% 66%, #58e6ff 66%); }
[data-theme="abyss"] .theme-swatch { background: linear-gradient(135deg, #04131d 33%, #64d8ff 33% 66%, #ffbe83 66%); }
[data-theme="amber"] .theme-swatch { background: linear-gradient(135deg, #15110b 33%, #ffca72 33% 66%, #b9dea1 66%); }
[data-theme="aurora"] .theme-swatch { background: linear-gradient(135deg, #0c171c 33%, #83ebbf 33% 66%, #c6a3ff 66%); }
@media (max-width: 480px) { .settings-theme-options { grid-template-columns: 1fr; } }

[data-theme="default"] .theme-swatch { background: linear-gradient(135deg, #0a0e13 33%, #00e5ff 33% 66%, #ff6b35 66%); }

[data-theme="hacker"] .theme-swatch { background: linear-gradient(135deg, #0d1117 33%, #39d353 33% 66%, #f85149 66%); }

[data-theme="minimal"] .theme-swatch { background: linear-gradient(135deg, #ffffff 33%, #1976d2 33% 66%, #f57c00 66%); }

[data-theme="horror"] .theme-swatch { background: linear-gradient(135deg, #0f0f0f 33%, #dc2626 33% 66%, #fbbf24 66%); }

[data-theme="professional-dark"] .theme-swatch { background: linear-gradient(135deg, #0b1020 33%, #4f46e5 33% 66%, #06b6d4 66%); }

[data-theme="professional-light"] .theme-swatch { background: linear-gradient(135deg, #ffffff 33%, #2563eb 33% 66%, #0ea5e9 66%); }

[data-theme="catppuccin"] .theme-swatch { background: linear-gradient(135deg, #1e1e2e 33%, #cba6f7 33% 66%, #fab387 66%); }

[data-theme="spaceduck"] .theme-swatch { background: linear-gradient(135deg, #0f111b 33%, #b3a1e6 33% 66%, #f2ce00 66%); }

[data-theme="kanagawa"] .theme-swatch { background: linear-gradient(135deg, #1f1f28 33%, #7e9cd8 33% 66%, #e6c384 66%); }

[data-theme="trackdat"] .theme-swatch { background: linear-gradient(135deg, #0c3047 33%, #ffffff 33% 66%, #58c6e0 66%); }

[data-theme="etn"] .theme-swatch { background: linear-gradient(135deg, #ffffff 33%, #14629c 33% 66%, #ffef2b 66%); }
[data-theme="otn"] .theme-swatch { background: linear-gradient(135deg, #ffffff 33%, #123466 33% 66%, #23a8b8 66%); }

[data-theme="nord"] .theme-swatch { background: linear-gradient(135deg, #2e3440 33%, #88c0d0 33% 66%, #b48ead 66%); }

[data-theme="rose-pine"] .theme-swatch { background: linear-gradient(135deg, #191724 33%, #ebbcba 33% 66%, #9ccfd8 66%); }

[data-theme="tokyo-night"] .theme-swatch { background: linear-gradient(135deg, #1a1b26 33%, #7aa2f7 33% 66%, #bb9af7 66%); }

[data-theme="everforest"] .theme-swatch { background: linear-gradient(135deg, #2d353b 33%, #a7c080 33% 66%, #83c092 66%); }

[data-theme="sweet"] .theme-swatch { background: linear-gradient(135deg, #1e1e2e 33%, #ec89cb 33% 66%, #00dded 66%); }

[data-theme="barbie"] .theme-swatch { background: linear-gradient(135deg, #fff0f7 33%, #c21875 33% 66%, #9d3db6 66%); }