/* Estilos personalizados y micro-interacciones premium */

body {
    font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, sans-serif;
}

/* Personalización de la barra de desplazamiento (Scrollbars) */
::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

::-webkit-scrollbar-track {
    background: #020617; /* slate-950 */
}

::-webkit-scrollbar-thumb {
    background: #1e1b4b; /* indigo-950 */
    border-radius: 10px;
    border: 2px solid #020617;
}

::-webkit-scrollbar-thumb:hover {
    background: #312e81; /* indigo-900 */
}

/* Efecto de brillo de neón suave en las tarjetas */
.glow-indigo {
    box-shadow: 0 0 20px -5px rgba(99, 102, 241, 0.2);
}

.glow-emerald {
    box-shadow: 0 0 20px -5px rgba(16, 185, 129, 0.2);
}

/* Efecto de elevación al flotar en las tarjetas interactuables */
.hover-lift {
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.hover-lift:hover {
    transform: translateY(-4px);
    box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.3), 0 0 15px -3px rgba(99, 102, 241, 0.1);
}

/* Animaciones personalizadas */
@keyframes heartPulse {
    0%, 100% { transform: scale(1); }
    50% { transform: scale(1.15); }
}

.heart-pulse {
    animation: heartPulse 1.2s infinite ease-in-out;
}

@keyframes shake {
    0%, 100% { transform: translateX(0); }
    20%, 60% { transform: translateX(-6px); }
    40%, 80% { transform: translateX(6px); }
}

.animate-shake {
    animation: shake 0.5s ease-in-out;
}