<div class="collapse bg-base-100">
    <input type="checkbox" id="collapse-deepeval-tox-{{ source_id }}" /> 
    <label for="collapse-deepeval-tox-{{ source_id }}" class="collapse-title text-base font-medium flex items-center gap-2 cursor-pointer">
      <svg data-src="https://unpkg.com/heroicons/20/solid/check-circle.svg" class="h-5 w-5"></svg>
      DeepEval Analysis: Toxicity Score ({{ evaluation.score|floatformat:3 }})
    </label>
    <div class="collapse-content">
      <div class="overflow-x-auto">
        <table class="table table-xs">
          <thead>
            <tr>
              <th>Score</th>
              <th>Reason</th>
              <th>Success</th>
              <th>Logs</th>
            </tr>
          </thead>
          <tbody>
            <tr>
              <td>{{ evaluation.score|floatformat:3 }}</td>
              <td class="whitespace-pre-wrap">{{ evaluation.reason }}</td>
              <td>
                {% if evaluation.success %}
                  <div class="badge badge-success">Pass</div>
                {% else %}
                  <div class="badge badge-error">Fail</div>
                {% endif %}
              </td>
              <td>
                <label for="logs-modal-deepeval-tox-{{ source_id }}" class="badge badge-ghost cursor-pointer">
                  View Logs
                </label>
              </td>
            </tr>
          </tbody>
        </table>
      </div>
    </div>
  </div>

  <!-- Modal for logs -->
  <input type="checkbox" id="logs-modal-deepeval-tox-{{ source_id }}" class="modal-toggle" />
  <div class="modal">
    <div class="modal-box">
      <h3 class="font-bold text-lg mb-4">DeepEval Logs</h3>
      <div class="bg-base-200 rounded-lg">
        <pre class="max-h-96 overflow-y-auto font-mono text-sm p-4 whitespace-pre-wrap">{{ evaluation.verbose_logs|pprint }}</pre>
      </div>
      <div class="modal-action">
        <label for="logs-modal-deepeval-tox-{{ source_id }}" class="btn">Close</label>
      </div>
    </div>
    <label class="modal-backdrop" for="logs-modal-deepeval-tox-{{ source_id }}">Close</label>
  </div>