feat: chat izq/der en tickets, correos con ultimo mensaje, dashboard filtrable solo admin/supervisor

frontend/src/app/globals.css

@@ -789,10 +789,87 @@ body {
 }
 
 .comment-internal .comment-bubble {
-  background: #fff3cd;
+  background: #fff3cd !important;
+  color: var(--text-dark) !important;
   border-left: 4px solid #ffc107;
 }
 
+.chat-thread .comment-bubble .comment-text a {
+  color: inherit;
+  text-decoration: underline;
+}
+
+/* Equipo (derecha, azul) hereda blanco; solicitante (izquierda, gris)
+   usa texto oscuro; el toggle de correo hereda el color de la burbuja */
+.comment-agent .comment-bubble .email-toggle {
+  color: rgba(255, 255, 255, 0.85);
+  font-size: 0.75rem;
+  text-decoration: none;
+}
+
+.comment-agent .comment-bubble .email-toggle:hover {
+  color: #fff;
+  text-decoration: underline;
+}
+
+.comment-customer .comment-bubble .email-toggle {
+  color: var(--primary);
+  font-size: 0.75rem;
+  text-decoration: none;
+}
+
+.comment-customer .comment-bubble .email-toggle:hover {
+  text-decoration: underline;
+}
+
+.comment-internal .comment-bubble .email-toggle {
+  color: var(--text-dark);
+}
+
+.chat-legend {
+  font-size: 0.7rem;
+  font-weight: 600;
+  text-transform: uppercase;
+  letter-spacing: 0.04em;
+}
+
+.chat-legend::before {
+  content: "";
+  display: inline-block;
+  width: 10px;
+  height: 10px;
+  border-radius: 50%;
+  margin-right: 4px;
+  vertical-align: baseline;
+}
+
+.chat-legend-left::before {
+  background: #dee2e6;
+  border: 1px solid #adb5bd;
+}
+
+.chat-legend-right::before {
+  background: var(--primary);
+}
+
+/* Dashboard: tarjetas clicables que filtran tickets */
+.stats-card-anchor {
+  display: block;
+  color: inherit;
+}
+
+.stats-card-anchor:hover {
+  color: inherit;
+}
+
+.stats-card-link {
+  cursor: pointer;
+}
+
+.stats-card-link:hover {
+  border: 1px solid rgba(0, 40, 93, 0.25);
+}
+
 .comment-author {
   font-size: 0.75rem;
   font-weight: 600;