/* ============================================================
   TrustMall — ADVANCED Custom Cursor System
   
   Elements:
   1. #tm-cursor-arrow   — gradient SVG arrow, tracks mouse instantly
   2. #tm-cursor-aura    — glowing magnetic ring, trails with lerp
   3. .tm-click-burst    — radial burst on click (created in JS)
   
   All GPU-composited (transform + opacity only). Zero jank.
   ============================================================ */

.has-custom-cursor,
.has-custom-cursor * { cursor: none !important; }

/* Removed text entry cursor auto restoration to prevent double cursor */

/* ── Shared base ── */
#tm-cursor-arrow,
#tm-cursor-aura {
  position: fixed;
  top: 0; left: 0;
  pointer-events: none !important;
  z-index: 999999;
  will-change: transform;
}

/* ── 1. Arrow — gradient fill, tip at transform origin ── */
#tm-cursor-arrow {
  width: 28px;
  height: 32px;
  transform: translate(0, 0);
}
#tm-cursor-arrow svg {
  display: block;
  width: 100%;
  height: 100%;
  overflow: visible;
  filter:
    drop-shadow(0 2px 6px rgba(99,102,241,.45))
    drop-shadow(0 1px 2px rgba(0,0,0,.20));
  transition: filter .2s ease, transform .18s cubic-bezier(.34,1.56,.64,1);
  transform-origin: 0 0;
}

/* ── 2. Aura ring — shown only on hover ── */
#tm-cursor-aura {
  width: 48px;
  height: 48px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(99,102,241,.12) 0%, rgba(99,102,241,0) 70%);
  border: 1.5px solid rgba(99,102,241,.35);
  margin: -24px 0 0 -24px; /* center on position */
  opacity: 0;
  transform: translate(0,0) scale(.4);
  transition:
    opacity .3s cubic-bezier(.16,1,.3,1),
    transform .3s cubic-bezier(.16,1,.3,1),
    border-color .25s ease,
    background .25s ease;
  backdrop-filter: blur(0px);
}

/* ── STATES ── */

/* Default — subtle idle glow */
.has-custom-cursor #tm-cursor-aura {
  opacity: 0;
  transform: translate(0,0) scale(.4);
}

/* Hover — aura blooms open, arrow tilts ready */
.has-custom-cursor.cursor-hover #tm-cursor-aura {
  opacity: 1;
  transform: translate(0,0) scale(1);
  width: 54px;
  height: 54px;
  margin: -27px 0 0 -27px;
  border-color: rgba(124,58,237,.5);
  background: radial-gradient(circle, rgba(124,58,237,.14) 0%, rgba(124,58,237,0) 70%);
}
.has-custom-cursor.cursor-hover #tm-cursor-arrow svg {
  transform: rotate(-8deg) scale(1.08);
  filter:
    drop-shadow(0 4px 12px rgba(99,102,241,.6))
    drop-shadow(0 2px 4px rgba(0,0,0,.18));
}

/* Click — arrow compresses + aura pulses */
.has-custom-cursor.cursor-click #tm-cursor-arrow svg {
  transform: scale(.82) !important;
  transition-duration: .08s !important;
  filter:
    drop-shadow(0 1px 4px rgba(99,102,241,.8))
    drop-shadow(0 1px 2px rgba(0,0,0,.2)) !important;
}
.has-custom-cursor.cursor-click #tm-cursor-aura {
  opacity: .8;
  border-color: rgba(99,102,241,.8);
  transform: translate(0,0) scale(.7);
  transition-duration: .1s;
}

/* Text input — slim I-beam + aura hides */
.has-custom-cursor.cursor-text #tm-cursor-arrow svg {
  transform: scale(1); /* reset rotation */
  filter: drop-shadow(0 1px 3px rgba(99,102,241,.3));
}
.has-custom-cursor.cursor-text #tm-cursor-aura {
  opacity: 0;
  transform: translate(0,0) scale(.2);
}
.has-custom-cursor.cursor-text .arrow-body  { display: none; }
.has-custom-cursor.cursor-text .ibeam-shape { display: block !important; }

/* Leaving window */
.has-custom-cursor.cursor-out #tm-cursor-arrow,
.has-custom-cursor.cursor-out #tm-cursor-aura { opacity: 0; }

/* ── Click burst particle ── */
.tm-click-burst {
  position: fixed;
  pointer-events: none;
  z-index: 999998;
  width: 0; height: 0;
}
.tm-click-burst::before,
.tm-click-burst::after {
  content: '';
  position: absolute;
  border-radius: 50%;
  transform: translate(-50%,-50%);
}
.tm-click-burst::before {
  width: 28px; height: 28px;
  border: 2px solid rgba(99,102,241,.7);
  animation: burst-ring .5s cubic-bezier(.16,1,.3,1) forwards;
}
.tm-click-burst::after {
  width: 10px; height: 10px;
  background: rgba(99,102,241,.5);
  animation: burst-dot .35s cubic-bezier(.16,1,.3,1) forwards;
}

@keyframes burst-ring {
  from { transform: translate(-50%,-50%) scale(0); opacity: 1; }
  to   { transform: translate(-50%,-50%) scale(3); opacity: 0; }
}
@keyframes burst-dot {
  from { transform: translate(-50%,-50%) scale(0); opacity: .8; }
  to   { transform: translate(-50%,-50%) scale(1.8); opacity: 0; }
}

/* ── Dark mode ── */
[data-theme="dark"] #tm-cursor-aura {
  border-color: rgba(129,140,248,.4);
  background: radial-gradient(circle, rgba(129,140,248,.12) 0%, transparent 70%);
}
[data-theme="dark"].cursor-hover #tm-cursor-aura {
  border-color: rgba(167,139,250,.55);
}
[data-theme="dark"] .tm-click-burst::before { border-color: rgba(129,140,248,.8); }
[data-theme="dark"] .tm-click-burst::after  { background: rgba(129,140,248,.6); }

/* ── Touch / coarse pointer — fully disabled ── */
@media (pointer: coarse), (hover: none) {
  #tm-cursor-arrow,
  #tm-cursor-aura,
  .tm-click-burst { display: none !important; }
  .has-custom-cursor,
  .has-custom-cursor * { cursor: auto !important; }
}

/* ── Reduced motion — skip transitions ── */
@media (prefers-reduced-motion: reduce) {
  #tm-cursor-arrow svg,
  #tm-cursor-aura { transition: none !important; }
  .tm-click-burst::before,
  .tm-click-burst::after { animation: none !important; }
}
