/* static/css/algorithm/boyer_moore_visualizer.css */

@keyframes deepsharkPulseColor {
  0% {
    color: #0d6efd;
  }

  /* 파랑 */
  25% {
    color: #6610f2;
  }

  /* 보라 */
  50% {
    color: #20c997;
  }

  /* 민트 */
  75% {
    color: #d63384;
  }

  /* 핑크 */
  100% {
    color: #0d6efd;
  }

  /* 파랑으로 복귀 */
}

.deepshark-highlight {
  font-weight: bold;
  font-size: 1.3em;
  /* ✅ 크기 고정 */
  display: inline-block;
  animation: deepsharkPulseColor 2.5s infinite ease-in-out;
}

/* 스크롤 가능한 높이 유지 */
.log-list {
  height: 150px;
  /* ✅ 고정 높이 */
  overflow-y: auto;
  padding-left: 1rem;
  list-style-type: disc;
  background-color: #f8f9fa;
  border: 1px solid #dee2e6;
  border-radius: 4px;
}

.char-unit {
  display: inline-block;
  width: 28px;
  text-align: center;
  font-family: monospace;
  font-size: 1.2em;
}

.match-success {
  background-color: #d1e7dd;
  border-radius: 4px;
}

.compare-fail {
  background-color: #f8d7da;
  color: #842029;
  font-weight: bold;
  border-radius: 4px;
}

.compare-success {
  background-color: #d1e7dd;
  color: #0f5132;
  font-weight: bold;
  border-radius: 4px;
}

.arrow-unit {
  display: inline-block;
  width: 28px;
  text-align: center;
  font-size: 1.2em;
  color: #0d6efd;
  opacity: 0;
  animation: arrowFadeIn 0.5s forwards;
}

@keyframes arrowFadeIn {
  to {
    opacity: 1;
  }
}