/* Workspace → Dashboard: same visual language as the Projects portfolio — UI-font figures,
   colour only for state, flat surfaces. Changes presentation only; markup and handlers are unchanged. */
.pj-date-cap{font-size:var(--ui-caption);color:var(--text3);font-variant-numeric:tabular-nums}
.pj-link{color:var(--accent-ink);text-decoration:underline;text-underline-offset:2px}
/* A normal priority is the default, so it reads as plain text; only high/low carry a chip. */
.pj-prio.normal{background:transparent;color:var(--text3);padding-left:0;font-weight:600}
/* Kanban: quieter column heads, cards without lift. */
.pj-dash-kanban-head>span{letter-spacing:.04em}
#pj-dash-kanban .proj-task-card:hover{transform:none}
@media (prefers-reduced-motion:reduce){.pj-dash-stat-card{animation:none}}
/* Overdue is the one state a table row announces, on its due date only. */
.pj-table-row.late .pj-table-date-input{color:var(--chip-red-fg);font-weight:600}
.pj-table-time-input:placeholder-shown{opacity:.5}

/* Numbers: the same language as Dissemination's overview — a KPI strip, then panels of hand-built bars in
   tints of the accent. Colour carries the series, never decoration; everything is HTML so it re-themes itself. */
.dsh-stats{display:flex;flex-direction:column;gap:16px}
.dsh-loading,.dsh-empty{color:var(--text3);font-size:var(--ui-label);padding:14px 0}
.dsh-kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border:1px solid var(--border);border-radius:var(--r-md);background:var(--bg2)}
.dsh-kpi{padding:13px 16px;border-right:1px solid var(--border);min-width:0}
.dsh-kpi:last-child{border-right:0}
.dsh-kpi-value{font-size:24px;font-weight:600;line-height:1.15;font-variant-numeric:tabular-nums}
.dsh-kpi-value small{font-size:var(--ui-body);font-weight:400;color:var(--text3)}
.dsh-kpi-value.muted{color:var(--text3)}
.dsh-kpi-label{margin-top:3px;font-size:var(--ui-caption);color:var(--text3)}
.dsh-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.dsh-grid>*{min-width:0}
.dsh-panel{border:1px solid var(--border);border-radius:var(--r-md);background:var(--bg2);padding:14px 16px 12px;height:100%}
.dsh-panel-head{display:flex;align-items:flex-start;justify-content:space-between;gap:10px;margin-bottom:8px}
.dsh-panel-title{font-size:var(--ui-subsection);font-weight:700}
.dsh-panel-note{margin-top:2px;font-size:var(--ui-caption);color:var(--text3)}
.dsh-legend{display:flex;flex-wrap:wrap;gap:4px 14px;justify-content:flex-end;margin:0 0 6px;font-size:var(--ui-caption);color:var(--text3)}
.dsh-legend span{display:inline-flex;align-items:center;gap:5px;min-width:0}
.dsh-legend i,.dsh-seg{background:var(--accent)}
.dsh-legend i{width:8px;height:8px;border-radius:2px;flex:none}
.dsh-legend i.t1,.dsh-seg.t1{background:color-mix(in srgb,var(--accent) 60%,var(--bg))}
.dsh-legend i.t2,.dsh-seg.t2{background:color-mix(in srgb,var(--accent) 30%,var(--bg))}
.dsh-legend i.mark{height:2px;width:12px;border-radius:0;background:var(--text2)}
.dsh-bars{display:grid;grid-template-columns:repeat(var(--dsh-n),minmax(0,1fr));gap:6px;align-items:end;border-bottom:1px solid var(--border)}
.dsh-bars.wide{gap:3px}
.dsh-col{display:flex;flex-direction:column;align-items:center;justify-content:flex-end;min-width:0}
.dsh-total{font-size:var(--ui-caption);font-weight:600;font-variant-numeric:tabular-nums;color:var(--text2);height:16px;line-height:16px}
.dsh-stack{position:relative;display:flex;flex-direction:column-reverse;width:100%;max-width:34px;height:var(--dsh-h)}
.dsh-bars.wide .dsh-stack{max-width:14px}
.dsh-seg{display:block;width:100%;flex:none}
.dsh-seg:first-child{border-radius:0 0 2px 2px}
.dsh-stack .dsh-seg:last-of-type{border-radius:2px 2px 0 0}
.dsh-mark{position:absolute;left:-3px;right:-3px;height:0;border-top:2px solid var(--text2);pointer-events:none}
.dsh-axis{align-self:stretch;text-align:center;font-size:var(--ui-caption);color:var(--text3);height:18px;line-height:18px;margin-top:4px;white-space:nowrap;overflow:visible;font-variant-numeric:tabular-nums}
.dsh-bars.peaked .dsh-col:not(.peak) .dsh-seg{background:color-mix(in srgb,var(--accent) 32%,var(--bg))}
.dsh-hbars{display:flex;flex-direction:column;gap:9px;padding-top:4px}
.dsh-hrow{display:grid;grid-template-columns:minmax(0,38%) minmax(0,1fr) 28px;align-items:center;gap:10px;font-size:var(--ui-label)}
.dsh-hlabel{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.dsh-htrack{height:8px;border-radius:4px;background:var(--bg4);overflow:hidden}
.dsh-htrack i{display:block;height:100%;background:var(--accent);border-radius:4px}
.dsh-hval{text-align:right;font-variant-numeric:tabular-nums;color:var(--text2)}
.pj-rhythm-toggle{width:auto}
@media (max-width:900px){.dsh-grid{grid-template-columns:minmax(0,1fr)}.dsh-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}.dsh-kpi:nth-child(2){border-right:0}.dsh-kpi:nth-child(-n+2){border-bottom:1px solid var(--border)}}

/* Task cards on the Dashboard board: flat, no coloured edge. The round control on the left is the state;
   project and kind are plain text; red appears only for an overdue date or a high priority. */
#pj-dashboard-queue .proj-task-card.dashboard-work-card{border:1px solid var(--border);border-left-width:1px;box-shadow:none;background:var(--bg2);padding:9px 10px;transition:border-color .12s}
#pj-dashboard-queue .proj-task-card.dashboard-work-card:hover{border-color:var(--border2);box-shadow:none;transform:none}
.dtc-main{display:flex;align-items:flex-start;gap:9px}
.dtc-body{flex:1;min-width:0}
.dtc .proj-task-title{font-size:var(--ui-label);overflow-wrap:anywhere}
.dtc.done .proj-task-title{color:var(--text3);text-decoration:line-through;text-decoration-color:var(--border2)}
.dtc-check{margin-top:1px}
.dtc-check.doing{border-color:var(--pf-s3)}
.dtc-check.doing:hover{border-color:var(--pf-s4)}
.dtc-doing{color:var(--pf-s4);font-weight:500}
.dtc-meta{display:flex;flex-wrap:wrap;align-items:center;gap:2px 6px;margin-top:3px;font-size:var(--ui-caption);color:var(--text3)}
.dtc-where{min-width:0;overflow-wrap:anywhere}
.dtc-sep{opacity:.6}
.dtc-high{display:inline-flex;align-items:center;gap:3px;color:var(--accent-ink);font-weight:600}
.dtc-high svg{width:11px;height:11px}
.pj-dash-tag{display:inline;margin:0;padding:0;background:none;color:var(--text3);font-size:var(--ui-caption);font-weight:400}
/* Recurring duties and bookings share the flat look */
#pj-dashboard-queue .dashboard-info-card .dashboard-card-label{font-weight:500}
#pj-dash-kanban .proj-task-col-head-dot,#pj-dash-kanban .proj-task-col[data-status] .proj-task-col-head-dot{background:var(--text3)}

/* An overdue date is red text, not a red chip; the delete button only shows while the card is hovered or focused. */
.dtc .pj-due-over{font-family:inherit;background:none;padding:0;border-radius:0;color:var(--chip-red-fg);font-weight:600;font-size:var(--ui-caption)}
.dtc .dtc-main>.icon-btn{opacity:0;transition:opacity .12s}
.dtc:hover .dtc-main>.icon-btn,.dtc:focus-within .dtc-main>.icon-btn,.dtc .dtc-main>.icon-btn:focus-visible{opacity:1}
@media (hover:none){.dtc .dtc-main>.icon-btn{opacity:1}}

/* A column that holds its "Show N more" button grows to fit its eight cards instead of scrolling inside itself */
#pj-dash-kanban .proj-task-col-body:has(> .mq-more.is-collapsed){max-height:none}
#pj-dash-kanban .proj-task-col-body>.mq-more{margin:4px 0 2px 8px}

/* Table on a phone: no sideways scroll — each row is a small card (check + title, then its project, people, priority, date and status).
   The column headings stay as a row of sort chips. */
@media (max-width:700px){
  .pj-table-wrap{border:0;overflow:hidden;border-radius:0}   /* the date picker keeps an invisible native input over its icon: it must not make the page scroll */
  .pj-table,.pj-table thead,.pj-table tbody{display:block}
  .pj-table thead tr{display:flex;gap:6px;overflow-x:auto;padding:0 0 10px;align-items:center}
  .pj-table thead th{flex:none;border:0;border-radius:999px;padding:6px 12px}
  .pj-table thead th.pj-table-check{width:auto;padding:6px 10px}
  .pj-table tbody tr.pj-table-row{display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px;padding:10px 2px;border-bottom:1px solid var(--border)}
  .pj-table tbody tr.pj-table-row:last-child{border-bottom:0}
  .pj-table tbody tr.pj-table-row td{display:block;border:0;padding:0;width:auto}
  .pj-table tbody tr.pj-table-row td.pj-table-check{flex:0 0 22px;padding:0}
  .pj-table tbody tr.pj-table-row td.pj-table-title{display:flex;flex:1 1 calc(100% - 34px);min-width:0}
  .pj-table tbody tr.pj-table-row .pj-table-title-input{flex:1;min-width:0;width:auto}
  .pj-table tbody tr.pj-table-row td:nth-child(3){margin-left:32px}
  .pj-table tbody tr.pj-table-row td{min-width:0;max-width:100%}
  .pj-table tbody tr.pj-table-row td:nth-child(6){display:flex;flex-wrap:wrap;align-items:center;gap:2px 8px}
  .pj-table tbody tr.pj-table-row td:has(> .pj-table-none){display:none}
  .pj-table tbody tr.pj-table-group-row,.pj-table tbody tr.pj-table-group-row td,.pj-table tbody tr.pj-table-row-editing,.pj-table tbody tr.pj-table-row-editing td{display:block}
  .pj-table-group-row td{border-radius:var(--r-sm)}
}

