/* Farooq Music 2.0 — Assignments (admin) + MY TASKS (worker), Day 28 part 1 (WBS D28-1). On top of fm2-admin.css. No inline styles (CSP). */
.view-work{display:grid;gap:1.2rem;padding:1.5rem 2rem;max-width:120rem;margin:0 auto;align-content:start;width:100%;box-sizing:border-box}
.ur .view-work{direction:rtl}
@media (max-width:60rem){.view-work{padding:1rem}}
.block{display:grid;gap:.8rem;padding:1rem 1.1rem}
.block-head{display:grid;gap:.4rem}
.block-head h2{margin:0}
.form{display:grid;grid-template-columns:repeat(auto-fit,minmax(14rem,1fr));gap:.7rem;align-items:end}
.form label{display:grid;gap:.3rem;color:var(--dim);font-size:.8rem}
.form input,.form select{font:inherit;font-size:.9rem;min-height:2.6rem;padding:0 .9rem;background:var(--panel-2);color:var(--ink-hi);border:1px solid var(--line);width:100%;box-sizing:border-box}
.form .wide{grid-column:1/-1}
.tools{display:flex;gap:.6rem;flex-wrap:wrap;align-items:center}
.btn{font:inherit;font-size:.78rem;font-weight:600;letter-spacing:.02em;background:var(--panel-2);color:var(--ink);border:1px solid var(--line);border-radius:var(--radius-item);min-height:2.25rem;padding:0 .9rem;cursor:pointer;text-decoration:none;display:inline-flex;align-items:center;justify-content:center;gap:.4rem;line-height:1.3}
.btn:hover{border-color:var(--phos)} .btn:disabled{opacity:.4;cursor:default}
.btn.go{background:var(--phos);border-color:var(--phos);color:var(--accent-ink)}
.btn.go:hover{background:var(--accent-hover);border-color:var(--accent-hover)}
.btn.danger{border-color:var(--red);color:var(--red)}
.chips{display:flex;flex-wrap:wrap;gap:.4rem}
.chip{font:inherit;font-size:.72rem;letter-spacing:.08rem;background:var(--panel-2);color:var(--soft);border:1px solid var(--line);padding:.3rem .55rem;cursor:pointer;min-height:0}
.ur .chip{letter-spacing:0;font-size:.9rem}
.chip[aria-pressed=true]{border-color:var(--phos);color:var(--ink-hi)}
.chip .n{margin-inline-start:.4rem;color:var(--dim)}
.tbl{overflow-x:auto}
.tbl table{border-collapse:collapse;width:100%;font-size:.8rem}
.tbl th,.tbl td{text-align:start;padding:.45rem .5rem;border-top:1px solid var(--line-2);white-space:nowrap;vertical-align:top}
.tbl th{color:var(--dim);font-weight:500}
.tbl td.song{white-space:normal;min-width:14rem}
.tbl td.notes{white-space:normal;max-width:22rem;color:var(--soft)}
.tbl .t{font-family:var(--display);font-weight:700;color:var(--ink-hi);text-decoration:none}
.tbl .t:hover{color:var(--phos)}
.tbl .tu{display:block;font-family:"Nastaliq",var(--mono);font-size:1rem;line-height:1.9;color:var(--soft)}
.st{font-size:.68rem;font-weight:600;letter-spacing:var(--label-ls);padding:.08rem .4rem;border:1px solid var(--line);color:var(--soft);white-space:nowrap}
.ur .st{letter-spacing:0;font-size:.85rem}
.st.assigned{border-color:var(--amber);color:var(--amber)} .st.in_progress{border-color:var(--phos);color:var(--phos)} .st.submitted{border-color:var(--blue);color:var(--blue)} .st.returned{border-color:var(--red);color:var(--red)} .st.approved{border-color:var(--good);color:var(--good)} .st.cancelled{opacity:.5}
.ok{color:var(--good)} .warn{color:var(--amber)} .bad{color:var(--red)} .dim{color:var(--dim)}
.ltr{direction:ltr;unicode-bidi:isolate}
.msg.ok{color:var(--good)} .msg.bad{color:var(--red)}
.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(20rem,1fr));gap:.8rem}
.card{border:1px solid var(--line);background:var(--panel-2);padding:.9rem 1rem;display:grid;gap:.5rem;min-width:0}
.card.returned{border-color:var(--red)} .card.assigned{border-color:var(--amber)}
.card .t{font-family:var(--display);font-weight:700;color:var(--ink-hi);font-size:1.05rem}
.card .tu{font-family:"Nastaliq",var(--mono);font-size:1.05rem;line-height:1.9;color:var(--soft)}
.card .meta{font-size:.78rem;color:var(--dim)}
.card .notes{font-size:.82rem;color:var(--soft);white-space:pre-wrap}
/* Day 29 — Approvals page */
.pendingcard .song{display:flex;gap:.6rem;align-items:baseline;flex-wrap:wrap}
.pendingcard .tools input{font:inherit;font-size:.85rem;min-height:2.2rem;padding:0 .6rem;background:var(--panel-2);color:var(--ink-hi);border:1px solid var(--line);flex:1;min-width:14rem}
.plain{margin:0;padding:0;list-style:none;display:grid;gap:.35rem;font-size:.82rem}
.plain li{border-top:1px solid var(--line-2);padding-top:.35rem}
.plain li.note{border:0}

/* 28 Sep — give a task to another member, inline under the row */
.give2row td{background:var(--panel-2);white-space:normal}
.give2row .tools label{display:inline-flex;gap:.4rem;align-items:center;font-size:.8rem;color:var(--dim)}
.give2row select,.give2row input.why{font:inherit;font-size:.85rem;min-height:2.2rem;padding:0 .5rem;background:var(--panel);color:var(--ink-hi);border:1px solid var(--line)}
.give2row input.why{flex:1;min-width:16rem}
/* notifications on MY TASKS */
.notes-list{display:grid;gap:.5rem}
.notice{border:1px solid var(--line);background:var(--panel-2);padding:.6rem .8rem;display:grid;gap:.25rem}
.notice.unread{border-color:var(--amber)}
.notice .t{font-weight:700;color:var(--ink-hi)}
.notice .b{font-size:.85rem;color:var(--soft);white-space:pre-wrap}
.notice .m{font-size:.75rem;color:var(--dim)}
.form label.check{display:flex;align-items:center;gap:.5rem;color:var(--ink)} .form label.check input{width:auto;min-height:0}