.htmx-indicator {
    opacity: 0;
    transition: opacity 150ms ease-in;
}
.htmx-request .htmx-indicator,
.htmx-request.htmx-indicator {
    opacity: 1;
}

/* Indeterminate upload progress bar — a 40%-wide bar sliding left→right. */
.progress-indeterminate {
    animation: progress-slide 1.2s ease-in-out infinite;
}
@keyframes progress-slide {
    0%   { transform: translateX(-100%); }
    100% { transform: translateX(300%); }
}

/* Persistent "last edited" band: the row of the most recently edited
   transaction keeps a soft yellow highlight until another transaction is
   edited (which moves the band to it) — see base.html. !important so it
   wins over Tailwind's row backgrounds. */
.txn-edited,
.txn-edited:hover {
    background-color: #fef9c3 !important; /* yellow-100 */
}

/* Combobox opened upward (auto-flipped by JS when there is no room below). */
.combobox-panel.combobox-open-up {
    top: auto;
    bottom: 100%;
    margin-top: 0;
    margin-bottom: 4px;
}

/* ── Collapsible sidebar (desktop only) ──────────────────────────────────
   The user can shrink the left nav to icon-only to free screen space.
   State is persisted in localStorage and applied before first paint (see
   base.html), so toggling also needs the width/transform transition here
   (Tailwind's transition-transform class only covers transform). */
#sidebar { transition-property: transform, width; transition-duration: 200ms; transition-timing-function: ease-in-out; }

@media (min-width: 1024px) {
    body.sidebar-collapsed aside#sidebar { width: 4.5rem; }

    body.sidebar-collapsed #sidebar .logo-row { justify-content: center; }
    body.sidebar-collapsed #sidebar .logo-row > .flex:first-child { gap: 0; }
    body.sidebar-collapsed #sidebar .logo-text,
    body.sidebar-collapsed #sidebar .sidebar-group-title,
    body.sidebar-collapsed #sidebar .sidebar-footer-text,
    body.sidebar-collapsed #sidebar .back-clients { display: none; }

    /* Labels vanish via font-size:0 on the link; the icon span keeps its
       own explicit size (Tailwind text-base) so only the icon remains. */
    body.sidebar-collapsed #sidebar nav a,
    body.sidebar-collapsed #sidebar nav .sidebar-tab,
    body.sidebar-collapsed #sidebar .system-link {
        font-size: 0;
        justify-content: center;
        padding-left: 0.375rem;
        padding-right: 0.375rem;
    }
    body.sidebar-collapsed #sidebar nav a > span,
    body.sidebar-collapsed #sidebar nav .sidebar-tab > span,
    body.sidebar-collapsed #sidebar .system-link > span { font-size: 1rem; }
}