/**
 * BD Container Cursor Trail Styles - DAPPER EDITION
 * Stile minimal ed elegante come il sito Dapper
 * File: wp-content/plugins/bad-dog-elementor-addons/assets/cursor-trail/style.css
 */

 .bd-has-cursor-trail {
    position: relative;
    overflow: hidden;
}

/* Base pixel style */
.bd-cursor-pixel {
    position: absolute;
    pointer-events: none;
    will-change: transform, opacity;
    z-index: 100;
    image-rendering: pixelated;
    image-rendering: -moz-crisp-edges;
    image-rendering: crisp-edges;
}

/* Pixel statici - stile Dapper (GRANDI e SQUADRATI) */
.bd-static-pixel.style-retro-pixels {
    box-shadow: 
        0 0 8px rgba(0, 255, 163, 0.4),
        inset 0 0 3px rgba(255, 255, 255, 0.25);
}

/* Trail pixels - più sottili con gradiente smooth */
.bd-trail-pixel.style-retro-pixels {
    box-shadow: 
        0 0 8px rgba(0, 255, 163, 0.4),
        0 0 15px rgba(0, 255, 163, 0.2),
        inset 0 0 3px rgba(255, 255, 255, 0.25);
    transition: opacity 0.5s ease-out; /* Transizione più lunga per fade smooth */
}

/* Smooth Circles Style */
.bd-cursor-pixel.style-smooth-circles {
    border-radius: 50%;
    box-shadow: 0 0 12px rgba(0, 255, 163, 0.6);
}

/* Small Dots Style */
.bd-cursor-pixel.style-small-dots {
    width: 12px !important;
    height: 12px !important;
    border-radius: 50%;
    box-shadow: 0 0 8px rgba(0, 255, 163, 0.5);
}

/* Animazione pulse MOLTO SOTTILE per pixel statici (come Dapper) */
@keyframes bdPixelPulse {
    0%, 100% {
        opacity: var(--base-opacity, 0.4);
        transform: translate(-50%, -50%) scale(1);
    }
    50% {
        opacity: calc(var(--base-opacity, 0.4) * 1.4);
        transform: translate(-50%, -50%) scale(1.05);
    }
}

/* Trail pixels hanno transizione smooth con gradiente */
.bd-trail-pixel {
    transition: opacity 0.5s ease-out, transform 0.1s ease-out;
}

/* Performance optimization */
.bd-cursor-pixel {
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
    transform-style: preserve-3d;
    -webkit-transform-style: preserve-3d;
}

/* Accessibility - rispetta reduced motion */
@media (prefers-reduced-motion: reduce) {
    .bd-cursor-pixel {
        animation: none !important;
        transition: none !important;
    }
    
    .bd-static-pixel {
        opacity: 0.4 !important;
    }
}

/* Mobile - disabilita effetto su touch devices */
@media (hover: none) and (pointer: coarse) {
    .bd-cursor-pixel {
        display: none !important;
    }
}

/* Dark theme support */
@media (prefers-color-scheme: dark) {
    .bd-cursor-pixel.style-retro-pixels {
        box-shadow: 
            0 0 10px rgba(0, 255, 163, 0.5),
            inset 0 0 3px rgba(255, 255, 255, 0.3);
    }
}

/* Debug mode (aggiungi .debug al container per vedere boundaries) */
.bd-has-cursor-trail.debug .bd-cursor-pixel {
    border: 1px dashed rgba(255, 0, 0, 0.3);
}

.bd-has-cursor-trail.debug .bd-static-pixel::after {
    content: 'S';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: 10px;
    color: red;
    font-weight: bold;
}

.bd-has-cursor-trail.debug .bd-trail-pixel::after {
    content: 'T';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: 10px;
    color: blue;
    font-weight: bold;
}