/* ==================================================================
   TASKS — v1.45.11 hybrid (Phil, 24 Sep 2026)
   Structure from 08_Tasks_APPROVED_LOCKED.html ("file 08"): board and
   card surfaces, 4px coloured left edge, crossed-out done tasks, icon
   box on the title, Clear completed + sort controls.
   Kept from the build: 3 columns, bigger text, priority-coloured pills,
   avatar + first name. Loads after new-ui-list-viewers.css.
   ================================================================== */

[data-new-ui] .nu-tk-board {
  border-radius: 8px; padding: 14px 14px 16px;                                         /* file 08 */
  background: linear-gradient(180deg,#ffffff,#f8fbfc); border: 1px solid #d4e0e6;      /* file 08 */
  box-shadow: 0 10px 24px rgba(17,47,69,.075);                                          /* file 08 */
}
[data-new-ui] .nu-tk-board-head { border-bottom: 0; padding: 0 4px 12px; margin-bottom: 0; }   /* file 08 */
[data-new-ui] .nu-tk-board-title { font-size: 18px; font-weight: 800; letter-spacing: -.015em; gap: 9px; }   /* file 08 */
[data-new-ui] .nu-tk8-iconbox {
  width: 30px; height: 30px; border-radius: 7px; display: grid; place-items: center;   /* file 08 */
  background: linear-gradient(180deg,#ecfaf6,#dff4ee); border: 1px solid #cdebe2; color: #0c9475;   /* file 08 */
  box-shadow: inset 0 1px 0 rgba(255,255,255,.95), 0 2px 5px rgba(12,148,117,.06);     /* file 08 */
}
[data-new-ui] .nu-tk8-iconbox svg { width: 17px; height: 17px; stroke: currentColor; fill: none; stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; }   /* file 08 */
[data-new-ui] .nu-tk8-tools { display: flex; align-items: center; gap: 8px; }           /* file 08 */
[data-new-ui] .nu-tk-board-sort { font-size: 13px; color: var(--nu-c-text-muted); font-weight: 600; }   /* file 08 (4j: was 11px) */
[data-new-ui] .nu-tk8-btn {
  padding: 7px 10px; border-radius: 999px; border: 1px solid #d5e0e6;                  /* file 08 */
  background: linear-gradient(180deg,#fff,#f6fafb); color: #3f5a6d;                    /* file 08 */
  box-shadow: inset 0 1px 0 rgba(255,255,255,.95), 0 2px 5px rgba(17,47,69,.035);      /* file 08 */
  font-family: var(--nu-t-family); font-size: 13px; font-weight: 800; cursor: pointer; white-space: nowrap;
}
[data-new-ui] .nu-tk8-btn:hover { border-color: #b9cdd8; }

[data-new-ui] .nu-tk-card {
  min-height: 112px; border: 1px solid #dce5ea; border-left: 4px solid #57b9b5;        /* file 08 */
  border-radius: 7px; padding: 11px 11px 10px;                                          /* file 08 */
  background: linear-gradient(180deg,#ffffff 0%,#f8fbfc 100%);                          /* file 08 */
  box-shadow: inset 0 1px 0 rgba(255,255,255,.92), 0 4px 10px rgba(16,47,69,.055);      /* file 08 */
  transition: transform .12s, box-shadow .12s, border-color .12s;                       /* file 08 */
}
[data-new-ui] .nu-tk-card:hover {
  background: linear-gradient(180deg,#ffffff 0%,#f8fbfc 100%);
  transform: translateY(-1px); box-shadow: 0 8px 16px rgba(16,47,69,.095); border-color: #c3d4dd;   /* file 08 */
  border-left-color: #57b9b5;
}
[data-new-ui] .nu-tk-done { opacity: .88; border-left-color: #62b897; }                 /* file 08 */
[data-new-ui] .nu-tk-done:hover { border-left-color: #62b897; }
[data-new-ui] .nu-tk-done .nu-tk-card-title { text-decoration: line-through; color: #71808b; }   /* file 08 */
[data-new-ui] .nu-tk-check { width: 21px; height: 21px; border: 1.5px solid #9aaeba; border-radius: 5px; background: #fff; }   /* file 08 */
[data-new-ui] .nu-tk-check-done { background: #1ab18e; border-color: #1ab18e; color: #fff; }   /* file 08 */

[data-new-ui] .nu-tk-footer { align-items: center; }

@media (max-width: 760px) {
  [data-new-ui] .nu-tk-board-head { flex-direction: column; align-items: flex-start; gap: 8px; }
  [data-new-ui] .nu-tk8-tools { flex-wrap: wrap; }
}

/* Amendment 16 — task click narrows to that job */
[data-new-ui] .nu-tk8-jobbar { display: flex; align-items: center; gap: 10px; padding: 0 4px 12px; }
[data-new-ui] .nu-tk8-chip {
  display: inline-flex; align-items: center; gap: 8px; height: 34px; padding: 0 6px 0 13px; border-radius: 999px;
  background: linear-gradient(180deg,#ecfaf6,#dff4ee); border: 1px solid #cdebe2; color: #0a6f58;   /* file 08 iconbox tones */
  font-size: 14px; font-weight: 800;
}
[data-new-ui] .nu-tk8-chipx {
  width: 24px; height: 24px; border-radius: 50%; border: 0; background: rgba(255,255,255,.8); color: #0a6f58;
  font-size: 12px; font-weight: 900; cursor: pointer; display: grid; place-items: center;
}
[data-new-ui] .nu-tk8-chipx:hover { background: #fff; }

/* v1.45.40: Tasks page = folders (file 10 filing cabinet, same as Site Records / Archive) */
[data-new-ui] .nu-tk-folders { margin-top: 14px; }
[data-new-ui] .nu-tk-folderrow { cursor: pointer; }
[data-new-ui] .nu-tk-folderrow:hover, [data-new-ui] .nu-tk-folderrow:focus { background: #f6f9fc; outline: 0; }

/* v2.0.3 (Phil, phone screenshots): Tasks — the job name gets its own full line (was a squeezed pill overlapping
   the text around it); the filters fit inside the card */
@media (max-width: 767px){
  [data-new-ui] .nu-tk8-jobbar { flex-wrap: wrap; gap: 8px; }
  [data-new-ui] .nu-tk8-chip { order: 3; flex: 1 1 100%; height: auto; min-height: 36px; white-space: normal; line-height: 1.3; padding: 7px 12px; border-radius: 10px; text-align: left; }
  [data-new-ui] .nu-tk-toolbar { flex-wrap: wrap; gap: 8px; }
  [data-new-ui] .nu-tk-toolbar .nu-tk-search { flex: 1 1 100%; }
  [data-new-ui] .nu-tk-toolbar select { flex: 1 1 0; min-width: 0; max-width: none; }
}