/* 검색바 컨테이너 여백 조정 */
.header-search-container {
  margin-right: 15px;
  margin-left: 15px;
}

/* 검색 폼 스타일 */
.search-form {
  position: relative;
  background: #f4f4f4;
  border-radius: 50px;
  padding: 3px 15px;
  transition: 0.3s;
  border: 1px solid #ddd;
}

.search-form:focus-within {
  background: #fff;
  border-color: var(--accent-color); /* 템플릿의 메인 강조색 사용 */
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
}

/* 입력창 스타일 */
.search-form input {
  border: 0;
  padding: 5px 10px;
  background: transparent;
  font-size: 14px;
  outline: none;
  width: 120px; /* 기본 너비 */
  transition: 0.3s;
}

/* 마우스를 올리거나 클릭 시 너비 확장 (애니메이션 효과) */
.search-form input:focus {
  width: 200px;
}

/* 검색 버튼 스타일 */
.search-form button {
  border: 0;
  background: none;
  padding: 0;
  color: #444;
  font-size: 16px;
  cursor: pointer;
}

.search-form button:hover {
  color: var(--accent-color);
}

/* 모바일 화면에서 검색창 숨기기 (선택 사항) */
@media (max-width: 991px) {
  .header-search-container {
    display: none !important;
  }
}