/*
 * The file sheet (layouts/_file_sheet, pwa/file_links.js): how the installed app on an iPhone / iPad hands over a file
 * without leaving the app. Loaded by the app's layout, the report's paper layout and the landing page, so it stands on
 * its own — no Bootstrap class, no brand token — in the brand's slate and blue: a centred dialog, a bottom sheet on a
 * phone (the thumb's reach), 44 px buttons.
 */
.file-sheet {
  box-sizing: border-box; width: min(100% - 32px, 440px); max-width: none; max-height: calc(100dvh - 32px); margin: auto;
  padding: 0; border: 1px solid #2b313b; border-radius: 16px; background: #1c2128; color: #e8edf3;
  font-family: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif; font-size: 16px; line-height: 1.45;
  box-shadow: 0 18px 48px rgba(0, 0, 0, .5); overflow: auto;
}
.file-sheet::backdrop { background: rgba(5, 7, 10, .8); }
.file-sheet [hidden] { display: none !important; }
.file-sheet-body { display: grid; gap: 12px; padding: 20px 20px calc(20px + env(safe-area-inset-bottom, 0px)); }
.file-sheet-title { margin: 0; color: #e8edf3; font-size: 1.125rem; font-weight: 700; line-height: 1.3; overflow-wrap: anywhere; }
.file-sheet-status { margin: 0; color: #c7ced8; font-size: .9375rem; overflow-wrap: anywhere; }
.file-sheet[data-state="error"] .file-sheet-status { color: #ffb4a8; }
.file-sheet[data-state="loading"] .file-sheet-status::before {
  content: ""; display: inline-block; width: 14px; height: 14px; margin-right: 8px; vertical-align: -2px;
  border: 2px solid #5b9bff; border-right-color: transparent; border-radius: 50%; animation: file-sheet-spin .8s linear infinite;
}
@keyframes file-sheet-spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .file-sheet[data-state="loading"] .file-sheet-status::before { animation: none; } }
.file-sheet-preview { margin: 0; }
.file-sheet-image { display: block; width: 100%; max-height: 40dvh; object-fit: contain; border-radius: 10px; background: #000; }
.file-sheet-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px; margin-top: 4px; }
.file-sheet-button {
  min-height: 44px; padding: 0 18px; border: 1px solid #39414d; border-radius: 10px; background: transparent; color: #e8edf3;
  font: inherit; font-weight: 600; cursor: pointer;
}
.file-sheet-button:hover { background: #242a33; }
.file-sheet-button:focus-visible { outline: 2px solid #82b4ff; outline-offset: 2px; }
.file-sheet-primary { border-color: #2f6fd0; background: #2f6fd0; color: #fff; }
.file-sheet-primary:hover { background: #2453a6; }

@media (max-width: 575.98px) {
  .file-sheet {
    width: 100%; max-height: calc(100dvh - 24px); margin: auto 0 0; border-width: 1px 0 0; border-radius: 16px 16px 0 0;
  }
  .file-sheet-actions { flex-direction: column-reverse; }
  .file-sheet-button { width: 100%; }
}