/* Hors ligne : progression, annulation, reprise (voir offlineBlock() dans js/app.js). Mobile-first. */
.off-wrap, .off-body, .off-card { min-width: 0; max-width: 100%; }
.off-card { overflow-wrap: anywhere; }
.off-bar { position: relative; height: 12px; width: 100%; }
.off-bar i { min-width: 0; max-width: 100%; }
.off-bar.is-running i { background-size: 28px 28px; background-image:
  linear-gradient(90deg, var(--acc), var(--acc2)),
  repeating-linear-gradient(135deg, rgba(255,255,255,.22) 0 8px, transparent 8px 16px);
  background-blend-mode: overlay; animation: off-stripes 1s linear infinite; }
.off-bar.is-cancelled i { background: var(--tx3); }
@keyframes off-stripes { to { background-position: 28px 0, 28px 0; } }
.off-pct { font-size: 1rem; }
.off-actions { margin-top: 4px; }
.off-actions .btn { flex: 1 1 100%; justify-content: center; min-height: 44px; }
@media (min-width: 480px) { .off-actions .btn { flex: 0 1 auto; } }
@media (prefers-reduced-motion: reduce) { .off-bar.is-running i { animation: none; } .off-bar i { transition: none; } }