/* Плашка «ИИ-агент работает» (assets/js/ai-busy.js). Цвета — из Bootstrap, с запасными для мобильного лейаута. */
.ai-busy {
    position: fixed;
    right: 16px;
    bottom: 16px;
    z-index: 2000;
    display: flex;
    align-items: center;
    gap: 12px;
    max-width: calc(100vw - 32px);
    padding: 10px 16px 10px 12px;
    border: 1px solid var(--bs-primary-border-subtle, #9ec5fe);
    border-radius: 12px;
    background: var(--bs-body-bg, #fff);
    color: var(--bs-body-color, #212529);
    box-shadow: 0 6px 24px rgba(0, 0, 0, .18);
    font-size: 14px;
    line-height: 1.3;
    opacity: 0;
    transform: translateY(12px);
    pointer-events: none;
    transition: opacity .2s, transform .2s;
}
.ai-busy--on { opacity: 1; transform: none; pointer-events: auto; }
.ai-busy__img { flex: none; color: var(--bs-primary, #0d6efd); animation: ai-busy-bob 1.6s ease-in-out infinite; }
.ai-busy__label { font-weight: 600; }
.ai-busy__time { font-variant-numeric: tabular-nums; font-weight: 400; color: var(--bs-secondary-color, #6c757d); margin-left: 4px; }
.ai-busy__hint { font-size: 12px; color: var(--bs-secondary-color, #6c757d); }

.ai-busy__antenna { fill: var(--bs-warning, #ffc107); animation: ai-busy-pulse 1s ease-in-out infinite; }
.ai-busy__eye { fill: currentColor; transform-box: fill-box; transform-origin: center; animation: ai-busy-blink 3s infinite; }
.ai-busy__dot { fill: currentColor; animation: ai-busy-dot 1.2s ease-in-out infinite; }
.ai-busy__dot:nth-of-type(2) { animation-delay: .2s; }
.ai-busy__dot:nth-of-type(3) { animation-delay: .4s; }
.ai-busy__spark { fill: var(--bs-warning, #ffc107); transform-box: fill-box; transform-origin: center; animation: ai-busy-spark 1.4s linear infinite; }

@keyframes ai-busy-bob { 50% { transform: translateY(-3px); } }
@keyframes ai-busy-pulse { 50% { opacity: .25; } }
@keyframes ai-busy-blink { 0%, 90%, 100% { transform: scaleY(1); } 95% { transform: scaleY(.1); } }
@keyframes ai-busy-dot { 0%, 100% { opacity: .2; } 40% { opacity: 1; } }
@keyframes ai-busy-spark { 0% { transform: scale(.4) rotate(0); opacity: .3; } 50% { transform: scale(1.1) rotate(90deg); opacity: 1; } 100% { transform: scale(.4) rotate(180deg); opacity: .3; } }

@media (prefers-reduced-motion: reduce) {
    .ai-busy__img, .ai-busy__eye, .ai-busy__spark { animation: none; }
}
