/* ============================================================
   HTMX FEEDBACK — top progress bar, error banner, disabled state
   for boosted clicks. Wired in base.html via hx-boost on <body>
   and hx-indicator="#htmx-progress".
   ============================================================ */

/* ---------- Top progress bar ---------- */
#htmx-progress {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  height: 3px;
  z-index: 9999;
  pointer-events: none;
  overflow: hidden;
}

#htmx-progress::before {
  content: '';
  display: block;
  height: 100%;
  width: 30%;
  background: var(--color-primary);
  transform: translateX(-100%);
}

#htmx-progress.htmx-request::before {
  animation: htmx-progress-slide 1.2s ease-in-out infinite;
}

@keyframes htmx-progress-slide {
  0%   { transform: translateX(-100%); }
  100% { transform: translateX(400%); }
}

/* ---------- Error banner ---------- */
#htmx-error-banner {
  margin: var(--space-4);
  padding: var(--space-3) var(--space-4);
  background: var(--color-bg-surface);
  border: 1px solid var(--color-error);
  border-left-width: 4px;
  border-radius: var(--radius-md);
  color: var(--color-error);
  font-family: var(--font-primary);
  font-size: 0.95rem;
}

/* ---------- Disabled state during boosted requests ---------- */
/* HTMX adds the `disabled` attribute to the trigger element while the
   request is in flight (via hx-disabled-elt="this" on body). */
a[disabled],
button[disabled] {
  opacity: 0.6;
  pointer-events: none;
  cursor: progress;
}