/* ============================================================
   Target Cursor — estilos
   Porte do componente React Bits (reactbits.dev/animations/target-cursor)
   O posicionamento é feito por assets/js/target-cursor.js.
   ============================================================ */

/* esconde o cursor do sistema apenas quando o componente está ativo */
.tc-hide-cursor,
.tc-hide-cursor a,
.tc-hide-cursor button,
.tc-hide-cursor [role="button"],
.tc-hide-cursor summary,
.tc-hide-cursor label {
  cursor: none;
}
/* campos de texto mantêm o cursor nativo: escrever sem ele é ruim */
.tc-hide-cursor input,
.tc-hide-cursor textarea,
.tc-hide-cursor select,
.tc-hide-cursor [contenteditable="true"] {
  cursor: auto;
}

.target-cursor-wrapper {
  position: fixed;
  top: 0;
  left: 0;
  width: 0;
  height: 0;
  z-index: 2147483000;      /* acima de tudo, inclusive do chat flutuante */
  pointer-events: none;
  opacity: 0;
  transition: opacity .25s ease;
  will-change: transform;
}
.target-cursor-wrapper.is-visible { opacity: 1; }

.target-cursor-dot {
  position: absolute;
  left: 0; top: 0;
  width: 5px; height: 5px;
  margin: -2.5px 0 0 -2.5px;
  border-radius: 50%;
  background: var(--lime, #8fe93c);
  transition: transform .2s ease, opacity .2s ease;
}
.target-cursor-wrapper.is-targeting .target-cursor-dot {
  transform: scale(.5);
  opacity: .7;
}
.target-cursor-wrapper.is-down .target-cursor-dot { transform: scale(1.8); }

/* os quatro cantos em "L" */
.target-cursor-corner {
  position: absolute;
  left: 0; top: 0;
  width: 11px; height: 11px;
  border: 2px solid var(--lime, #8fe93c);
  /* o movimento até a caixa do alvo é suavizado aqui */
  transition: transform .28s cubic-bezier(.22,1,.36,1),
              width .28s cubic-bezier(.22,1,.36,1),
              height .28s cubic-bezier(.22,1,.36,1);
  will-change: transform;
}
/* cada canto mostra só duas bordas, formando o "L" */
.corner-0 { border-right: 0; border-bottom: 0; margin: -1px 0 0 -1px; }
.corner-1 { border-left: 0;  border-bottom: 0; margin: -1px 0 0 -10px; }
.corner-2 { border-left: 0;  border-top: 0;    margin: -10px 0 0 -10px; }
.corner-3 { border-right: 0; border-top: 0;    margin: -10px 0 0 -1px; }

/* travado num alvo: cantos maiores e mais luminosos */
.target-cursor-wrapper.is-targeting .target-cursor-corner {
  width: 16px; height: 16px;
  box-shadow: 0 0 12px -2px color-mix(in srgb, var(--lime, #8fe93c) 70%, transparent);
}
.target-cursor-wrapper.is-targeting .corner-1 { margin-left: -15px; }
.target-cursor-wrapper.is-targeting .corner-2 { margin: -15px 0 0 -15px; }
.target-cursor-wrapper.is-targeting .corner-3 { margin-top: -15px; }

@media (prefers-reduced-motion: reduce) {
  .target-cursor-corner { transition-duration: .12s; }
}

/* segurança: em toque ou tela pequena o cursor nativo volta */
@media (pointer: coarse) {
  .tc-hide-cursor, .tc-hide-cursor * { cursor: auto; }
  .target-cursor-wrapper { display: none; }
}