/* ──────────────────────────────────────────────────────────────
   itoll page-load progress bar — a very thin green bar pinned to
   the top of the viewport that fills while a page loads. Site-wide
   (storefront) + both panels (seller-management / seller-dashboard).
   Driven by assets/js/aitl-loadbar.js. Purely cosmetic UX feedback.
   ────────────────────────────────────────────────────────────── */
.aitl-loadbar {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  height: 3px;            /* خیلی باریک */
  z-index: 2147483646;    /* above headers/modals */
  pointer-events: none;
  opacity: 0;
  transition: opacity .25s ease;
}

.aitl-loadbar.is-active { opacity: 1; }

.aitl-loadbar__fill {
  height: 100%;
  width: 0;
  background: linear-gradient(90deg, #15803d 0%, #22c55e 60%, #4ade80 100%);
  box-shadow: 0 0 8px rgba(34, 197, 94, .65), 0 0 2px rgba(34, 197, 94, .9);
  border-radius: 0 2px 2px 0;
  transition: width .3s ease;
}

/* faster snap when completing */
.aitl-loadbar.is-done .aitl-loadbar__fill { transition: width .2s ease; }

@media (prefers-reduced-motion: reduce) {
  .aitl-loadbar__fill { transition: none; }
}