/* 커스텀 커서 스타일 */
.custom-cursor {
  position: fixed;
  width: 20px;
  height: 20px;
  background: rgba(0, 77, 51, 0.8);
  border-radius: 50%;
  pointer-events: none;
  z-index: 9999;
  transform: translate(-50%, -50%);
  transition: width 0.2s ease, height 0.2s ease, background-color 0.2s ease;
}

.custom-cursor.hover {
  width: 60px;
  height: 60px;
  background: rgba(0, 77, 51, 0.8);
}

/* cursor_big 클래스가 있는 요소들에 호버 시 더 크게 */
.custom-cursor.hover-big {
  width: 80px;
  height: 80px;
  background: rgba(0, 77, 51, 0.8);
}

.custom-cursor.click {
  width: 16px;
  height: 16px;
  background: rgba(0, 77, 51, 0.8);
  transition: all 0.1s ease;
}

/* 텍스트 선택 시 커서 효과 */
.custom-cursor.text-select {
  width: 24px;
  height: 24px;
  background: rgba(0, 101, 69, 0.8);
  border: 2px solid #006545;
}

/* 드래그 시 커서 효과 */
.custom-cursor.drag {
  width: 20px;
  height: 20px;
  background: #006545;
  transform: translate(-50%, -50%) scale(1.2);
}

/* 기본 커서 숨기기 */
body {
  cursor: none !important;
}

/* 클릭가능한 요소들 기본 상태에서도 커서 숨기기 */
a,
button,
input[type="submit"],
input[type="button"],
input[type="text"],
input[type="tel"],
input[type="email"],
input[type="password"],
input[type="search"],
input[type="url"],
input[type="number"],
.clickable,
[data-cursor="hover"],
label[for],
select,
textarea {
  cursor: none !important;
  transition: all 0.2s ease;
}

/* 클릭가능한 요소들에 호버 효과 */
a:hover,
button:hover,
input[type="submit"]:hover,
input[type="button"]:hover,
input[type="text"]:hover,
input[type="tel"]:hover,
input[type="email"]:hover,
input[type="password"]:hover,
input[type="search"]:hover,
input[type="url"]:hover,
input[type="number"]:hover,
.clickable:hover,
[data-cursor="hover"]:hover,
label[for]:hover,
select:hover,
textarea:hover {
  cursor: none !important;
  transform: scale(1.02);
  transition: transform 0.2s ease;
}

/* 링크와 버튼에 호버 효과 추가 */
a:hover,
button:hover,
input[type="submit"]:hover,
input[type="button"]:hover,
.clickable:hover,
[data-cursor="hover"]:hover {
  transform: scale(1.02);
  transition: transform 0.2s ease;
}

/* 모든 클릭가능한 요소에 강제 적용 */
* {
  cursor: none !important;
}

/* 특정 요소들만 예외 처리 */
img,
video,
canvas,
svg {
  cursor: none !important;
}

/* 모바일에서는 커스텀 커서 비활성화 */
@media (max-width: 1023px) {
  .custom-cursor {
    display: none;
  }

  body {
    cursor: auto !important;
  }

  * {
    cursor: auto !important;
  }

  a,
  button,
  input[type="submit"],
  input[type="button"],
  .clickable,
  [data-cursor="hover"] {
    cursor: pointer !important;
  }

  a:hover,
  button:hover,
  input[type="submit"]:hover,
  input[type="button"]:hover,
  .clickable:hover,
  [data-cursor="hover"]:hover {
    cursor: pointer !important;
    transform: none;
  }
}