/* Custom Cursor */
:root {
  --cursor-size: 12px;
  --cursor-hover-size: 40px;
  --cursor-color: rgba(37, 99, 235, 0.8);
  --cursor-hover-color: rgba(37, 99, 235, 0.2);
}

/* Hide default cursor on desktop */
@media (hover: hover) and (pointer: fine) {
  * {
    cursor: none !important;
  }
  
  /* Show default cursor for inputs and textareas */
  input,
  textarea,
  select,
  button[type="submit"],
  a[href^="http"],
  a[target="_blank"] {
    cursor: auto !important;
  }
}

.custom-cursor {
  position: fixed;
  width: var(--cursor-size);
  height: var(--cursor-size);
  border: 2px solid var(--cursor-color);
  border-radius: 50%;
  pointer-events: none;
  z-index: 9998;
  transform: translate(-50%, -50%);
  transition: width 0.3s ease, height 0.3s ease, border-color 0.3s ease, background-color 0.3s ease;
  background-color: transparent;
  mix-blend-mode: difference;
}

.custom-cursor.hidden {
  opacity: 0;
  visibility: hidden;
}

.custom-cursor.hover {
  width: var(--cursor-hover-size);
  height: var(--cursor-hover-size);
  background-color: var(--cursor-hover-color);
  border-color: var(--cursor-color);
  border-width: 1px;
}

.custom-cursor.click {
  animation: cursorPulse 0.3s ease-out;
}

@keyframes cursorPulse {
  0% {
    transform: translate(-50%, -50%) scale(1);
  }
  50% {
    transform: translate(-50%, -50%) scale(0.8);
  }
  100% {
    transform: translate(-50%, -50%) scale(1);
  }
}

/* Elements that trigger hover effect */
a,
button:not([disabled]),
.btn,
.nav-item,
.notifications-btn,
.user-avatar-btn,
input[type="submit"],
input[type="button"],
[role="button"],
[onclick] {
  position: relative;
}

/* Touch device fallback */
@media (hover: none) or (pointer: coarse) {
  .custom-cursor {
    display: none !important;
  }
  
  * {
    cursor: auto !important;
  }
}