/* Bug reports. Owned by the Bug reports agent; contract in section 4.8 of the
   web redesign specification. State colour comes from the base state word and
   the kind chip is a base chip, so no colour word or hex appears here. */

/* the list: the base page frame, held to 820 with a 12 gap (as releases
   does with #rel-inner) */
#bug-list{max-width:820px;gap:var(--s-l)}

/* the header's "Show finished" switch reads in Face.caption beside Refresh
   (Reports.swift: Toggle(...).font(Face.caption)); base sets .swtitle 14.5 */
#head-tools .switch .swtitle{font-size:12.5px}

.bugcard{background:var(--card);border:1px solid var(--line);border-radius:var(--r-lg);padding:var(--s-l) var(--s-xl);
  display:flex;flex-direction:column;gap:var(--s-m);min-width:0}
.bugcard.new{border-color:var(--line2)}
.bugcard>p{margin:0}

.bughead{display:flex;align-items:baseline;gap:10px;min-width:0}
.bughead .who{flex:1;min-width:0;font-size:12.5px;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.bughead .at{font-size:12.5px;color:var(--faint);font-variant-numeric:tabular-nums;white-space:nowrap}

.bugbody{font-size:14.5px;line-height:1.45;white-space:pre-wrap;overflow-wrap:anywhere;user-select:text}

.bugfoot{display:flex;align-items:center;gap:var(--s-m);min-width:0}
.bugfoot .ver{flex:1;min-width:0;font-size:12.5px;color:var(--faint);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

.bugshot{display:block;max-width:320px;max-height:200px;border-radius:var(--r-sm);border:1px solid var(--line);cursor:zoom-in}

/* the zoom sheet: the picture large, one Done */
.bug-zoom.bug-zoom{width:auto;max-width:92vw;max-height:92vh;padding:0;gap:0}
.bug-zoom img{display:block;max-width:100%;max-height:80vh;object-fit:contain;border-radius:var(--r-sm)}

/* the report sheet */
.phonebox{display:flex;align-items:center;gap:var(--s-l);background:var(--card);border:1px solid var(--line);border-radius:var(--r-md);
  padding:var(--s-l) var(--s-xl);margin-bottom:var(--s-l)}
.phonebox>p{flex:1;min-width:0;margin:0}
.phonebox a{font-size:14.5px;font-weight:500;color:var(--text);text-decoration:none;white-space:nowrap}
.phonebox a:hover{text-decoration:underline;text-underline-offset:2px}
.bug-text{min-height:130px;margin-top:var(--s-m)}
.bug-attach{display:flex;align-items:center;gap:var(--s-m);flex-wrap:wrap;min-width:0;margin-top:var(--s-l)}
/* the attached picture: a 48 thumbnail and its name (a base hint), as plain
   children of the row */
.bug-attach>img{width:48px;height:48px;object-fit:cover;border-radius:var(--r-sm);border:1px solid var(--line);display:block}
.bug-attach>span{flex:1 1 0;min-width:0;max-width:160px;margin:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.bug-attach+div{margin-top:var(--s-l)}