/* ============================================================
   documents.css  —  My Documents page.
   Bootstrap cards/table/badges/buttons, themed to match the
   ORIGINAL design pixel-for-pixel (stat tiles + table metrics).
   Scoped under .page-documents.
   ============================================================ */

/* ---------- stat tiles (match original .stat-card exactly) ---------- */
.page-documents .doc-stat .card-body { padding: 16px 18px; }
.page-documents .doc-stat-ic  { font-size: 18px; color: var(--navy); margin-bottom: 10px; }
.page-documents .doc-stat-val { font-family: 'Fraunces', serif; font-size: 22px; font-weight: 500; color: var(--ink); }
.page-documents .doc-stat-lbl { font-size: 12px; color: var(--muted); margin-top: 3px; }

/* ---------- table (match original .order-table exactly) ---------- */
.page-documents .doc-card { overflow: hidden; }            /* round the table corners */
.page-documents .doc-table {
  --bs-table-bg: transparent;
  --bs-table-color: var(--ink2);
  --bs-table-cell-padding-y: 13px;
  --bs-table-cell-padding-x: 16px;
  --bs-table-border-color: var(--border);
  font-size: 13px; margin-bottom: 0;
}
.page-documents .doc-table thead th {
  padding: 11px 16px; font-size: 11px; text-transform: uppercase; letter-spacing: 0.7px;
  color: var(--muted); font-weight: 500; background: var(--surface2);
  border-bottom: 1px solid var(--border); white-space: nowrap;
}
.page-documents .doc-table td { color: var(--ink2); white-space: nowrap; vertical-align: middle; }
.page-documents .doc-table tbody tr:last-child td { border-bottom: 0; }
.page-documents .doc-table tbody tr:hover td { background: var(--surface2); }
.page-documents .doc-name { font-weight: 500; color: var(--ink); display: inline-flex; align-items: center; gap: 8px; }
.page-documents .doc-name i { color: var(--navy); }
.page-documents .doc-ref { font-size: 11px; color: var(--muted); }