/* CordobaMU Navbar Styles - extracted from muarg/navbar.php */

/* Variables consistentes con sidebar */
.navbar-muarg {
    --bg-dark: rgba(30, 20, 15, 0.95);
    --border-gold: #c9a227;
    --border-soft: rgba(201, 162, 39, 0.3);
    --text-primary: #f5f0e8;
    --text-secondary: #d4c8b8;
    --accent-gold: #ffcc00;
    --accent-orange: #ff9500;
    --accent-green: #00ff88;
    --shadow-gold: rgba(201, 162, 39, 0.2);
}

.navbar-muarg {
    background: var(--bg-dark);
    border: 2px solid var(--border-gold);
    border-radius: 12px;
    padding: 12px 20px;
    box-shadow: 0 4px 20px rgba(0,0,0,0.5);
}

.nav-container {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    gap: 10px;
}

/* Botones de navegacion */
.nav-btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px 18px;
    background: rgba(60, 45, 30, 0.7);
    border: 1px solid var(--border-soft);
    border-radius: 8px;
    color: var(--text-secondary);
    font-size: 14px;
    font-weight: 600;
    text-decoration: none;
    cursor: pointer;
    transition: all 0.3s ease;
}

.nav-btn i {
    font-size: 18px;
    color: var(--accent-orange);
}

.nav-btn:hover {
    background: rgba(201, 162, 39, 0.2);
    border-color: var(--border-gold);
    color: var(--accent-gold);
    transform: translateY(-2px);
    box-shadow: 0 4px 15px var(--shadow-gold);
}

.nav-btn:hover i {
    color: var(--accent-gold);
}

/* Boton Register - verde */
.nav-btn.nav-btn-register {
    background: linear-gradient(135deg, rgba(34,197,94,0.3), rgba(34,197,94,0.15));
    border-color: rgba(34,197,94,0.6);
    color: #86efac;
}

.nav-btn.nav-btn-register i {
    color: #86efac;
}

.nav-btn.nav-btn-register:hover {
    background: linear-gradient(135deg, rgba(34,197,94,0.5), rgba(34,197,94,0.3));
    border-color: #22c55e;
    box-shadow: 0 4px 15px rgba(34,197,94,0.3);
    color: #86efac;
}

/* Boton VIP - morado/violeta premium */
.nav-btn.nav-btn-vip {
    background: linear-gradient(135deg, rgba(139, 92, 246, 0.3), rgba(139, 92, 246, 0.15));
    border-color: rgba(139, 92, 246, 0.6);
    color: #c4b5fd;
}

.nav-btn.nav-btn-vip i {
    color: #c4b5fd;
}

.nav-btn.nav-btn-vip:hover {
    background: linear-gradient(135deg, rgba(139, 92, 246, 0.5), rgba(139, 92, 246, 0.3));
    border-color: #8b5cf6;
    box-shadow: 0 4px 15px rgba(139, 92, 246, 0.3);
    color: #c4b5fd;
}

/* Boton Guias - dorado destacado */
.nav-btn.nav-btn-guide {
    background: linear-gradient(135deg, var(--border-gold), #8b6914);
    border-color: var(--accent-gold);
    color: #1a1208;
}

.nav-btn.nav-btn-guide i {
    color: #1a1208;
}

.nav-btn.nav-btn-guide:hover {
    box-shadow: 0 4px 20px var(--shadow-gold), 0 0 30px rgba(255, 204, 0, 0.3);
    transform: translateY(-3px);
}

/* Responsive */
@media (max-width: 768px) {
    .navbar-muarg {
        padding: 10px 12px;
    }

    .nav-btn {
        padding: 8px 12px;
        font-size: 13px;
    }

    .nav-btn span {
        display: none;
    }

    .nav-btn i {
        font-size: 20px;
    }

    .nav-btn.nav-btn-guide span {
        display: inline; /* Siempre mostrar texto en Guias */
    }
}

@media (max-width: 480px) {
    .nav-container {
        gap: 6px;
    }

    .nav-btn {
        padding: 8px 10px;
    }

    .nav-btn.nav-btn-guide span {
        display: none;
    }
}