/* Trade Hub rearrangeable windows */

.th-layout-toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 14px;
  flex: 0 0 auto;
  margin: 0 0 6px;
  padding: 6px 8px;
  border: 1px solid rgba(197, 160, 89, 0.2);
  border-radius: 8px;
  background: rgba(0, 0, 0, 0.28);
}

.th-layout-hint {
  margin: 0;
  flex: 1 1 220px;
  font-size: 0.72rem;
  line-height: 1.35;
}

.th-layout-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  flex: 0 0 auto;
}

.th-layout-status {
  flex: 1 1 100%;
  margin: 0;
  font-size: 0.72rem;
}

.th-layout-status-error {
  color: #f0a0a0;
}

body.th-layout-active .th-layout-canvas {
  position: relative;
  flex: 1 1 auto;
  min-height: min(52vh, 520px);
  height: min(62vh, 720px);
  width: 100%;
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 8px;
  background:
    linear-gradient(180deg, rgba(12, 16, 24, 0.35), rgba(6, 8, 12, 0.55)),
    repeating-linear-gradient(
      0deg,
      transparent,
      transparent 23px,
      rgba(255, 255, 255, 0.015) 24px
    ),
    repeating-linear-gradient(
      90deg,
      transparent,
      transparent 23px,
      rgba(255, 255, 255, 0.015) 24px
    );
  overflow: hidden;
}

body.th-layout-active .th-layout-deck-shell,
body.th-layout-active .th-layout-absorbed {
  display: none !important;
}

.th-win {
  position: absolute;
  display: flex;
  flex-direction: column;
  min-width: 160px;
  min-height: 120px;
  border: 1px solid rgba(197, 160, 89, 0.35);
  border-radius: 8px;
  background: rgba(8, 12, 18, 0.96);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.35);
  overflow: hidden;
  z-index: 5;
}

.th-win[hidden] {
  display: none !important;
}

.th-win-title {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  flex: 0 0 auto;
  padding: 5px 10px;
  border-bottom: 1px solid rgba(197, 160, 89, 0.22);
  background: linear-gradient(180deg, rgba(40, 34, 22, 0.95), rgba(16, 18, 24, 0.98));
  cursor: grab;
  user-select: none;
  touch-action: none;
}

.th-win-title:active {
  cursor: grabbing;
}

.th-win-title-text {
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #e8d7a8;
}

.th-win-title-hint {
  font-size: 0.62rem;
  letter-spacing: 0.04em;
  color: rgba(200, 210, 220, 0.45);
  text-transform: lowercase;
}

.th-win-body {
  position: relative;
  flex: 1 1 auto;
  min-height: 0;
  overflow: auto;
  display: flex;
  flex-direction: column;
}

.th-win-body > .panel,
.th-win-body > .paper-platform-panel,
.th-win-body > .options-paper-shell,
.th-win-body > .member-paper-hub-broker,
.th-win-body > .paper-order-ticket-exec {
  flex: 1 1 auto;
  min-height: 0 !important;
  max-height: none !important;
  height: 100% !important;
  margin: 0 !important;
  border: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  overflow: auto;
}

/* Window chrome replaces section eyebrows */
.th-win .eyebrow,
.th-win .helm-panel-head,
.th-win .paper-ticket-eyebrow,
.th-win .paper-ticket-title {
  display: none !important;
}

.th-win .paper-ticket-header {
  padding-top: 6px;
}

.th-win-resize {
  position: absolute;
  right: 0;
  bottom: 0;
  width: 16px;
  height: 16px;
  cursor: nwse-resize;
  touch-action: none;
  background:
    linear-gradient(135deg, transparent 50%, rgba(197, 160, 89, 0.55) 50%),
    linear-gradient(135deg, transparent 65%, rgba(197, 160, 89, 0.35) 65%);
  z-index: 3;
}

body.th-layout-active .paper-horizon-folder {
  overflow: hidden;
}

body.th-layout-active #paperPlatformWindow {
  flex: 0 0 auto;
  margin-bottom: 4px;
}

html[data-wp-density="laptop"]:not([data-wp-zoom="1"]) body.th-layout-active .th-layout-canvas,
html[data-wp-density="extra"]:not([data-wp-zoom="1"]) body.th-layout-active .th-layout-canvas,
html[data-wp-density="compact"]:not([data-wp-zoom="1"]) body.th-layout-active .th-layout-canvas {
  min-height: 0 !important;
  height: auto !important;
  flex: 1 1 auto;
}

@media (max-width: 900px) {
  body.th-layout-active .th-layout-canvas {
    height: min(70vh, 640px);
    min-height: 420px;
  }
}

/*
 * Laptop / 1080p terminal Hub.
 * Loaded AFTER experience.css, viewport.css, and optionsPaper.css so these WIN.
 * html.hub-terminal-fit is set by wpResponsive.js for compact/laptop/extra only.
 * Workstation density (Auto on a large monitor, or an intentional Monitor lock)
 * must not get this class — that mixed laptop Hub CSS with monitor geometry.
 */
html.hub-terminal-fit body.trade-log-mode .trade-hub-shell,
html.hub-terminal-fit body.trade-log-mode #tradeHubPaperPanel,
html.hub-terminal-fit body.trade-log-mode .paper-horizon-folder-wrap,
html.hub-terminal-fit body.trade-log-mode .paper-horizon-folder {
  display: flex !important;
  flex-direction: column !important;
  min-height: 0 !important;
  flex: 1 1 auto !important;
  overflow: hidden !important;
  gap: 2px !important;
  padding: 0 !important;
}

html.hub-terminal-fit body.trade-log-mode .trade-hub-command-bar {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  align-items: center !important;
  flex: 0 0 auto !important;
  max-height: 84px !important;
  min-height: 0 !important;
  height: auto !important;
  padding: 2px 6px !important;
  margin: 0 !important;
  gap: 8px !important;
}

html.hub-terminal-fit body.trade-log-mode .trade-hub-command-brand {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  width: auto !important;
  min-width: 0 !important;
  max-width: none !important;
  flex: 0 1 auto !important;
  gap: 4px 8px !important;
}

html.hub-terminal-fit body.trade-log-mode .trade-hub-command-brand .eyebrow {
  display: none !important;
}

html.hub-terminal-fit body.trade-log-mode .trade-hub-command-title {
  font-size: 0.68rem !important;
  line-height: 1.1 !important;
  white-space: nowrap !important;
}

html.hub-terminal-fit body.trade-log-mode .trade-hub-command-actions,
html.hub-terminal-fit body.trade-log-mode .trade-hub-tabs-stacked {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  width: auto !important;
  gap: 4px !important;
  margin: 0 !important;
}

html.hub-terminal-fit body.trade-log-mode .trade-hub-mc-btn,
html.hub-terminal-fit body.trade-log-mode .trade-hub-tab {
  min-height: 22px !important;
  padding: 1px 7px !important;
  font-size: 0.55rem !important;
}

html.hub-terminal-fit body.trade-log-mode .trade-hub-mission-zones {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  width: auto !important;
  max-width: none !important;
  min-width: 0 !important;
  flex: 1 1 auto !important;
  gap: 6px !important;
}

html.hub-terminal-fit body.trade-log-mode .trade-hub-mission-zone {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  flex: 1 1 0 !important;
  padding: 1px 6px !important;
  min-width: 0 !important;
  gap: 6px !important;
}

html.hub-terminal-fit body.trade-log-mode .trade-hub-mission-zone-label {
  display: inline !important;
  margin: 0 4px 0 0 !important;
  font-size: 0.5rem !important;
}

html.hub-terminal-fit body.trade-log-mode .trade-hub-zone-stats {
  flex-wrap: nowrap !important;
  gap: 2px 6px !important;
  font-size: 0.58rem !important;
}

html.hub-terminal-fit body.trade-log-mode .trade-hub-cmd-stat-hero strong {
  font-size: 0.66rem !important;
}

html.hub-terminal-fit body.trade-log-mode .paper-horizon-tabs {
  gap: 4px !important;
  padding: 0 !important;
  margin: 0 !important;
  flex: 0 0 auto !important;
}

html.hub-terminal-fit body.trade-log-mode .paper-horizon-tab {
  padding: 2px 8px !important;
  min-height: 22px !important;
  font-size: 0.56rem !important;
  margin: 0 !important;
  border-radius: 6px !important;
}

html.hub-terminal-fit body.trade-log-mode .paper-horizon-folder-banner,
html.hub-terminal-fit body.trade-log-mode .paper-horizon-desc {
  display: none !important;
}

html.hub-terminal-fit body.trade-log-mode #paperEventGuardBanner:not([hidden]) {
  display: block !important;
  padding: 2px 8px !important;
  font-size: 0.58rem !important;
  margin: 0 !important;
}

html.hub-terminal-fit body.th-layout-active #paperPlatformWindow,
html.hub-terminal-fit .paper-platform-window {
  flex: 0 0 auto !important;
  margin: 0 0 2px !important;
}

html.hub-terminal-fit .paper-platform-tabs {
  gap: 4px !important;
  padding: 0 !important;
  margin: 0 !important;
}

html.hub-terminal-fit .paper-platform-tab-cell {
  flex-direction: row !important;
  align-items: center !important;
  padding: 2px 8px !important;
  gap: 8px !important;
  min-height: 0 !important;
  max-height: 44px !important;
}

html.hub-terminal-fit .paper-platform-tab-title {
  font-size: 0.62rem !important;
}

html.hub-terminal-fit .paper-platform-tab-meta {
  flex: 1 1 auto !important;
  flex-wrap: nowrap !important;
  gap: 6px !important;
}

html.hub-terminal-fit .paper-platform-tab-cell .paper-platform-ticker-stat strong {
  font-size: 0.7rem !important;
}

html.hub-terminal-fit body.trade-log-mode .paper-ticker-journal-btn,
html.hub-terminal-fit body.trade-log-mode .paper-ticker-reset-btn {
  min-height: 22px !important;
  padding: 1px 6px !important;
  font-size: 0.55rem !important;
}

html.hub-terminal-fit body.th-layout-active .th-layout-toolbar {
  display: flex !important;
  flex-wrap: nowrap !important;
  align-items: center !important;
  padding: 1px 6px !important;
  margin: 0 0 2px !important;
  min-height: 0 !important;
  gap: 6px !important;
}

html.hub-terminal-fit body.th-layout-active .th-layout-hint {
  font-size: 0.52rem !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

html.hub-terminal-fit body.th-layout-active .th-layout-canvas,
html.hub-terminal-fit body.th-layout-active .th-layout-canvas {
  min-height: 0 !important;
  height: auto !important;
  max-height: none !important;
  flex: 1 1 auto !important;
}

html.hub-terminal-fit body.th-layout-options .th-layout-canvas {
  display: grid !important;
  grid-template-rows: minmax(120px, 22%) minmax(0, 1fr) !important;
  grid-template-columns: minmax(0, 1fr) !important;
}

html.hub-terminal-fit body.th-layout-options .th-win[data-layout-id="open"] {
  position: relative !important;
  left: auto !important;
  top: auto !important;
  width: auto !important;
  height: auto !important;
  min-height: 0 !important;
  grid-row: 1;
  grid-column: 1;
}

html.hub-terminal-fit body.th-layout-options .th-win[data-layout-id="options"] {
  position: relative !important;
  left: auto !important;
  top: auto !important;
  width: auto !important;
  height: auto !important;
  min-height: 0 !important;
  grid-row: 2;
  grid-column: 1;
}

html.hub-terminal-fit body.th-layout-futures .th-layout-canvas {
  display: grid !important;
  grid-template-rows: minmax(120px, 22%) minmax(0, 1fr) !important;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
}

html.hub-terminal-fit body.th-layout-futures .th-win[data-layout-id="open"] {
  position: relative !important;
  left: auto !important;
  top: auto !important;
  width: auto !important;
  height: auto !important;
  grid-row: 1;
  grid-column: 1;
}

html.hub-terminal-fit body.th-layout-futures .th-win[data-layout-id="working"] {
  position: relative !important;
  left: auto !important;
  top: auto !important;
  width: auto !important;
  height: auto !important;
  grid-row: 1;
  grid-column: 2;
}

html.hub-terminal-fit body.th-layout-futures .th-win[data-layout-id="venue"] {
  position: relative !important;
  left: auto !important;
  top: auto !important;
  width: auto !important;
  height: auto !important;
  grid-row: 2;
  grid-column: 1;
}

html.hub-terminal-fit body.th-layout-futures .th-win[data-layout-id="ticket"] {
  position: relative !important;
  left: auto !important;
  top: auto !important;
  width: auto !important;
  height: auto !important;
  grid-row: 2;
  grid-column: 2;
}

html.hub-terminal-fit body.trade-log-mode .trade-table th,
html.hub-terminal-fit body.trade-log-mode .trade-table td {
  padding: 2px 4px !important;
}

html.hub-terminal-fit body.th-layout-options .options-chain-deck,
html.hub-terminal-fit body.th-layout-options #paperOptionsPanel,
html.hub-terminal-fit body.th-layout-options .options-paper-shell {
  min-height: 0 !important;
  height: 100% !important;
  max-height: none !important;
  flex: 1 1 auto !important;
  overflow: auto !important;
}

@media (max-width: 900px) {
  html.hub-terminal-fit body.th-layout-active .th-layout-canvas {
    height: auto !important;
    min-height: 0 !important;
  }
}