/* ============================================================
   Business PC V2 — NOTIFICATIONS (PHASE 3)
   Индикаторы и служебные сообщения: прогресс синхронизации,
   подписи состояния.

   Toast-уведомления вынесены в отдельный файл ui/toast.css
   (у них своя анимация появления/исчезновения).
   Здесь — индикаторы прогресса и подписи синхронизации.

   Правило подключения: ПОСЛЕ ui/tabs.css, но ДО site.css
   и страничных стилей.

   Компоненты ТЗ: Loader, Toast (в ui/toast.css),
   Badge (в ui/badges.css).
   ============================================================ */

/* ---------- Контейнер индикатора ---------- */
.progress {
    display: flex;
    flex-direction: column;
    gap: 5px;
    width: 100%;
    max-width: 320px;
    margin-top: 10px;
}

.progress[hidden] { display: none; }

/* ---------- Дорожка ---------- */
.progress-track {
    position: relative;
    height: 6px;
    overflow: hidden;
    background: var(--neutral-200);
    border-radius: var(--radius-pill);
}

/* ---------- Бегущий индикатор ----------
   Полоса шириной 35% ездит по дорожке слева направо —
   индикацию неопределённой длительности (загрузка, синхронизация),
   где реальный процент выполнения неизвестен. */
.progress-bar {
    position: absolute;
    top: 0;
    bottom: 0;
    left: -35%;
    width: 35%;
    border-radius: var(--radius-pill);
    background: linear-gradient(
        90deg,
        var(--progress-start),
        var(--progress-end)
    );
    animation: progress-slide 1.1s ease-in-out infinite;
}

@keyframes progress-slide {
    0%   { left: -35%; }
    100% { left: 100%; }
}

/* ---------- Подпись состояния ---------- */
.progress-note {
    font-size: 0.8rem;
    color: var(--neutral-600);
}