/* Flower Cursor Plugin Styles - Explosión de Flores (Desktop + Mobile) */
/* Desarrollado por Creativ Agencia Pereira */

/* Solo ocultar cursor en desktop, no en móvil */
@media (hover: hover) and (pointer: fine) {
  body {
    cursor: none !important;
  }
}

/* Restaurar cursor en elementos de formulario */
input,
textarea,
select {
  cursor: text !important;
}

button,
a,
[role="button"],
.wp-block-button,
.button {
  cursor: pointer !important;
}

/* Contenedor del cursor de flores */
.flower-cursor-container {
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  pointer-events: none;
  z-index: 999999;
  overflow: hidden;
}

/* Elementos de flores individuales - SIN SOMBRAS */
.flower-cursor-item {
  position: fixed;
  pointer-events: none;
  user-select: none;
  transform-origin: center;
  will-change: transform, opacity;
  z-index: 999999;
  /* Asegurar que no hay sombras */
  box-shadow: none !important;
  text-shadow: none !important;
  filter: none !important;
}

/* Tamaños para desktop - SIN SOMBRAS */
.flower-cursor-item.desktop img {
  width: 32px;
  height: 32px;
  object-fit: contain;
  transition: all 0.3s ease;
  /* Eliminar todas las sombras */
  box-shadow: none !important;
  filter: none !important;
  -webkit-filter: none !important;
}

.flower-cursor-item.desktop .emoji {
  font-size: 28px;
  line-height: 1;
  transition: all 0.3s ease;
  /* Eliminar todas las sombras */
  text-shadow: none !important;
  filter: none !important;
  -webkit-filter: none !important;
}

/* Tamaños para móvil - SIN SOMBRAS */
.flower-cursor-item.mobile img {
  width: 28px;
  height: 28px;
  object-fit: contain;
  transition: all 0.3s ease;
  /* Eliminar todas las sombras específicamente en móvil */
  box-shadow: none !important;
  filter: none !important;
  -webkit-filter: none !important;
  text-shadow: none !important;
}

.flower-cursor-item.mobile .emoji {
  font-size: 24px;
  line-height: 1;
  transition: all 0.3s ease;
  /* Eliminar todas las sombras específicamente en móvil */
  text-shadow: none !important;
  filter: none !important;
  -webkit-filter: none !important;
  box-shadow: none !important;
}

/* Efectos especiales para desktop - SIN SOMBRAS, solo brillo */
.flower-cursor-item.desktop.special-explosion img {
  width: 42px;
  height: 42px;
  filter: brightness(1.3) saturate(1.4) !important;
  box-shadow: none !important;
  text-shadow: none !important;
}

.flower-cursor-item.desktop.special-explosion .emoji {
  font-size: 38px;
  filter: brightness(1.3) saturate(1.4) !important;
  text-shadow: none !important;
  box-shadow: none !important;
}

/* Efectos especiales para móvil - SIN SOMBRAS, solo brillo */
.flower-cursor-item.mobile.special-explosion img {
  width: 36px;
  height: 36px;
  filter: brightness(1.2) saturate(1.3) !important;
  box-shadow: none !important;
  text-shadow: none !important;
}

.flower-cursor-item.mobile.special-explosion .emoji {
  font-size: 32px;
  filter: brightness(1.2) saturate(1.3) !important;
  text-shadow: none !important;
  box-shadow: none !important;
}

/* Animaciones de respaldo */
@keyframes flowerExplode {
  0% {
    transform: translate(-50%, -50%) scale(0.3) rotate(0deg);
    opacity: 0.95;
  }
  30% {
    transform: translate(-50%, -50%) scale(1.2) rotate(90deg);
    opacity: 0.8;
  }
  100% {
    transform: translate(-50%, -50%) scale(1) rotate(270deg);
    opacity: 0;
  }
}

@keyframes flowerFloat {
  0%,
  100% {
    transform: translateY(0px);
  }
  50% {
    transform: translateY(-8px);
  }
}

/* Efectos especiales para hover */
.flower-cursor-item.hover-effect {
  animation: flowerFloat 1s ease-in-out infinite;
}

/* Responsive específico para móviles */
@media (max-width: 768px) {
  /* Asegurar que las flores sean visibles en móvil SIN SOMBRAS */
  .flower-cursor-item img {
    min-width: 24px;
    min-height: 24px;
    box-shadow: none !important;
    filter: none !important;
    text-shadow: none !important;
  }

  .flower-cursor-item .emoji {
    min-font-size: 20px;
    text-shadow: none !important;
    filter: none !important;
    box-shadow: none !important;
  }

  /* Prevenir zoom en iOS al tocar */
  .flower-cursor-container {
    touch-action: manipulation;
  }

  /* Eliminar cualquier sombra residual en móvil */
  .flower-cursor-item * {
    box-shadow: none !important;
    text-shadow: none !important;
    filter: none !important;
    -webkit-filter: none !important;
  }
}

/* Tablets */
@media (min-width: 769px) and (max-width: 1024px) {
  .flower-cursor-item.mobile img {
    width: 30px;
    height: 30px;
    box-shadow: none !important;
    filter: none !important;
  }

  .flower-cursor-item.mobile .emoji {
    font-size: 26px;
    text-shadow: none !important;
    filter: none !important;
  }
}

/* Modo de alto contraste - SIN SOMBRAS */
@media (prefers-contrast: high) {
  .flower-cursor-item img {
    filter: contrast(1.4) !important;
    box-shadow: none !important;
    text-shadow: none !important;
  }
}

/* Reducir movimiento para usuarios sensibles */
@media (prefers-reduced-motion: reduce) {
  .flower-cursor-item {
    animation: none !important;
    transition: opacity 0.5s ease !important;
  }
}

/* Efectos adicionales */
.flower-cursor-item.explosion {
  transform-origin: center center;
}

/* Transiciones suaves para las flores - SIN SOMBRAS */
.flower-cursor-item img {
  transition: filter 0.4s ease;
}

/* Estilos específicos para móvil - SIN SOMBRAS */
@media (hover: none) and (pointer: coarse) {
  .flower-cursor-container {
    display: block !important;
  }

  body {
    cursor: auto !important;
  }

  /* Forzar eliminación de sombras en móvil */
  .flower-cursor-item,
  .flower-cursor-item *,
  .flower-cursor-item img,
  .flower-cursor-item .emoji {
    box-shadow: none !important;
    text-shadow: none !important;
    filter: none !important;
    -webkit-filter: none !important;
    -moz-filter: none !important;
    -ms-filter: none !important;
    -o-filter: none !important;
  }

  /* Solo permitir brillo en efectos especiales en móvil */
  .flower-cursor-item.special-explosion img {
    filter: brightness(1.2) saturate(1.3) !important;
  }

  .flower-cursor-item.special-explosion .emoji {
    filter: brightness(1.2) saturate(1.3) !important;
  }
}
