/**
 TAGOM GS - Master Stylesheet */
 * MODULO: Estilos Visuales Neón/Musical
 * VERSION: 1.0.0
 * ULTIMA MODIFICACION: 2026-04-06
 * AUTOR: Osiris
 */

:root {
    --tagom-cyan: #00f2ff;
    --tagom-magenta: #bc00ff;
    --tagom-dark: #080a0f;
    --tagom-card: rgba(13, 17, 23, 0.95);
}

body { 
    background: var(--tagom-dark); 
    color: #e0e0e0; 
    font-family: 'Orbitron', sans-serif; 
    height: 100vh; 
    display: flex; 
    align-items: center; 
    justify-content: center; 
    overflow: hidden;
    background: radial-gradient(circle at center, #1a1f29 0%, #080a0f 100%);
    margin: 0;
}

.audio-visualizer {
    position: absolute;
    bottom: 0;
    width: 100%;
    height: 150px;
    display: flex;
    align-items: flex-end;
    justify-content: center;
    gap: 5px;
    opacity: 0.2;
    z-index: 0;
}

.bar {
    width: 10px;
    background: var(--tagom-cyan);
    animation: bounce 1.2s infinite ease-in-out;
}

@keyframes bounce {
    0%, 100% { height: 10px; }
    50% { height: 100px; }
}

.login-card { 
    background: var(--tagom-card); 
    border: 1px solid rgba(0, 242, 255, 0.3); 
    border-radius: 4px; 
    padding: 3rem; 
    width: 100%; 
    max-width: 450px; 
    box-shadow: 0 0 40px rgba(0, 0, 0, 0.8); 
    position: relative;
    z-index: 10;
    backdrop-filter: blur(10px);
}

.login-card::before { content: ''; position: absolute; top: -2px; left: -2px; width: 30px; height: 30px; border-top: 3px solid var(--tagom-cyan); border-left: 3px solid var(--tagom-cyan); }
.login-card::after { content: ''; position: absolute; bottom: -2px; right: -2px; width: 30px; height: 30px; border-bottom: 3px solid var(--tagom-magenta); border-right: 3px solid var(--tagom-magenta); }

.brand-logo { 
    font-weight: 900; font-size: 2.2rem; letter-spacing: 4px; text-align: center;
    background: linear-gradient(90deg, var(--tagom-cyan), var(--tagom-magenta));
    -webkit-background-clip: text; -webkit-text-fill-color: transparent;
}

.form-control { 
    background: rgba(26, 31, 41, 0.8); border: 1px solid #333; color: #fff; 
    border-radius: 0; padding: 0.8rem; font-family: 'Consolas', monospace;
}

.btn-tagom { 
    background: linear-gradient(45deg, #008f96, #00f2ff); color: #000; 
    border: none; font-weight: 900; width: 100%; padding: 1rem; 
    text-transform: uppercase; cursor: pointer;
}

.btn-tagom:hover { box-shadow: 0 0 25px var(--tagom-cyan); transform: scale(1.02); }
:root {
    --tagom-cyan: #00f2ff;
    --tagom-magenta: #ff00ff;
    --tagom-dark: #0d1117;
}

.tracking-widest { letter-spacing: 4px; }

.bg-dark-soft {
    background: rgba(255, 255, 255, 0.02) !important;
}

.btn-outline-magenta {
    color: var(--tagom-magenta);
    border-color: var(--tagom-magenta);
}

.btn-outline-magenta:hover {
    background: var(--tagom-magenta);
    color: #000;
    box-shadow: 0 0 15px var(--tagom-magenta);
}

/* Efecto de parpadeo para el modo espera */
.fa-satellite-dish {
    filter: drop-shadow(0 0 5px var(--tagom-cyan));
}