/* Print / Share / Like row on printable detail pages (router-injected with
 * the markup, see includes/printable-actions.php). The buttons reuse the
 * page's own .btn-secondary style; this only lays out the row and adds the
 * heart's liked state. */

.action-row { display: flex; gap: 10px; }
.action-row .btn-secondary { flex: 1 1 0; min-width: 0; padding-left: 12px; padding-right: 12px; white-space: nowrap; }
.action-row .btn-like { flex: 0 0 auto; min-width: 76px; }
.action-row .btn-secondary[hidden] { display: none; }

.btn-like svg { flex-shrink: 0; }
.btn-like .like-count { font-variant-numeric: tabular-nums; }
.btn-like .like-count:empty { display: none; }
.btn-like[aria-pressed="true"] { color: #e11d48; border-color: #fecdd3; background: #fff1f2; }
.btn-like[aria-pressed="true"]:hover { border-color: #fda4af; background: #ffe4e6; }
.btn-like[aria-pressed="true"] svg { fill: currentColor; }
.btn-like.pop svg { animation: like-pop 0.35s ease; }
@keyframes like-pop {
  0% { transform: scale(1); }
  40% { transform: scale(1.3); }
  100% { transform: scale(1); }
}
@media (prefers-reduced-motion: reduce) {
  .btn-like.pop svg { animation: none; }
}

/* One line under the row after liking: where the like was saved. */
.like-note { margin: -2px 0 0; font-size: 13px; line-height: 1.5; color: #64748b; text-align: center; }
.like-note a { color: #d97706; font-weight: 600; text-decoration: none; }
.like-note a:hover { text-decoration: underline; }
.like-note.error { color: #dc2626; }

.sr-only {
  position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0;
}
