.search-box[data-v-9494a221] {
  --border-width: 2px;
  --animation-speed: 10s;
  --glow-color: conic-gradient(
    rgba(var(--color-primary), 0.5),
    transparent 25%,
    transparent 50%,
    rgba(var(--color-primary), 0.5) 75%,
    transparent
  );

  position: relative;
  width: 100%;
  height: 44px;
  border-radius: 15px;
  overflow: hidden;
  display: flex;
  align-items: center;
  /* پس‌زمینه ثابت حالت غیرفعال */
  background: rgba(var(--color-comp), 0.9);
}

/* نور متحرک - به‌صورت پیش‌فرض مخفی */
.search-box[data-v-9494a221]::before {
  content: "";
  position: absolute;
  width: 150%;
  height: 300%;
  background: var(--glow-color);
  animation: slow-rotate-9494a221 var(--animation-speed) linear infinite;
  animation-play-state: paused;   /* انیمیشن متوقف تا زمان فوکوس */
  opacity: 0;                     /* مخفی در حالت عادی */
  transition: opacity 0.3s ease;
  z-index: 0;
}

/* بدنه داخلی سفید/اصلی */
.search-box[data-v-9494a221]::after {
  content: "";
  position: absolute;
  inset: var(--border-width);
  background: rgb(var(--color-c--body));
  border-radius: 13px;
  z-index: 1;
}

/* نمایش نور فقط هنگام فوکوس */
.search-box[data-v-9494a221]:focus-within::before {
  opacity: 1;
  animation-play-state: running;
  animation-duration: 6s;
}
.inner-content[data-v-9494a221] {
  position: relative;
  z-index: 2;
  width: 100%;
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 0 14px;
}
.search-input[data-v-9494a221] {
  all: unset;
  width: 100%;
  height: 36px;
  font-size: 14px;
  font-family: inherit;
  color: rgb(var(--color-c--text));
  background: transparent;
  cursor: text;
}
.search-input[data-v-9494a221]::-moz-placeholder {
  color: rgba(var(--color-c--text), 0.5);
}
.search-input[data-v-9494a221]::placeholder {
  color: rgba(var(--color-c--text), 0.5);
}
.search-icon[data-v-9494a221] {
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0.5;
  transition: opacity 0.25s ease;
}
.search-box:hover .search-icon[data-v-9494a221] {
  opacity: 0.9;
}
@keyframes slow-rotate-9494a221 {
from {
    transform: rotate(0deg);
}
to {
    transform: rotate(360deg);
}
}