/* ============================================================
   fullhistory — локальные стили приложения
   Префикс: .ek-app-fullhistory-*
   База:    /shared/b24app.css (подключается ПЕРВЫМ)

   ВНИМАНИЕ: НЕ переопределять токены --ek-* — только локальные
   переменные внутри корневого класса.
   ============================================================ */

/* ── Виджет: фон body фиксированный #f6fafb (см. STYLEGUIDE §7.1) ─────── */
.ek-app-fullhistory-widget-body {
    margin: 0;
    background: #f6fafb;
    padding: 8px 0 16px;
}

/* ── Переопределение паддинга .ek-widget внутри iframe Б24 ──────────────
      Виджет занимает всю ширину карточки, без внешнего паддинга. */
.ek-app-fullhistory .ek-widget { padding: 0; }

.ek-app-fullhistory .ek-widget__head {
    padding: 10px 16px;
    background: var(--ek-bg-deep);
    margin: 0;
    border-bottom: 1px solid var(--ek-border);
}

.ek-app-fullhistory .ek-widget__body {
    gap: 0;
    padding: 0;
}

/* ── Заголовок «N событий» в шапке виджета ─────────────────────────────── */
.ek-app-fullhistory-count {
    margin-left: auto;
    font-size: var(--ek-text-sm);
    font-weight: 600;
    padding: 2px 8px;
    border-radius: var(--ek-radius-xl);
    background: var(--ek-info-bg);
    color: var(--ek-accent);
}

/* ── Группировка по дням: sticky-заголовки ─────────────────────────────── */
.ek-app-fullhistory-day {
    font-size: var(--ek-text-xs);
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--ek-text-muted);
    padding: 12px 16px 6px;
    background: var(--ek-bg-deep);
    border-bottom: 1px solid var(--ek-border);
}
[data-theme="light"] .ek-app-fullhistory .ek-app-fullhistory-day {
    background: #f5f7fa;
}

/* ── Строка истории ────────────────────────────────────────────────────── */
.ek-app-fullhistory-row {
    display: flex;
    align-items: flex-start;
    gap: var(--ek-space-3);
    padding: 11px 16px;
    border-bottom: 1px solid var(--ek-border);
    transition: background var(--ek-transition);
}
.ek-app-fullhistory-row:last-child { border-bottom: none; }
.ek-app-fullhistory-row:hover { background: var(--ek-bg-hover); }

.ek-app-fullhistory-row__icon {
    width: 28px; height: 28px;
    border-radius: var(--ek-radius-sm);
    display: inline-flex; align-items: center; justify-content: center;
    flex-shrink: 0;
    margin-top: 1px;
}
.ek-app-fullhistory-row__icon--stage {
    background: var(--ek-info-bg);
    color: var(--ek-accent);
}
.ek-app-fullhistory-row__icon--resp {
    background: var(--ek-success-bg);
    color: var(--ek-success);
}
.ek-app-fullhistory-row__icon--funnel {
    background: var(--ek-warning-bg);
    color: var(--ek-warning);
}

.ek-app-fullhistory-row__content { flex: 1; min-width: 0; }

.ek-app-fullhistory-row__line1 {
    font-size: var(--ek-text-base);
    color: var(--ek-text);
    line-height: 1.4;
    word-break: break-word;
}
.ek-app-fullhistory-row__label {
    color: var(--ek-text-muted);
    font-size: var(--ek-text-sm);
    margin-right: 4px;
}
.ek-app-fullhistory-row__from {
    color: var(--ek-text-muted);
    text-decoration: line-through;
    text-decoration-color: var(--ek-text-faint);
}
.ek-app-fullhistory-row__arrow {
    color: var(--ek-primary);
    margin: 0 5px;
    font-weight: 700;
}
.ek-app-fullhistory-row__to {
    color: var(--ek-text);
    font-weight: 600;
}

.ek-app-fullhistory-row__line2 {
    display: flex;
    align-items: center;
    gap: var(--ek-space-2);
    margin-top: 3px;
    font-size: var(--ek-text-sm);
    color: var(--ek-text-faint);
}
.ek-app-fullhistory-actor {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    color: var(--ek-text-muted);
}
.ek-app-fullhistory-avatar {
    width: 16px; height: 16px;
    border-radius: 50%;
    background: linear-gradient(135deg, var(--ek-primary), var(--ek-accent));
    color: #fff;
    font-size: 9px;
    font-weight: 700;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}
.ek-app-fullhistory-dot-sep {
    width: 2px; height: 2px;
    border-radius: 50%;
    background: var(--ek-text-faint);
}

/* ── Состояния: пусто / загрузка / ошибка ─────────────────────────────── */
.ek-app-fullhistory-state {
    padding: 32px 20px;
    text-align: center;
    font-size: var(--ek-text-base);
    color: var(--ek-text-muted);
    line-height: 1.5;
}
.ek-app-fullhistory-state__icon {
    width: 44px; height: 44px;
    margin: 0 auto var(--ek-space-2);
    border-radius: 50%;
    background: var(--ek-info-bg);
    color: var(--ek-accent);
    display: inline-flex; align-items: center; justify-content: center;
}
.ek-app-fullhistory-state--error { color: var(--ek-danger); }
.ek-app-fullhistory-state--error .ek-app-fullhistory-state__icon {
    background: var(--ek-danger-bg);
    color: var(--ek-danger);
}

.ek-app-fullhistory-spinner {
    width: 20px; height: 20px;
    margin: 0 auto var(--ek-space-2);
    border: 2px solid var(--ek-border);
    border-top-color: var(--ek-primary);
    border-radius: 50%;
    animation: ek-app-fullhistory-spin 0.7s linear infinite;
}
@keyframes ek-app-fullhistory-spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) {
    .ek-app-fullhistory-spinner { animation: none; }
}

/* ── Кнопка «Показать ещё» ─────────────────────────────────────────────── */
.ek-app-fullhistory-loadmore {
    padding: 12px 16px;
    border-top: 1px solid var(--ek-border);
    background: var(--ek-bg-deep);
    text-align: center;
}
[data-theme="light"] .ek-app-fullhistory .ek-app-fullhistory-loadmore {
    background: #f5f7fa;
}
.ek-app-fullhistory-loadmore__hint {
    margin-top: var(--ek-space-2);
    font-size: var(--ek-text-xs);
    color: var(--ek-text-faint);
}

/* ── Скелетон загрузки ────────────────────────────────────────────────── */
.ek-app-fullhistory-skeleton {
    padding: var(--ek-space-3) 16px;
    display: flex;
    flex-direction: column;
    gap: var(--ek-space-3);
}
.ek-app-fullhistory-skeleton__row {
    height: 44px;
    border-radius: var(--ek-radius-md);
    background: var(--ek-info-bg);
    opacity: 0.6;
    animation: ek-app-fullhistory-pulse 1.5s ease-in-out infinite;
}
.ek-app-fullhistory-skeleton__row:nth-child(2) { animation-delay: 0.2s; }
.ek-app-fullhistory-skeleton__row:nth-child(3) { animation-delay: 0.4s; }
@keyframes ek-app-fullhistory-pulse {
    0%, 100% { opacity: 0.4; }
    50%      { opacity: 0.8; }
}
@media (prefers-reduced-motion: reduce) {
    .ek-app-fullhistory-skeleton__row { animation: none; }
}

/* ── Settings: страница настроек ──────────────────────────────────────── */
.ek-app-fullhistory-section-label {
    font-size: var(--ek-text-sm);
    font-weight: 600;
    color: var(--ek-text-muted);
    text-transform: uppercase;
    letter-spacing: 0.06em;
    margin: var(--ek-space-5) 0 var(--ek-space-2);
}
.ek-app-fullhistory-section-label:first-child { margin-top: 0; }

.ek-app-fullhistory-help {
    font-size: var(--ek-text-sm);
    color: var(--ek-text-muted);
    margin: var(--ek-space-2) 0 0;
    line-height: 1.5;
}

/* ── About: actions row ────────────────────────────────────────────────── */
.ek-app-fullhistory-card-actions {
    display: flex;
    gap: var(--ek-space-2);
    margin-top: var(--ek-space-3);
}
.ek-app-fullhistory-card-actions .ek-btn { flex: 1; }