/* Equal side columns keep the search field on the viewport centre. */
@media (min-width:1024px){
 html[data-theme] .app-header{--header-search-width:clamp(280px,calc(100vw - 800px),var(--hub-search-max));--header-actions-space:285px;grid-template-columns:minmax(250px,1fr) var(--header-search-width) minmax(250px,1fr)}
 html[data-theme] .app-header .header-search-tools{grid-column:2;grid-row:1;display:block;position:relative;width:100%}
 html[data-theme] .header-search-tools .global-search{width:100%;min-width:0;margin:0;max-width:none}
 html[data-theme] .header-search-tools .page-pins{position:absolute;left:calc(100% + 12px);top:50%;transform:translateY(-50%);max-width:clamp(52px,calc((100vw - var(--header-search-width))/2 - var(--header-actions-space) - 48px),232px)}
 html[data-theme] .header-page-actions{grid-column:3;grid-row:1;justify-self:end;min-width:0}
}
@media(min-width:1024px) and (max-width:1199px){
 html[data-theme] .app-header{--header-actions-space:170px}
 html[data-theme] .header-page-actions .page-pin{width:44px;padding:10px}
 .header-page-actions .page-pin span{display:none}
}
.dashboard-panels>.payment-summary{grid-column:1/-1}.payment-workspace{min-width:0}.payment-summary{grid-template-columns:repeat(4,minmax(0,1fr));margin:20px 0}
html[data-theme] main .payment-summary{grid-template-columns:repeat(4,minmax(0,1fr))}
html[data-theme] .client-workspace .payment-summary-card{background:var(--ws-surface);border:1px solid var(--ws-line);border-radius:16px;padding:20px}
.payment-summary-card{text-decoration:none;min-width:0}.payment-summary-card strong{display:block;overflow-wrap:anywhere;font-variant-numeric:tabular-nums}
html[data-theme] .payment-summary-card.payment-overdue{border-bottom:3px solid var(--ws-danger)}
html[data-theme] .payment-summary-card.payment-soon{border-bottom:3px solid var(--ws-warning)}
html[data-theme] .payment-summary-card.payment-paid{border-bottom:3px solid var(--ws-success,#21834b)}
.payment-filters{display:grid;grid-template-columns:2fr 1fr 1fr;gap:16px;margin:20px 0}.payment-filters label:only-child{grid-column:1/-1}
.payment-row{display:flex;align-items:flex-start;gap:24px;border-top:1px solid var(--ws-line);padding:24px 0;min-width:0}
.payment-row-main{flex:1;min-width:0}.payment-row h3{margin:0 0 8px;overflow-wrap:anywhere}
.payment-row-actions{display:flex;flex-direction:column;gap:10px;flex:0 1 240px}.payment-row-actions button{white-space:normal}
.payment-row-meta,.payment-amounts{display:flex;flex-wrap:wrap;gap:10px 20px;margin:12px 0;align-items:center}.payment-amounts strong{display:block}
.payment-history{margin-top:12px}.payment-history summary{cursor:pointer;font-size:14px;padding:8px 0}.payment-history p{overflow-wrap:anywhere}
.payment-status{white-space:normal}html[data-theme] .payment-status.paid{color:var(--ws-success,#1b7445);background:var(--ws-success-bg,#e9f6ee)}
html[data-theme] .payment-status.overdue{color:var(--ws-danger);background:var(--ws-danger-bg)}
html[data-theme] .payment-status:is(partial,.partial,.review){color:var(--ws-warning);background:var(--ws-warning-bg)}
html[data-theme] .payment-status:is(.due,.invoice){color:var(--ws-primary);background:var(--ws-selection)}
.payment-invoice-policy{min-width:0;border:1px solid var(--ws-line);border-radius:12px;padding:16px;display:grid;gap:12px}
.payment-invoice-policy legend{padding:0 6px}.payment-history .button{white-space:normal}
/* Text labels and colour are both visible; dates and priorities do not share a meaning. */
.task-state-todo{--task-accent:#64748b;--task-tint:#edf1f7}.task-state-in_progress{--task-accent:#1d5ab8;--task-tint:#e8f0ff}.task-state-review{--task-accent:#9257c7;--task-tint:#f2eaff}.task-state-done{--task-accent:#247e4b;--task-tint:#e8f5ed}
html[data-theme] :is(.task-native-card,.task-list-row){border-left:4px solid var(--task-accent);background:var(--ws-surface);color:var(--ws-text)}
html[data-theme] .task-state-badge{background:var(--task-tint);color:var(--task-accent)}
html[data-theme] .task-deadline-overdue .task-deadline-badge{background:var(--ws-danger-bg);color:var(--ws-danger)}
html[data-theme] .task-deadline-soon .task-deadline-badge{background:var(--ws-warning-bg);color:var(--ws-warning)}
html[data-theme] .task-priority-low.badge{background:var(--ws-container);color:var(--ws-secondary)}
html[data-theme] .task-priority-normal.badge{background:var(--ws-selection);color:var(--ws-primary)}
html[data-theme] .task-complete{margin-top:12px;border-color:var(--ws-success,#247e4b);color:var(--ws-success,#247e4b);min-height:44px}
html[data-theme] .task-board{grid-template-columns:repeat(3,minmax(220px,1fr))}
html[data-theme=dark] .task-state-badge{background:color-mix(in srgb,var(--task-accent) 25%,var(--ws-surface));color:color-mix(in srgb,var(--task-accent) 55%,white)}
@media(max-width:1023px){html[data-theme] main .payment-summary{grid-template-columns:repeat(2,minmax(0,1fr))}.payment-filters{grid-template-columns:1fr 1fr}.payment-filters>label:first-child{grid-column:1/-1}}
@media(max-width:599px){.payment-row{flex-direction:column;gap:12px}.payment-row-actions{flex:auto;width:100%}.payment-row-actions button{width:100%}.payment-summary{gap:10px}.payment-summary-card{padding:14px!important}.payment-summary-card h3{font-size:13px!important}.payment-summary-card strong{font-size:20px}.payment-filters{grid-template-columns:1fr}.payment-amounts{gap:12px}.payment-amounts>span{flex:1}}
