{% extends "base.html" %}
{% block title %}SecuVault - {{ secret.name }}{% endblock %}

{% block content %}
<div class="row justify-content-center">
  <div class="col-md-7">
    <div class="card shadow-sm">
      <div class="card-header d-flex justify-content-between align-items-center">
        <strong>{{ secret.name }}</strong>
        <span class="badge bg-light text-dark border">v{{ secret.version }}</span>
      </div>
      <div class="card-body">
        <label class="form-label fw-bold">Valeur du secret:</label>
        <div class="p-3 bg-warning-subtle border border-warning rounded font-monospace user-select-all">{{ plaintext }}</div>
        <p class="text-muted small mt-2">Mis à jour le {{ secret.updated_at }}</p>
      </div>
      <div class="card-footer d-flex gap-2">
        <a href="/secrets" class="btn btn-outline-secondary btn-sm">Retour</a>
        <a href="/secrets/{{ secret.id }}/rotate" class="btn btn-warning btn-sm">Rotation</a>
      </div>
    </div>
  </div>
</div>
{% endblock %}