/**
 * TubeRaker — Entry Status & Recovery actions (JB-3)
 * ---------------------------------------------------------------------------
 * Loaded AFTER pages/entries.css so it reuses that file's page-local tokens
 * (--color-on-brand, --color-error, --spacing-*, --font-size-*, --text-*).
 *
 * Rules honoured:
 *   - rem only (no pixel units; the viewport meta is the only template exception)
 *   - colours strictly via var(--…) tokens (both themes handled by the
 *     [data-theme] token switch — every colour below is theme-mapped)
 *   - mobile-first from 22.5rem: actions stack full-width, then flow into a row
 *   - interactive targets >= 2.75rem
 *
 * The withdraw confirmation dialog reuses the modals.css vocabulary
 * (.modal-overlay/.modal/.modal-sm/.modal__header/.modal__body/.modal__footer/
 * .modal__title/.modal__close) and the shared .btn--danger / .btn--secondary,
 * so no modal styling is re-declared here. Only the recovery action row is new.
 * ---------------------------------------------------------------------------
 */

/* Recovery action row — mobile-first: stacked, full-width buttons. */
.entry-actions {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-sm);
  margin-top: var(--spacing-md);
}
.entry-actions[hidden] { display: none; }

/* Guarantee a >= 2.75rem touch target on every control in the row. */
.entry-actions .btn,
.entry-actions a.btn {
  min-height: 2.75rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--spacing-xs);
}

/* Compact variant used inside my_entries card footers. */
.entry-actions--compact {
  margin-top: var(--spacing-sm);
  gap: var(--spacing-xs);
}

/* Withdraw (destructive) — give the ghost button a semantic error border
   so it reads as distinct from the neutral secondary/ghost actions. */
.entry-action--danger { border-color: var(--color-error); }

/* From 30rem the actions flow into a wrapping row and share the width. */
@media (min-width: 30rem) {
  .entry-actions {
    flex-direction: row;
    flex-wrap: wrap;
  }
  .entry-actions .btn { flex: 1 1 auto; }
}
