/* ============================================================
   CUSTOM CURSOR
   A small dot that tracks the pointer 1:1, plus a trailing ring
   that eases toward it and reacts to interactive elements.
   Disabled on touch/coarse pointers and prefers-reduced-motion.
   ============================================================ */

html.vit-cursor-active,
html.vit-cursor-active * {
  cursor: none !important;
}

.vit-cursor-dot,
.vit-cursor-ring {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 10000;
  pointer-events: none;
  border-radius: 50%;
  transform: translate(-50%, -50%);
  will-change: transform;
}

.vit-cursor-dot {
  width: 8px;
  height: 8px;
  background: var(--el-violet-bright, #b57bff);
  box-shadow: 0 0 12px rgba(145, 71, 255, 0.8);
  transition: opacity 0.2s ease, width 0.2s ease, height 0.2s ease;
}

.vit-cursor-ring {
  width: 38px;
  height: 38px;
  border: 1.5px solid rgba(145, 71, 255, 0.55);
  background: rgba(145, 71, 255, 0.06);
  transition: width 0.25s cubic-bezier(0.16, 1, 0.3, 1),
              height 0.25s cubic-bezier(0.16, 1, 0.3, 1),
              border-color 0.25s ease,
              background 0.25s ease,
              opacity 0.2s ease;
}

/* Hover state — grows and fills when over interactive elements */
html.vit-cursor-active.vit-cursor-hover .vit-cursor-ring {
  width: 64px;
  height: 64px;
  border-color: rgba(181, 123, 255, 0.8);
  background: rgba(145, 71, 255, 0.12);
}
html.vit-cursor-active.vit-cursor-hover .vit-cursor-dot {
  opacity: 0;
}

/* Pressed state — quick squeeze for tactile feedback */
html.vit-cursor-active.vit-cursor-down .vit-cursor-ring {
  width: 30px;
  height: 30px;
}

/* Hide on first paint until the pointer moves, and on coarse/touch pointers */
.vit-cursor-dot,
.vit-cursor-ring {
  opacity: 0;
}
html.vit-cursor-active .vit-cursor-dot,
html.vit-cursor-active .vit-cursor-ring {
  opacity: 1;
}

@media (hover: none), (pointer: coarse) {
  .vit-cursor-dot,
  .vit-cursor-ring {
    display: none !important;
  }
  html.vit-cursor-active,
  html.vit-cursor-active * {
    cursor: auto !important;
  }
}
