/* Módulo Consultas y reclamos (tickets) · réplica de /panel/cpa/tickets */

/* KPIs con tonos que base.css no trae (secondary / danger) */
.bc-kpi.bc-tickets-kpi-neutro { background: linear-gradient(135deg, #64748b 0%, #475569 100%); }
.bc-kpi.bc-tickets-kpi-peligro { background: linear-gradient(135deg, #ef4444 0%, #dc2626 100%); }

/* Filtros apilados (estado / tipo / plazo) */
.bc-tickets-filtros .bc-pills { margin: 0.5rem 0; }
.bc-tickets-filtros { margin: 0.3rem 0 0.5rem; }
.bc-tickets-semaforo { margin: 0 0 0.75rem; font-size: 0.82rem; color: var(--bc-muted); }
.bc-tickets-muted { color: var(--bc-muted); }
.bc-tickets-fecha { font-size: 0.82rem; color: var(--bc-muted); }

/* Filas coloreadas por prioridad (las de SLA usan bc-fila-rojo / bc-fila-amarillo de base.css) */
.bc-tabla tr.bc-tickets-fila-urgente { background: #fef2f2; }
.bc-tabla tr.bc-tickets-fila-alta { background: #fffbeb; }

/* Botón de acción textual de la tabla (= .af-table-actions button) */
.bc-tickets-accion {
  font-family: var(--bc-font);
  font-size: 0.75rem;
  font-weight: 600;
  padding: 0.35rem 0.65rem;
  border-radius: 8px;
  border: 1px solid var(--bc-border);
  background: #fff;
  color: var(--bc-brand);
  cursor: pointer;
  white-space: nowrap;
}
.bc-tickets-accion:hover { background: #e0f2fe; border-color: #7dd3fc; }

/* Semáforo de plazo (SlaBadge) */
.bc-tickets-sla {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 0.25rem 0.65rem;
  border-radius: 999px;
  font-size: 0.8rem;
  font-weight: 700;
  white-space: nowrap;
}
.bc-tickets-sla-compacto { padding: 0.15rem 0.5rem; font-size: 0.75rem; }
.bc-tickets-sla-punto { width: 8px; height: 8px; border-radius: 50%; flex-shrink: 0; }
.bc-tickets-sla-verde { background: #dcfce7; color: #166534; }
.bc-tickets-sla-verde .bc-tickets-sla-punto { background: #22c55e; }
.bc-tickets-sla-amarillo { background: #fef9c3; color: #854d0e; }
.bc-tickets-sla-amarillo .bc-tickets-sla-punto { background: #eab308; }
.bc-tickets-sla-rojo { background: #fee2e2; color: #991b1b; }
.bc-tickets-sla-rojo .bc-tickets-sla-punto { background: #ef4444; }

/* Estado vacío (EmptyState) */
.bc-tickets-vacio { text-align: center; padding: 3rem 1.5rem; color: var(--bc-muted); }
.bc-tickets-vacio-icono { display: block; width: 3rem; height: 3rem; margin: 0 auto 1rem; color: #cbd5e1; }
.bc-tickets-vacio-icono svg { width: 100%; height: 100%; }
.bc-tickets-vacio h3 { margin: 0 0 0.35rem; font-size: 1.1rem; font-weight: 700; color: var(--bc-text); }
.bc-tickets-vacio p { margin: 0 0 1rem; font-size: 0.9rem; }

/* Modal (detalle y dashboard) */
.bc-tickets-modal-ancha { max-width: 1080px; }
.bc-tickets-modal-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 0.75rem; margin-bottom: 1rem; }
.bc-tickets-modal-titulo {
  margin: 0;
  font-family: var(--bc-display);
  font-size: 1.15rem;
  font-weight: 700;
  letter-spacing: 0;
  text-transform: none;
  color: var(--bc-brand-dark);
  line-height: 1.25;
}
.bc-tickets-modal-head .bc-modal-cerrar { float: none; flex-shrink: 0; }
.bc-tickets-stack > * + * { margin-top: 1rem; }
.bc-tickets-enviada { margin: 0; color: var(--bc-muted); font-size: 0.9rem; }
.bc-tickets-cambiar { display: flex; gap: 0.5rem; align-items: center; flex-wrap: wrap; }
.bc-tickets-cambiar .bc-tickets-select { width: auto; max-width: 14rem; }
.bc-tickets-intro { margin: 0 0 1rem; color: var(--bc-muted); font-size: 0.9rem; }
.bc-tickets-h3 { margin: 0 0 0.5rem; font-size: 1rem; font-weight: 700; color: var(--bc-text); }

/* Adjuntos (TicketAdjuntosPanel) */
.bc-tickets-adjuntos > * + * { margin-top: 0.75rem; }
.bc-tickets-sin-adjuntos { margin: 0.35rem 0 0; color: var(--bc-muted); font-size: 0.88rem; }
.bc-tickets-imagenes { display: flex; flex-wrap: wrap; gap: 0.75rem; }
.bc-tickets-imagen { position: relative; width: 128px; }
.bc-tickets-imagen-btn {
  display: block; width: 100%; padding: 0; border: 1px solid var(--bc-border); border-radius: 8px;
  overflow: hidden; background: #fff; cursor: pointer; text-align: left; font: inherit;
}
.bc-tickets-imagen-btn img { width: 100%; height: 96px; object-fit: cover; display: block; }
.bc-tickets-imagen-nombre {
  display: block; padding: 0.35rem 0.5rem; font-size: 0.72rem; color: var(--bc-muted);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.bc-tickets-docs { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 6px; }
.bc-tickets-doc {
  display: flex; align-items: center; gap: 0.75rem; padding: 0.55rem 0.75rem;
  border: 1px solid var(--bc-border); border-radius: 8px; background: #fff;
}
.bc-tickets-doc-nombre { flex: 1; min-width: 0; }
.bc-tickets-doc-nombre a { font-weight: 600; color: var(--bc-brand); text-decoration: none; }
.bc-tickets-doc-tam { margin-left: 8px; color: var(--bc-muted); font-size: 0.8rem; }
.bc-tickets-btn-sm { font-size: 0.8rem; padding: 0.4rem 0.8rem; text-decoration: none; }

/* Hilo de mensajes (MessageTimeline) */
.bc-tickets-timeline { display: flex; flex-direction: column; gap: 0.75rem; }
.bc-tickets-mensaje { padding: 0.75rem 0.9rem; border-radius: 10px; background: #f8fafc; border: 1px solid #e2e8f0; }
.bc-tickets-mensaje-admin { background: rgba(79, 70, 229, 0.06); border-color: rgba(79, 70, 229, 0.2); }
.bc-tickets-mensaje-head { display: flex; justify-content: space-between; gap: 0.5rem; font-size: 0.75rem; color: var(--bc-muted); margin-bottom: 0.35rem; }
.bc-tickets-mensaje-autor { font-weight: 600; color: var(--bc-text); }
.bc-tickets-mensaje-rol { font-weight: 400; color: var(--bc-muted); }
.bc-tickets-mensaje-cuerpo { margin: 0; white-space: pre-wrap; font-size: 0.9rem; color: var(--bc-text); }

/* Respuesta oficial */
.bc-tickets-responder { display: flex; gap: 0.5rem; flex-wrap: wrap; }
.bc-tickets-responder input { flex: 1; min-width: 12rem; width: auto; }
.bc-tickets-responder button:disabled { opacity: 0.55; cursor: not-allowed; }

/* Dashboard SLA */
.bc-tickets-sla-grafico { display: flex; flex-wrap: wrap; gap: 1.25rem; align-items: center; margin: 1rem 0 1.25rem; }
.bc-tickets-sla-detalle { flex: 1 1 220px; min-width: 0; }
.bc-tickets-sla-sub { margin: 0 0 0.75rem; font-weight: 700; }
.bc-tickets-promedio { margin: 0.85rem 0 0; font-size: 0.85rem; color: var(--bc-muted); }
.bc-tickets-barras { display: grid; gap: 0.85rem; }
.bc-tickets-barra-head { display: flex; justify-content: space-between; margin-bottom: 4px; font-size: 0.85rem; }
.bc-tickets-barra-head span:first-child { font-weight: 700; }
.bc-tickets-barra { height: 14px; border-radius: 8px; background: #e5e7eb; overflow: hidden; }
.bc-tickets-barra > span { display: block; height: 100%; border-radius: 8px; transition: width 0.3s ease; }
.bc-tickets-donut { display: flex; align-items: center; justify-content: center; position: relative; }
.bc-tickets-donut-centro { position: absolute; text-align: center; line-height: 1.2; }
.bc-tickets-donut-total { font-size: 1.6rem; font-weight: 800; }
.bc-tickets-donut-centro .bc-tickets-muted { font-size: 0.75rem; }
.bc-tickets-restante { font-weight: 700; }

/* Visor de imagen (preview) */
.bc-tickets-preview {
  position: fixed; inset: 0; z-index: 80; background: rgba(0, 0, 0, 0.72);
  display: flex; align-items: center; justify-content: center; padding: 24px;
}
.bc-tickets-preview-panel {
  max-width: min(960px, 96vw); max-height: 90vh; background: #fff; border-radius: 12px; overflow: hidden;
  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.35);
}
.bc-tickets-preview-head {
  display: flex; justify-content: space-between; align-items: center; gap: 12px;
  padding: 0.75rem 1rem; border-bottom: 1px solid var(--bc-border);
}
.bc-tickets-preview-head strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.bc-tickets-preview-acciones { display: flex; gap: 8px; }
.bc-tickets-preview-panel img { display: block; max-width: 100%; max-height: 78vh; margin: 0 auto; }