/* Infinite-canvas history/reference hotfix: 2026-08-22 */

/* The native textarea reserves the raw @reference token. Keep the visual pill
   on that exact box so the visible text and native caret share one advance. */
.mh-prompt-reference-visual > * {
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  overflow: hidden !important;
}

/* Each node is an isolated layer. Empty parts of the full-canvas wrapper do not
   intercept input; only the node's real direct children remain interactive. */
[data-canvas-node-layer] {
  isolation: isolate;
  pointer-events: none !important;
}

[data-canvas-node-layer] > * {
  pointer-events: auto;
}

/* Dedicated light prompt palette. */
[data-project-theme="light"] [data-prompt-surface] {
  background: #f8fafc !important;
  border-color: #cbd5e1 !important;
  color: #27364a !important;
  box-shadow: 0 22px 52px rgba(30, 41, 59, 0.16) !important;
}

[data-project-theme="light"] [data-prompt-surface] [data-prompt-editor],
[data-project-theme="light"] [data-prompt-surface] textarea,
[data-project-theme="light"] [data-prompt-surface] input {
  color: #27364a !important;
  caret-color: #111827 !important;
}

[data-project-theme="light"] [data-prompt-surface] textarea::placeholder,
[data-project-theme="light"] [data-prompt-surface] input::placeholder {
  color: #667085 !important;
  opacity: 1;
}

[data-project-theme="light"] [data-prompt-surface] [data-prompt-shortcut] {
  border: 1px solid #d2dae6 !important;
  background: #e9eef5 !important;
  color: #344054 !important;
}

[data-project-theme="light"] [data-prompt-surface] [data-prompt-shortcut]:hover {
  border-color: #b8c4d4 !important;
  background: #dfe7f1 !important;
  color: #182230 !important;
}

[data-project-theme="light"] [data-prompt-surface] [data-prompt-shortcut][data-active="true"] {
  border-color: #aebfd6 !important;
  background: #dbe7f5 !important;
  color: #173b6d !important;
}

/* Explicit selector is required because this release surgically patches an
   already-built Tailwind bundle. It also protects the modal from future canvas
   stacking changes. */
[data-history-overlay] {
  position: fixed !important;
  inset: 0 !important;
  z-index: 200 !important;
  isolation: isolate;
  box-sizing: border-box;
  overscroll-behavior: contain;
}

[data-history-preview] {
  position: fixed !important;
  inset: 0 !important;
  z-index: 210 !important;
  isolation: isolate;
}

[data-history-dialog] {
  max-height: calc(100dvh - 16px);
}

[data-history-dialog-header] {
  position: sticky;
  top: 0;
}

@media (max-width: 720px), (max-height: 620px) {
  [data-history-dialog] {
    height: calc(100dvh - 12px) !important;
    max-height: calc(100dvh - 12px) !important;
    border-radius: 14px !important;
  }

  [data-history-dialog-header] {
    padding: 8px 10px !important;
  }

  [data-history-dialog-header] > :first-child {
    font-size: 20px !important;
  }
}
