/* Hover-action card — DESIGN.md §4 extension.
 *
 * Cards that surface their action buttons (edit / delete) only on
 * hover. At rest the card looks like a clean preview; on hover the
 * content blurs and a centered icon-button row fades in.
 *
 * Used by:
 *   - app/views/form_layouts/inspectors/_question.html.erb (question
 *     hero card — pencil + trash launchers)
 *
 * Anatomy:
 *   .hover-actions-card           wraps the card; sets relative
 *                                 positioning + content clipping.
 *   .hover-actions-card__content  the always-rendered card body.
 *                                 Blurs on parent hover.
 *   .hover-actions-card__overlay  absolutely-positioned action row
 *                                 covering the card. Hidden at rest;
 *                                 fades in on parent hover.
 */
.hover-actions-card {
  position: relative;
  overflow: hidden;
}

.hover-actions-card__content {
  transition: filter 150ms ease-out, opacity 150ms ease-out;
}

.hover-actions-card__overlay {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1.5rem;
  opacity: 0;
  pointer-events: none;
  /* Soft frosted-white wash sits between the blurred content and
     the action buttons. Lets the ghost-styled buttons keep their
     transparent rest + hover-tinted state intact (a `bg-white`
     utility on the buttons themselves would `!important`-override
     Tabler's hover bg and turn white-icon-on-white-bg invisible
     mid-hover). */
  background-color: rgba(255, 255, 255, 0.55);
  transition: opacity 150ms ease-out;
}

.hover-actions-card:hover .hover-actions-card__content,
.hover-actions-card:focus-within .hover-actions-card__content {
  filter: blur(4px);
  opacity: 0.4;
}

.hover-actions-card:hover .hover-actions-card__overlay,
.hover-actions-card:focus-within .hover-actions-card__overlay {
  opacity: 1;
  pointer-events: auto;
}
