inside .sidebar-header * with an INLINE style hardcoding `color: var(--accent)` (see adminNav() at * index.html line 771). Inline styles have specificity 1000, so we need * !important to override. The previous v1.13.9 patch targeted .co-name and * silently no-op'd because that class doesn't exist in the rendered DOM. */ body.theme-v2.page-dashboard .sidebar-header > div:nth-of-type(2) { color: rgba(255, 255, 255, 0.6) !important; } body.theme-v2.page-dashboard .nav-item { color: rgba(255, 255, 255, 0.72); font-weight: 500; } body.theme-v2.page-dashboard .nav-item:hover { background: rgba(255, 255, 255, 0.08); color: #FFFFFF; } body.theme-v2.page-dashboard .nav-item.active { background: rgba(255, 255, 255, 0.14); color: #FFFFFF; border-right-color: var(--v2-accent); /* green instead of orange */ } body.theme-v2.page-dashboard .main { background: var(--v2-bg); } body.theme-v2.page-dashboard .page-header h1 { color: var(--v2-text); font-weight: 700; letter-spacing: -0.01em; } body.theme-v2.page-dashboard .page-header p { color: var(--v2-text-muted); } /* === KPI tiles === * White card, 1px border, no drop shadow. Numbers in mono for scan-ability. * Labels in small caps for quiet hierarchy. Hover keeps interactivity since * dashboard tiles still navigate to their module. */ body.theme-v2.page-dashboard .stat-card { background: var(--v2-surface); border: 1px solid var(--v2-border); border-radius: var(--v2-radius); padding: var(--v2-space-md) var(--v2-space-lg); box-shadow: none; transition: border-color 0.15s, transform 0.05s; } body.theme-v2.page-dashboard .stat-card:hover { border-color: var(--v2-border-2); } body.theme-v2.page-dashboard .stat-card:active { transform: translateY(1px); } body.theme-v2.page-dashboard .stat-card .label { color: var(--v2-text-faint); font-size: 11px; font-weight: 600; letter-spacing: 1.2px; text-transform: uppercase; margin-bottom: var(--v2-space-sm); } body.theme-v2.page-dashboard .stat-card .value { color: var(--v2-text); font-size: 28px; font-weight: 600; font-family: var(--v2-font-mono); letter-spacing: -0.5px; line-height: 1.1; } body.theme-v2.page-dashboard .stat-card .change { font-size: 12px; color: var(--v2-text-muted); margin-top: var(--v2-space-sm); font-weight: 500; } body.theme-v2.page-dashboard .stat-card .change.up { color: var(--v2-green); } body.theme-v2.page-dashboard .stat-card .change.down { color: var(--v2-red); } /* Inline left-border accents on Overdue / Pending tiles map to semantic tokens */ body.theme-v2.page-dashboard .stat-card[style*="--danger"] { border-left: 3px solid var(--v2-red); } body.theme-v2.page-dashboard .stat-card[style*="--warning"] { border-left: 3px solid var(--v2-yellow); } /* === Cards (Project Health, System Status, Recent Activity) === */ body.theme-v2.page-dashboard .card { background: var(--v2-surface); border: 1px solid var(--v2-border); border-radius: var(--v2-radius); box-shadow: none; } body.theme-v2.page-dashboard .card h3 { color: var(--v2-text); font-weight: 600; } body.theme-v2.page-dashboard .card p { color: var(--v2-text-muted); } /* Project health bars — solid track + brand-tinted fill */ body.theme-v2.page-dashboard .progress-bar-bg { background: var(--v2-surface-2); border-radius: var(--v2-radius-pill); height: 6px; overflow: hidden; } body.theme-v2.page-dashboard .progress-bar { background: var(--v2-brand); border-radius: var(--v2-radius-pill); } /* === Status pills === * Notion / Linear style: pale tint background, saturated text. */ body.theme-v2.page-dashboard .status-pill, body.theme-v2.page-dashboard .badge { display: inline-flex; align-items: center; gap: var(--v2-space-xs); padding: 2px var(--v2-space-sm); border-radius: var(--v2-radius-pill); font-size: 11px; font-weight: 600; letter-spacing: 0.4px; text-transform: uppercase; border: none; } body.theme-v2.page-dashboard .status-pill.green, body.theme-v2.page-dashboard .badge.badge-green { color: var(--v2-green); background: var(--v2-green-bg); } body.theme-v2.page-dashboard .status-pill.yellow, body.theme-v2.page-dashboard .badge.badge-yellow { color: var(--v2-yellow); background: var(--v2-yellow-bg); } body.theme-v2.page-dashboard .status-pill.red, body.theme-v2.page-dashboard .badge.badge-red { color: var(--v2-red); background: var(--v2-red-bg); } /* === Buttons === * Primary stays brand navy. Outline gets a subtle border + hover-tint. */ body.theme-v2.page-dashboard .btn { background: var(--v2-surface); border: 1px solid var(--v2-border); color: var(--v2-text); border-radius: var(--v2-radius-sm); font-weight: 500; } body.theme-v2.page-dashboard .btn:hover { background: var(--v2-surface-2); border-color: var(--v2-border-2); } body.theme-v2.page-dashboard .btn-primary { background: var(--v2-brand); border-color: var(--v2-brand); color: var(--v2-brand-text); } body.theme-v2.page-dashboard .btn-primary:hover { background: var(--v2-brand-hover); border-color: var(--v2-brand-hover); } /* === Activity feed === */ body.theme-v2.page-dashboard .activity-item, body.theme-v2.page-dashboard .recent-activity > div { border-bottom: 1px solid var(--v2-border); padding: var(--v2-space-sm) 0; } body.theme-v2.page-dashboard .activity-item:last-child, body.theme-v2.page-dashboard .recent-activity > div:last-child { border-bottom: 0; } /* === Defensive overrides === * Existing dashboard markup uses var(--text-light), var(--border), etc. * Under theme-v2.page-dashboard, remap the legacy variables so we don't * have to chase every inline style. */ body.theme-v2.page-dashboard { --bg: var(--v2-bg); --card: var(--v2-surface); --border: var(--v2-border); --text: var(--v2-text); --text-light: var(--v2-text-muted); --primary: var(--v2-brand); --accent: var(--v2-accent); --success: var(--v2-green); --warning: var(--v2-yellow); --danger: var(--v2-red); }