/* Task Helper — the shared file viewer + names (job-intake.md §26 L1 + L2). Copyright Rapid Surveys Pty Ltd. */
.fa-ov { z-index: 60; }
.fa-card { background: var(--card); border-radius: 14px; padding: 12px; margin: 16px; width: min(960px, calc(100vw - 32px)); max-height: calc(100vh - 32px); overflow-y: auto; display: flex; flex-direction: column; gap: 8px; }
.fa-card img { max-width: 100%; max-height: calc(100vh - 300px); min-height: 120px; object-fit: contain; border-radius: 8px; background: #111; align-self: center; }
.fa-namerow { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.fa-name { font-weight: 600; overflow-wrap: anywhere; }
.fa-ren { width: auto; background: none; border: 0; padding: 4px 0; color: var(--accent); font-weight: 600; }
.fa-renbox { display: flex; gap: 6px; align-items: center; } .fa-renbox input { flex: 1; min-width: 0; margin: 0; }
.fa-renbox button { width: auto; }
.fa-of { margin: 0; font-size: 13px; color: var(--muted); }
.fa-acts { display: flex; gap: 8px; flex-wrap: wrap; }
.fa-dl { text-decoration: none; display: inline-flex; align-items: center; }
.fa-shared { border: 1px solid var(--line); border-radius: 10px; padding: 10px; display: flex; flex-direction: column; gap: 6px; }
.fa-warn { margin: 0; font-size: 13px; color: #8a5300; }
.fa-shared input { margin: 0; font-size: 13px; }
.fa-off { align-self: flex-start; color: var(--err) !important; }
.fa-card .modalbtns button { min-height: 44px; }
@media (pointer: coarse) { .fa-acts .chip, .fa-ren, .fa-off, .fa-renbox button { min-height: 44px; } }
/* A photo LIST by name (BRIEF-934): one slim line each — no pictures in forms or the notes list. */
.fa-lines { list-style: none; margin: 0; padding: 0; border: 1px solid var(--line); border-radius: 10px; overflow: hidden; background: var(--card); }
.fa-line { display: flex; align-items: center; min-height: 44px; border-top: 1px solid var(--line); }
.fa-line:first-child { border-top: 0; }
.fa-lopen { display: flex; align-items: center; gap: 8px; flex: 1; min-width: 0; min-height: 44px; margin: 0; padding: 6px 10px; background: none; border: 0; border-radius: 0; color: var(--ink); font: inherit; font-size: 14px; font-weight: 400; text-align: left; }
button.fa-lopen { cursor: pointer; } button.fa-lopen:hover { background: var(--hover); }
.fa-lcam { flex: none; color: var(--muted); }
.fa-lname { flex: 1; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.fa-lsize, .fa-lstate { flex: none; font-size: 12px; color: var(--muted); }
.fa-lwait.bad .fa-lstate { color: var(--err); font-weight: 600; }
.fa-lx, .fa-lpx { flex: none; width: 44px; height: 44px; margin: 0; padding: 0; background: none; border: 0; border-left: 1px solid var(--line); border-radius: 0; color: var(--muted); font-size: 14px; }
.fa-lx:hover, .fa-lpx:hover { color: var(--err); background: var(--hover); }
.fa-more { display: inline-block; width: auto; min-height: 44px; margin: 2px 0 0; padding: 0 4px; background: none; border: 0; color: var(--accent); font-weight: 600; font-size: 14px; cursor: pointer; }