/* report-issue.js — header bug trigger, report banner, and the image field. */

/* Header bug icon (left of the profile icon) — subtle amber accent. */
.header-report-btn {
  color: #f39c12;
}
.header-report-btn:hover {
  background: rgba(243, 156, 18, 0.14);
  color: #f39c12;
}
.header-report-btn.is-capturing { opacity: 0.6; cursor: progress; }

/* Banner shown on the issue create form when raised from a page. */
.report-return-banner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin: 8px 0 4px;
  padding: 8px 12px;
  border-radius: 10px;
  background: rgba(243, 156, 18, 0.12);
  border: 1px solid rgba(243, 156, 18, 0.35);
  font-size: 0.82rem;
}
.report-return-banner strong { font-weight: 700; }

/* ── Image field (data_type = image): upload + preview + clear ───────────── */
.image-field {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.image-field-preview {
  border: 1px dashed var(--border, rgba(255, 255, 255, 0.18));
  border-radius: 8px;
  background: rgba(0, 0, 0, 0.15);
  min-height: 120px;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}
.image-field-img {
  max-width: 100%;
  max-height: 320px;
  object-fit: contain;
  display: block;
}
.image-field-empty { font-size: 0.8rem; }
.image-field-actions { display: flex; gap: 8px; }
.image-field-upload { cursor: pointer; }

/* Small thumbnail for image fields shown in a grid cell. */
.image-cell-thumb {
  max-width: 64px;
  max-height: 40px;
  object-fit: cover;
  border-radius: 4px;
  border: 1px solid var(--border, rgba(255, 255, 255, 0.15));
  vertical-align: middle;
}

/* Dynamic record field label (metadata form layout). */
.dyn-field { display: flex; flex-direction: column; gap: 4px; font-size: 0.8rem; font-weight: 600; }
.dyn-field .dyn-field-label { color: var(--muted, #9aa); }
.dyn-field input, .dyn-field select, .dyn-field textarea { font-weight: 400; }
.detail-hero-icon svg { width: 22px; height: 22px; }