/* Estilos Globales para Taller Web */
body {
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    letter-spacing: -0.01em;
}

/* Gradiente de texto */
.text-gradient {
    background: linear-gradient(135deg, #60a5fa 0%, #a855f7 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

/* Indicador de estado en vivo pulsante */
.status-dot {
    display: inline-block;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background-color: #22c55e;
    box-shadow: 0 0 0 0 rgba(34, 197, 94, 0.7);
    animation: pulse-green 2s infinite;
}

@keyframes pulse-green {
    0% {
        transform: scale(0.95);
        box-shadow: 0 0 0 0 rgba(34, 197, 94, 0.7);
    }
    70% {
        transform: scale(1);
        box-shadow: 0 0 0 6px rgba(34, 197, 94, 0);
    }
    100% {
        transform: scale(0.95);
        box-shadow: 0 0 0 0 rgba(34, 197, 94, 0);
    }
}

/* Transiciones suaves en tarjetas e interactividad */
.card {
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.list-group-item {
    transition: background-color 0.15s ease;
}

.list-group-item:hover {
    background-color: rgba(255, 255, 255, 0.03);
}

/* Código preformateado */
pre code {
    font-family: 'SFMono-Regular', Consolas, 'Liberation Mono', Menlo, monospace;
}