/* jarchi board (board.js): the ink layers on a page, and doc.js's «فایل» sheet. The highlighter has its own layer,
   see-through and multiplied, so its strokes never darken where they cross and never hide the writing under them. */

.ink-hl, .ink-pen { position: absolute; inset: 0; display: block; }
.ink-hl { opacity: .42; mix-blend-mode: multiply; }
.stg-page.ink-edit .ink-pen { touch-action: none; cursor: crosshair; }
.stg-page.ink-edit[data-tool="eraser"] .ink-pen {
  cursor: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='28' height='28'%3E%3Ccircle cx='14' cy='14' r='11' fill='white' fill-opacity='.6' stroke='%23555' stroke-width='1.5'/%3E%3C/svg%3E") 14 14, cell;
}
.stg-page[data-loading="1"] .ink-pen { cursor: progress; }
.stg-page[data-loading="err"]::after {
  content: "صفحه خونده نشد؛ دوباره امتحان می‌کنیم…";
  position: absolute; inset: auto 0 45% 0; text-align: center; color: #5c646b; font-size: 14px; font-weight: 700;
}

/* «فایل» (the teacher's files for the class) */
.doc-body .btn#doc-upload { margin-bottom: 10px; }
.doc-status { margin: 0 0 10px; font-weight: 700; font-size: 14px; color: var(--accent-strong); }
.doc-status:empty { display: none; }
.doc-status[data-bad="1"] { color: var(--danger-ink); }
.doc-list { list-style: none; margin: 0 0 4px; padding: 0; max-height: 40dvh; overflow-y: auto; }
.doc-list li {
  display: flex; align-items: center; gap: 10px;
  padding: 8px 0; border-top: 1px solid var(--line);
}
.doc-list li:first-child { border-top: 0; }
.doc-ic { flex: none; display: grid; place-items: center; width: 40px; height: 40px; border-radius: 12px; background: var(--bg-sunken); color: var(--muted); }
.doc-ic .ic { width: 20px; height: 20px; }
.doc-who { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; line-height: 1.5; }
.doc-who b { font-weight: 700; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.doc-who small { color: var(--muted); font-size: 12.5px; }
.doc-who .doc-bad { color: var(--danger-ink); }
.doc-list li.empty { display: block; }