/* Stored answer attachments. */
.fh-files {
  width: 100%;
  min-width: 0;
  margin: 0.75rem 0 0.5rem;
  font-family: var(--fh-sans, sans-serif);
}

.fh-files-list {
  display: grid;
  gap: 0.5rem;
  width: 100%;
  max-width: 35rem;
  margin: 0;
  padding: 0;
  list-style: none;
}

.fh-file-item { min-width: 0; }

.fh-file-button {
  display: flex;
  flex-direction: column;
  gap: 0.2rem;
  width: 100%;
  min-width: 0;
  padding: 0.7rem 0.85rem;
  text-align: left;
  color: var(--text-primary, #1f1f1f);
  background: var(--surface-primary, #fff);
  border: 1px solid var(--border-medium, #d8d3ca);
  border-radius: 0.75rem;
  cursor: pointer;
}

.fh-file-button:hover:not(:disabled) { background: var(--surface-hover, #f0f0f0); }
.fh-file-button:focus-visible { outline: 2px solid #b23127; outline-offset: 2px; }
.fh-file-button:disabled { cursor: progress; opacity: 0.7; }

.fh-file-name {
  display: block;
  max-width: 100%;
  font-size: 0.9rem;
  font-weight: 600;
  line-height: 1.4;
  overflow-wrap: anywhere;
}

.fh-file-details,
.fh-file-status {
  display: block;
  color: var(--text-secondary, #6b6b6b);
  font-size: 0.78rem;
  line-height: 1.4;
}

.fh-file-status:not(:empty) { margin: 0.2rem 0 0.35rem; }

@media (max-width: 480px) {
  .fh-files-list { max-width: 100%; }
  .fh-file-button { padding: 0.65rem 0.75rem; }
}

@media print {
  .fh-files { display: none !important; }
}