Fix design system violations: replace off-brand colors with terminal palette

- dashboard.css: replace all hardcoded Tailwind hex colors (#2d3748, #1a202c,
  #e2e8f0, #4a5568, #007cba, #3b82f6 etc.) in dark-mode sections and component
  styles with terminal CSS variables (--bg-*, --text-*, --border-color,
  --terminal-green/amber)
- dashboard.css: fix card-priority colors white/black → var(--bg-primary)
- dashboard.css: fix card-assignee border-radius: 50% → 0 (no circles rule)
- dashboard.css: fix mobile bottom-sheet border-radius: 12px → 0
- dashboard.css: fix search-box focus border (#007cba → var(--terminal-green))
- dashboard.css: fix save-filter button blue (#3b82f6) → terminal green
- dashboard.css: fix search-results-info blue highlight → terminal green
- dashboard.css: fix btn-bulk/btn-secondary dark-mode bootstrap colors → terminal
- ticket.css: replace comprehensive dark-mode Tailwind hex block with CSS vars
- ticket.css: fix status-select white/black text → var(--bg-primary)
- ticket.css: fix status-select.status-resolved hardcoded #28a745 → var(--status-open)
- ticket.css: fix timeline dark-mode hardcoded colors → CSS vars
- ticket.css: fix .slider:before background white → var(--bg-primary)
- ticket.css: fix .btn-danger:hover color white → var(--bg-primary)
- ticket.css: fix visibility-groups-list label border-radius: 4px → 0
- ticket.css: add will-change: opacity to age-warning/age-critical animations
- views: bump CSS version strings to v=20260319c
- views/DashboardView.php: add aria-labels to card view quick action buttons

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

assets/css/ticket.css

@@ -347,6 +347,7 @@ textarea[data-field="description"]:not(:disabled)::after {
     background: rgba(255, 176, 0, 0.1);
     box-shadow: 0 0 6px rgba(255, 176, 0, 0.4);
     animation: pulse-warning 2s ease-in-out infinite;
+    will-change: opacity;
 }
 
 .ticket-age.age-critical {
@@ -355,6 +356,7 @@ textarea[data-field="description"]:not(:disabled)::after {
     background: rgba(255, 77, 77, 0.15);
     box-shadow: 0 0 8px rgba(255, 77, 77, 0.5);
     animation: pulse-critical 1s ease-in-out infinite;
+    will-change: opacity;
 }
 
 @keyframes pulse-warning {
@@ -1172,7 +1174,7 @@ textarea.editable {
     width: 16px;
     left: 4px;
     bottom: 4px;
-    background-color: white;
+    background-color: var(--bg-primary);
     transition: transform 0.4s ease;
 }
 
@@ -1331,24 +1333,24 @@ input:checked + .slider:before {
 }
 
 body.dark-mode .timeline-content {
-    --card-bg: #2d3748;
-    --border-color: #444;
-    --text-muted: #a0aec0;
-    --text-secondary: #cbd5e0;
-    background: #2d3748;
-    color: #f7fafc;
+    --card-bg: var(--bg-tertiary);
+    --border-color: var(--border-color);
+    --text-muted: var(--text-muted);
+    --text-secondary: var(--text-secondary);
+    background: var(--bg-tertiary);
+    color: var(--text-primary);
 }
 
 body.dark-mode .timeline-header strong {
-    color: #f7fafc;
+    color: var(--text-primary);
 }
 
 body.dark-mode .timeline-action {
-    color: #a0aec0;
+    color: var(--text-muted);
 }
 
 body.dark-mode .timeline-date {
-    color: #718096;
+    color: var(--text-secondary);
 }
 /* Status select dropdown */
 .status-select {
@@ -1376,22 +1378,22 @@ body.dark-mode .timeline-date {
 /* Status colors for dropdown */
 .status-select.status-open {
     background-color: var(--status-open) !important;
-    color: white !important;
+    color: var(--bg-primary) !important;
 }
 
 .status-select.status-in-progress {
     background-color: var(--status-in-progress) !important;
-    color: #212529 !important;
+    color: var(--bg-primary) !important;
 }
 
 .status-select.status-closed {
     background-color: var(--status-closed) !important;
-    color: white !important;
+    color: var(--bg-primary) !important;
 }
 
 .status-select.status-resolved {
-    background-color: #28a745 !important;
-    color: white !important;
+    background-color: var(--status-open) !important;
+    color: var(--bg-primary) !important;
 }
 
 /* Dropdown options inherit colors */
@@ -1402,8 +1404,8 @@ body.dark-mode .timeline-date {
 }
 
 body.dark-mode .status-select option {
-    background-color: #2d3748;
-    color: #f7fafc;
+    background-color: var(--bg-tertiary);
+    color: var(--text-primary);
 }
 
 /* Dark mode for Activity tab and general improvements */
@@ -1420,48 +1422,38 @@ body.dark-mode #activity-tab p {
     color: var(--text-primary, #f7fafc);
 }
 
-/* Comprehensive Dark Mode Fix - Ensure no white on white */
-body.dark-mode {
-    --bg-primary: #1a202c;
-    --bg-secondary: #2d3748;
-    --bg-tertiary: #4a5568;
-    --text-primary: #e2e8f0;
-    --text-secondary: #cbd5e0;
-    --text-muted: #a0aec0;
-    --border-color: #4a5568;
-    --card-bg: #2d3748;
-}
+/* Comprehensive Dark Mode Fix - terminal CSS variables apply throughout */
 
 /* Ensure ticket container has dark background */
 body.dark-mode .ticket-container {
-    background: #1a202c !important;
-    color: #e2e8f0 !important;
+    background: var(--bg-secondary) !important;
+    color: var(--text-primary) !important;
 }
 
 /* Ensure all ticket details sections are dark */
 body.dark-mode .ticket-details {
-    background: #1a202c !important;
-    color: #e2e8f0 !important;
+    background: var(--bg-secondary) !important;
+    color: var(--text-primary) !important;
 }
 
 /* Ensure detail groups are dark */
 body.dark-mode .detail-group {
     background: transparent !important;
-    color: #e2e8f0 !important;
+    color: var(--text-primary) !important;
 }
 
 /* Ensure labels are visible */
 body.dark-mode .detail-group label,
 body.dark-mode label {
-    color: #cbd5e0 !important;
+    color: var(--text-secondary) !important;
 }
 
 /* Fix textarea and input fields */
 body.dark-mode textarea,
 body.dark-mode input[type="text"] {
-    background: #2d3748 !important;
-    color: #e2e8f0 !important;
-    border-color: #4a5568 !important;
+    background: var(--bg-tertiary) !important;
+    color: var(--text-primary) !important;
+    border-color: var(--border-color) !important;
 }
 
 /* Ensure timeline event backgrounds are dark */
@@ -1471,30 +1463,30 @@ body.dark-mode .timeline-event {
 
 /* Fix any remaining white text issues */
 body.dark-mode .timeline-details {
-    color: #cbd5e0 !important;
+    color: var(--text-secondary) !important;
     background: transparent !important;
 }
 
 /* Fix comment sections */
 body.dark-mode .comment {
-    background: #2d3748 !important;
-    color: #e2e8f0 !important;
+    background: var(--bg-tertiary) !important;
+    color: var(--text-primary) !important;
 }
 
 body.dark-mode .comment-text {
-    color: #e2e8f0 !important;
+    color: var(--text-primary) !important;
 }
 
 body.dark-mode .comment-header {
-    color: #cbd5e0 !important;
+    color: var(--text-secondary) !important;
 }
 
 /* Fix any form elements */
 body.dark-mode select,
 body.dark-mode .editable {
-    background: #2d3748 !important;
-    color: #e2e8f0 !important;
-    border-color: #4a5568 !important;
+    background: var(--bg-tertiary) !important;
+    color: var(--text-primary) !important;
+    border-color: var(--border-color) !important;
 }
 
 /* ===== RESPONSIVE DESIGN - TERMINAL EDITION ===== */
@@ -1759,7 +1751,7 @@ body.dark-mode .editable {
 
 .btn-danger:hover {
     background: var(--priority-1);
-    color: white;
+    color: var(--bg-primary);
 }
 
 /* Mobile responsiveness for attachments */
@@ -2647,7 +2639,7 @@ body.dark-mode .editable {
         min-height: 44px;
         padding: 0.5rem;
         background: rgba(0, 255, 65, 0.05);
-        border-radius: 4px;
+        border-radius: 0;
     }
 }