/* Soul ID UI — стили для генератора аватаров */

/* Chips — одежда, движение камеры */
.sid-chip {
  font-size: 12px;
  padding: 5px 12px;
  border-radius: 20px;
  border: 1px solid var(--b);
  background: none;
  color: var(--soft);
  cursor: pointer;
  transition: all 160ms ease;
  white-space: nowrap;
}
.sid-chip:hover { border-color: rgba(138,215,255,.4); color: var(--ai); }
.sid-chip.sid-chip-on {
  border-color: var(--ai);
  background: rgba(138,215,255,.10);
  color: var(--ai);
  font-weight: 700;
}

/* Карточки режима (Говорящая голова / Кино) */
.sid-mode-card {
  transition: border 160ms ease, background 160ms ease;
}
.sid-mode-card:hover { background: rgba(255,255,255,.03); }

/* Карточки локации */
.sid-loc-card { transition: all 160ms ease; }
.sid-loc-card:hover {
  border-color: rgba(138,215,255,.35) !important;
  background: rgba(138,215,255,.04);
}

/* Presets причёски */
.sid-hair-preset {
  font-size: 11px;
  padding: 3px 10px;
  border-radius: 14px;
  border: 1px solid var(--b);
  background: none;
  color: var(--dim);
  cursor: pointer;
  transition: all 140ms ease;
}
.sid-hair-preset:hover { border-color: rgba(186,130,255,.4); color: #b482ff; }

/* Карточки планов камеры */
.sid-shot-card {
  transition: border-color 140ms ease;
}
.sid-shot-card:hover { border-color: rgba(138,215,255,.3) !important; }
.sid-shot-card input:checked ~ div > div:first-child { color: var(--ai); }

/* Галерея — hover-эффект */
#sid-gallery > div { transition: transform 180ms ease, box-shadow 180ms ease; }
#sid-gallery > div:hover {
  transform: translateY(-3px);
  box-shadow: 0 8px 24px rgba(0,0,0,.5);
}

/* Кнопка генерации — pulse когда не disabled */
#sid-generate-btn:not(:disabled) {
  box-shadow: 0 0 0 0 rgba(180,130,255,.4);
  animation: sid-pulse 2.4s ease-in-out infinite;
}
#sid-generate-btn:disabled { opacity: .6; cursor: not-allowed; animation: none; }

@keyframes sid-pulse {
  0%, 100% { box-shadow: 0 0 0 0 rgba(180,130,255,.35); }
  50%       { box-shadow: 0 0 0 8px rgba(180,130,255,0); }
}

/* Профиль Soul ID — thumb анимация */
#sid-avatar-thumb { transition: transform 200ms ease; }
#sid-avatar-thumb:hover { transform: scale(1.05); }

/* Прогресс-бар обучения */
@keyframes sid-train-anim {
  0%   { width: 30%; opacity: .8; }
  100% { width: 75%; opacity: 1; }
}