/* OCR Reader: the media-tools converter layout, files beside the text. */

.ocr-drop { min-height: 300px; }

/* Once files are in, the drop target shrinks to a bar so the text is the page. */
.ocr-drop.is-compact { min-height: 0; padding: 14px 18px; background-image: none; }
.ocr-drop.is-compact .dropzone-inner {
  display: flex;
  width: 100%;
  max-width: none;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  text-align: left;
}
.ocr-drop.is-compact .drop-icon,
.ocr-drop.is-compact p { display: none; }
.ocr-drop.is-compact h2 { font-size: .92rem; letter-spacing: -.02em; }

.ocr-grid {
  display: grid;
  grid-template-columns: 320px minmax(0, 1fr);
  gap: 18px;
  align-items: start;
  margin-top: 18px;
}

.ocr-files .file-list { max-height: 460px; overflow-y: auto; }
.file-info { min-width: 0; }
.file-item.is-reading .file-meta { color: var(--media-accent-dark); }
.file-item.is-error .file-meta { color: #b73f31; }
.ocr-status { margin-top: 12px; }

.ocr-text .results-head { margin-bottom: 12px; }
.ocr-actions { display: flex; flex: 0 0 auto; gap: 7px; }

.ocr-output {
  display: block;
  width: 100%;
  min-height: 480px;
  padding: 16px 18px;
  border: 1px solid var(--media-line);
  border-radius: 12px;
  outline: 0;
  color: var(--media-ink);
  background: #fffdf8;
  font: 500 .86rem/1.7 "Inter", system-ui, -apple-system, sans-serif;
  resize: vertical;
}

/* There is nothing to paste from on a phone's drop target. */
@media (hover: none) {
  .ocr-paste { display: none; }
}

@media (max-width: 840px) {
  .ocr-grid { grid-template-columns: 1fr; }
  .ocr-drop { min-height: 240px; }
  .ocr-files .file-list { max-height: 260px; }
  .ocr-output { min-height: 320px; }
}