:root{
  --bg:#ffffff; --bg-soft:#f7f8fa; --line:#e8e9ee;
  --text:#1f2937; --muted:#6b7280;
  --accent:#0b6efd; --danger:#ef4444;
  --radius:14px; --shadow:0 8px 28px rgba(0,0,0,.06);
}




/* tabela contêiner (mantida por compatibilidade) */
.docs-table{
  width:100%;
  border-collapse:separate;
  border-spacing:0 10px;         /* “cards” separados por espaço */
}
.docs-table td{ border:none; padding:0 12px; }

/* card de documento */
.doc-card{
  display:grid;
  grid-template-columns: 48px 1fr auto;
  gap:12px;
  align-items:center;
  padding:12px;
  background:#fff;
  border:1px solid var(--line);
  border-radius:var(--radius);
  box-shadow:var(--shadow);
  cursor:pointer;
  transition: transform .08s ease, box-shadow .12s ease, border-color .12s ease;
}
.doc-card:hover{ transform:translateY(-1px); box-shadow:0 10px 34px rgba(0,0,0,.08); }

/* ícone / thumb */
.doc-card__icon{
  width:48px; height:48px; display:flex; align-items:center; justify-content:center;
  color:#475569; font-size:28px;
}
.doc-thumb{
  width:44px; height:44px; object-fit:cover; border-radius:10px; border:1px solid var(--line);
}

/* meta */
.doc-card__meta{ min-width:0; }
.label{ font-weight:700; color:#0f172a; }
.muted{ color:var(--muted); }
.sep{ color:#c0c4cc; margin:0 6px; }

.doc-card__name{
  font-weight:700; color:#0f172a; margin-bottom:4px;
  overflow-wrap:anywhere; word-break:break-word;
}
.doc-card__info{
  font-size:12px; color:var(--muted);
}
.doc-card__audio{ margin-top:8px; }
.doc-audio{ width:220px; height:28px; }

/* ações */
.doc-card__actions{ display:flex; align-items:center; gap:8px; }
.icon-btn{
  width:38px; height:38px; display:inline-flex; align-items:center; justify-content:center;
  border-radius:12px; border:1px solid var(--line); background:#fff; color:#111827;
  transition:box-shadow .12s ease, transform .08s ease, border-color .12s ease, background .12s ease, color .12s ease;
  cursor:pointer;
}
.icon-btn:hover{ box-shadow:var(--shadow); transform:translateY(-1px); }
.icon-btn:disabled{ opacity:.5; cursor:not-allowed; }
.icon-btn--danger{ color:#b91c1c; border-color:#f2cccc; background:#fff7f7; }
.icon-btn--danger:hover{ border-color:#ef9a9a; background:#fff2f2; }

/* “hover” legado do seu helper */
.hover2{ background:#eef2ff !important; }